feat: storage extra metadata + user search fix

client/components/admin/admin-storage.vue

@@ -24,6 +24,12 @@
       v-tab-item(v-for='(tgt, n) in activeTargets', :key='tgt.key', :transition='false', :reverse-transition='false')
         v-card.pa-3(flat, tile)
           v-form
+            .targetlogo
+              img(:src='tgt.logo', :alt='tgt.title')
+            v-subheader.pl-0 {{tgt.title}}
+            .caption {{tgt.description}}
+            .caption: a(:href='tgt.website') {{tgt.website}}
+            v-divider.mt-3
             v-subheader.pl-0 Target Configuration
             .body-1.ml-3(v-if='!tgt.config || tgt.config.length < 1') This storage target has no configuration options you can modify.
             template(v-else, v-for='cfg in tgt.config')
@@ -163,6 +169,20 @@ export default {
 }
 </script>
 
-<style lang='scss'>
+<style lang='scss' scoped>
+
+.targetlogo {
+  width: 250px;
+  height: 85px;
+  float:right;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+
+  img {
+    max-width: 100%;
+    max-height: 50px;
+  }
+}
 
 </style>

client/components/admin/admin-theme.vue

@@ -39,6 +39,46 @@
                   v-btn(color='primary', :loading='loading', @click='save')
                     v-icon(left) chevron_right
                     span Save
+              v-card.mt-3
+                v-toolbar(color='primary', dark, dense, flat)
+                  v-toolbar-title
+                    .subheading Code Injection
+                v-card-text
+                  v-textarea(
+                    v-model='injectCSS'
+                    label='CSS Override'
+                    outline
+                    background-color='grey lighten-1'
+                    color='primary'
+                    persistent-hint
+                    hint='CSS code to inject after system default CSS'
+                    auto-grow
+                    )
+                  v-textarea.mt-2(
+                    v-model='injectHeader'
+                    label='Site Header'
+                    outline
+                    background-color='grey lighten-1'
+                    color='primary'
+                    persistent-hint
+                    hint='HTML code to be injected just before the closing head tag'
+                    auto-grow
+                    )
+                  v-textarea.mt-2(
+                    v-model='injectFooter'
+                    label='Site Footer'
+                    outline
+                    background-color='grey lighten-1'
+                    color='primary'
+                    persistent-hint
+                    hint='HTML code to be injected just before the closing body tag'
+                    auto-grow
+                    )
+                v-card-chin
+                  v-spacer
+                  v-btn(color='primary', :loading='loading', @click='save')
+                    v-icon(left) chevron_right
+                    span Save
             v-flex(lg6 xs12)
               v-card
                 v-toolbar(color='teal', dark, dense, flat)
@@ -61,7 +101,10 @@ export default {
         { text: 'Default', author: 'requarks.io', value: 'default' }
       ],
       selectedTheme: 'default',
-      darkModeInitial: false
+      darkModeInitial: false,
+      injectCSS: '',
+      injectHeader: '',
+      injectFooter: ''
     }
   },
   computed: {

client/components/common/user-search.vue

@@ -21,9 +21,10 @@
           label='Search Users...'
           v-model='search'
           prepend-icon='search'
-          :class='$vuetify.dark ? "grey darken-4" : "blue lighten-5"'
+          :background-color='$vuetify.dark ? "grey darken-4" : "blue lighten-5"'
           color='primary'
           ref='searchIpt'
+          hide-details
           )
         v-list(two-line)
           template(v-for='(usr, idx) in items')

client/components/setup.vue

@@ -286,14 +286,19 @@
           v-stepper-content(:step='conf.upgrade ? 6 : 5')
             v-card.text-xs-center(flat)
               template(v-if='loading')
-                v-progress-circular(size='64', indeterminate, color='blue')
-                .subheading Finalizing your installation...
+                .mt-3(style='width: 64px; display:inline-block;')
+                  atom-spinner(
+                    :animation-duration='800'
+                    :size='64'
+                    color='#1976d2'
+                    )
+                .subheading.primary--text.mt-3 Finalizing your installation...
               template(v-else-if='final.ok')
                 svg.icons.is-64: use(xlink:href='#nc-check-bold')
-                .subheading Installation complete!
+                .subheading.green--text Installation complete!
               template(v-else)
                 svg.icons.is-64: use(xlink:href='#nc-square-remove')
-                .subheading Something went wrong...
+                .subheading.red--text Something went wrong...
             v-container
               v-alert(type='success', outline, :value='!loading && final.ok') Wiki.js was configured successfully and is now ready for use.
               v-alert(type='error', outline, :value='!loading && !final.ok') {{ final.error }}
@@ -315,8 +320,12 @@
 
 import axios from 'axios'
 import _ from 'lodash'
+import { AtomSpinner } from 'epic-spinners'
 
 export default {
+  components: {
+    AtomSpinner
+  },
   props: {
     telemetryId: {
       type: String,

client/graph/admin/storage/storage-query-targets.gql

@@ -4,6 +4,9 @@ query {
       isEnabled
       key
       title
+      description
+      logo
+      website
       mode
       config {
         key

client/graph/admin/users/users-query-list.gql

@@ -4,7 +4,7 @@ query {
       id
       name
       email
-      provider
+      providerKey
       role
       createdAt
       updatedAt

client/graph/common/common-users-query-search.gql

@@ -4,7 +4,7 @@ query ($query: String!) {
       id
       name
       email
-      provider
+      providerKey
     }
   }
 }