From f55eae0a9547cb69643ad6aefb70a8effd6a6e8f Mon Sep 17 00:00:00 2001
From: Axolotle <nchesnais@mailoo.org>
Date: Sun, 30 Aug 2020 17:09:19 +0200
Subject: [PATCH] automaticly add locale to url query and fix small templates

---
 app/src/helpers/api.js                |  9 ++++++---
 app/src/scss/main.scss                | 13 +++++++++++++
 app/src/views/domain/DomainDns.vue    |  5 +----
 app/src/views/service/ServiceInfo.vue |  8 ++++++--
 app/src/views/service/ServiceList.vue |  1 -
 app/src/views/tool/ToolList.vue       |  4 ++--
 app/src/views/tool/ToolLogs.vue       |  5 ++---
 app/src/views/user/UserInfo.vue       |  4 ++--
 8 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/app/src/helpers/api.js b/app/src/helpers/api.js
index 09e00b3d..6eea03b3 100644
--- a/app/src/helpers/api.js
+++ b/app/src/helpers/api.js
@@ -1,5 +1,7 @@
+import store from '@/store'
+
 function objectToParams (object) {
-  const urlParams = new URLSearchParams()
+  const urlParams = new URLSearchParams('locale=' + store.getters.locale)
   for (const [key, value] of Object.entries(object)) {
     urlParams.append(key, value)
   }
@@ -41,9 +43,10 @@ export default {
     }
   },
 
-  get (uri) {
+  get (uri, urlParams = {}) {
     return fetch(
-      '/api/' + uri, this.options
+      `/api/${uri}?${objectToParams(urlParams)}`,
+      this.options
     ).then(handleResponse)
   },
 
diff --git a/app/src/scss/main.scss b/app/src/scss/main.scss
index 27305cbd..de18d5f1 100644
--- a/app/src/scss/main.scss
+++ b/app/src/scss/main.scss
@@ -107,3 +107,16 @@ body {
     }
   }
 }
+
+.log {
+  .card-body {
+    padding: 0;
+
+    pre {
+      margin-bottom: 0;
+      padding: 1rem;
+      background-color: $light;
+    }
+
+  }
+}
diff --git a/app/src/views/domain/DomainDns.vue b/app/src/views/domain/DomainDns.vue
index 6c30e9be..e3dede92 100644
--- a/app/src/views/domain/DomainDns.vue
+++ b/app/src/views/domain/DomainDns.vue
@@ -7,7 +7,7 @@
       <template v-slot:header>
         <h2><icon iname="globe" /> {{ $t('domain_dns_config') }}</h2>
       </template>
-      <pre class="mb-0 p-3 bg-light"><code>{{ dnsConfig }}</code></pre>
+      <pre><code>{{ dnsConfig }}</code></pre>
     </b-card>
   </div>
 </template>
@@ -38,7 +38,4 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.card-body {
-  padding: 0;
-}
 </style>
diff --git a/app/src/views/service/ServiceInfo.vue b/app/src/views/service/ServiceInfo.vue
index 8208e300..624f207d 100644
--- a/app/src/views/service/ServiceInfo.vue
+++ b/app/src/views/service/ServiceInfo.vue
@@ -46,8 +46,7 @@
             <icon :iname="status === 'running' ? 'check-circle' : 'times'" />
             {{ status }}
           </span>
-          <!-- FIXME format date to: (now - date) as words -->
-          {{ $t('since') }} {{ last_state_change }}
+          {{ $t('since') }} {{ last_state_change | distanceToNow }}
         </dd>
         <hr>
 
@@ -88,6 +87,7 @@
 
 <script>
 import api from '@/helpers/api'
+import { distanceToNow } from '@/filters/date'
 
 export default {
   name: 'ServiceInfo',
@@ -114,6 +114,10 @@ export default {
     }
   },
 
+  filters: {
+    distanceToNow
+  },
+
   computed: {
   },
 
diff --git a/app/src/views/service/ServiceList.vue b/app/src/views/service/ServiceList.vue
index 0b26a546..a497b790 100644
--- a/app/src/views/service/ServiceList.vue
+++ b/app/src/views/service/ServiceList.vue
@@ -23,7 +23,6 @@
               <icon :iname="status === 'running' ? 'check-circle' : 'times'" />
               {{ $t(status) }}
             </span>
-            <!-- FIXME format date to: (now - date) as words -->
             {{ $t('since') }} {{ last_state_change | distanceToNow }}
           </p>
         </div>
diff --git a/app/src/views/tool/ToolList.vue b/app/src/views/tool/ToolList.vue
index df739abf..9f8d55ca 100644
--- a/app/src/views/tool/ToolList.vue
+++ b/app/src/views/tool/ToolList.vue
@@ -26,8 +26,8 @@ export default {
         { id: 1, routeName: 'tool-migrations', icon: 'share', translation: 'migrations' },
         { id: 2, routeName: 'tool-firewall', icon: 'shield', translation: 'firewall' },
         { id: 3, routeName: 'tool-adminpw', icon: 'key-modern', translation: 'tools_adminpw' },
-        { id: 3, routeName: 'tool-wabadmin', icon: 'cog', translation: 'tools_webadmin_settings' },
-        { id: 4, routeName: 'tool-power', icon: 'power-off', translation: 'tools_shutdown_reboot' }
+        { id: 4, routeName: 'tool-wabadmin', icon: 'cog', translation: 'tools_webadmin_settings' },
+        { id: 5, routeName: 'tool-power', icon: 'power-off', translation: 'tools_shutdown_reboot' }
       ]
     }
   }
diff --git a/app/src/views/tool/ToolLogs.vue b/app/src/views/tool/ToolLogs.vue
index 5d2b6809..04b95fb3 100644
--- a/app/src/views/tool/ToolLogs.vue
+++ b/app/src/views/tool/ToolLogs.vue
@@ -16,7 +16,7 @@
       <b-list-group flush>
         <b-list-group-item
           v-for="log in filteredOperations" :key="log.name"
-          :to="{ name: 'tool-log', params: { name: log.name } }"
+          :to="{ name: 'tool-log', params: { name: log.name || log.log_path } }"
           :title="log.started_at | readableDate"
         >
           <small class="mr-3">{{ log.started_at | distanceToNow }} </small>
@@ -59,9 +59,8 @@ export default {
 
   methods: {
     fetchData () {
-      // simply use the api helper since we will not store the request's result.
       // FIXME only prints operation for now (can't receive 'history', 'app', 'service', etc.)
-      api.get('logs?limit=25&with_details').then(({ operation }) => {
+      api.get('logs', { limit: 25, with_details: '' }).then(({ operation }) => {
         operation.forEach((log, index) => {
           if (log.success === '?') {
             operation[index].icon = 'question'
diff --git a/app/src/views/user/UserInfo.vue b/app/src/views/user/UserInfo.vue
index b0448e2a..102bf88d 100644
--- a/app/src/views/user/UserInfo.vue
+++ b/app/src/views/user/UserInfo.vue
@@ -86,9 +86,9 @@
     >
       <b-form-group>
         <template v-slot:description>
-          <span class="bg-warning p-2 text-dark">
+          <b-alert variant="warning" show>
             <icon iname="exclamation-triangle" /> {{ $t('purge_user_data_warning') }}
-          </span>
+          </b-alert>
         </template>
         <b-form-checkbox v-model="purge" class="mb-3">
           {{ $t('purge_user_data_checkbox', {name: user.username}) }}