feat: vue-apollo + auth providers resolver (wip)

client/components/admin-api.vue

@@ -5,6 +5,9 @@
       .subheading.grey--text Manage keys to access the API
     v-card
       v-card-title
+        v-btn(color='green', dark)
+          v-icon(left) power_settings_new
+          | Enable API
         v-btn(color='primary', dark)
           v-icon(left) add
           | New API Key

client/components/admin-auth.vue

@@ -6,24 +6,12 @@
         .subheading.grey--text Configure the authentication settings of your wiki
       v-tabs(color='grey lighten-4', grow, slider-color='primary', show-arrows)
         v-tab(key='settings'): v-icon settings
-        v-tab(key='db') Local
-        v-tab(key='algolia') Auth0
-        v-tab(key='elasticsearch') Azure AD
-        v-tab(key='solr') Discord
-        v-tab(key='solr') Dropbox
-        v-tab(key='solr') Facebook
-        v-tab(key='solr') GitHub
-        v-tab(key='solr') Google
-        v-tab(key='solr') LDAP
-        v-tab(key='solr') Microsoft
-        v-tab(key='solr') OAuth2 Generic
-        v-tab(key='solr') Slack
-        v-tab(key='solr') Twitch
+        v-tab(v-for='provider in providers', :key='provider.key') {{ provider.title }}
 
         v-tab-item(key='settings')
           v-card.pa-3
             v-form
-              v-checkbox(v-for='(engine, n) in engines', v-model='auths', :key='n', :label='engine.text', :value='engine.value', color='primary')
+              v-checkbox(v-for='(provider, n) in providers', v-model='auths', :key='provider.key', :label='provider.title', :value='provider.key', color='primary')
               v-divider
               v-btn(color='primary')
                 v-icon(left) chevron_right
@@ -34,18 +22,20 @@
 </template>
 
 <script>
+/* global CONSTANTS */
+
 export default {
   data() {
     return {
-      engines: [
-        { text: 'Local', value: 'local' },
-        { text: 'Auth0', value: 'auth0' },
-        { text: 'Algolia', value: 'algolia' },
-        { text: 'Elasticsearch', value: 'elasticsearch' },
-        { text: 'Solr', value: 'solr' }
-      ],
+      providers: [],
       auths: ['local']
     }
+  },
+  apollo: {
+    providers: {
+      query: CONSTANTS.GRAPH.AUTHENTICATION.QUERY_PROVIDERS,
+      update: (data) => data.authentication.providers
+    }
   }
 }
 </script>

client/components/nav-header.vue

@@ -4,7 +4,7 @@
     v-toolbar-title
       span.subheading Wiki.js
     v-spacer
-    v-progress-circular.mr-3(indeterminate, color='blue')
+    v-progress-circular.mr-3(indeterminate, color='blue', v-if='$apollo.loading')
     v-btn(icon)
       v-icon(color='grey') search
     v-btn(icon, @click.native='darkTheme = !darkTheme')