feat: copy user token in admin

server/locales/en.json

@@ -195,6 +195,8 @@
   "admin.flags.authDebug.label": "Auth Debug",
   "admin.flags.experimental.hint": "Enable unstable / unfinished features. DO NOT enable in a production environment!",
   "admin.flags.experimental.label": "Experimental Features",
+  "admin.flags.getTokenHint": "Copy your current authentication token for use in GraphQL API testing.",
+  "admin.flags.getTokenLabel": "Get Current Token",
   "admin.flags.saveSuccess": "Flags have been updated successfully.",
   "admin.flags.sqlLog.hint": "Log all queries made to the database to console.",
   "admin.flags.sqlLog.label": "SQL Query Logging",

ux/src/components/PageTags.vue

@@ -6,7 +6,7 @@
       color='secondary'
       text-color='white'
       dense
-      clickable
+      :clickable='!props.edit'
       :removable='props.edit'
       @remove='removeTag(tag)'
       v-for='tag of pageStore.tags'

ux/src/pages/AdminFlags.vue

@@ -105,6 +105,22 @@ q-page.admin-flags
               disabled
             )
 
+      q-card.q-py-sm.q-mt-md
+        q-item
+          blueprint-icon(icon='key')
+          q-item-section
+            q-item-label {{t(`admin.flags.getTokenLabel`)}}
+            q-item-label(caption) {{t(`admin.flags.getTokenHint`)}}
+          q-item-section(avatar)
+            q-btn(
+              ref='copyTokenBtn'
+              :label='t(`common.actions.copy`)'
+              unelevated
+              icon='las la-clipboard'
+              color='primary'
+              text-color='white'
+            )
+
     .col-12.col-lg-5.gt-md
       .q-pa-md.text-center
         img(src='/_assets/illustrations/undraw_settings.svg', style='width: 80%;')
@@ -112,13 +128,15 @@ q-page.admin-flags
 
 <script setup>
 import gql from 'graphql-tag'
-import { defineAsyncComponent, onMounted, reactive, ref } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { cloneDeep, omit } from 'lodash-es'
 import { useMeta, useQuasar } from 'quasar'
 import { useI18n } from 'vue-i18n'
+import ClipboardJS from 'clipboard'
 
 import { useSiteStore } from 'src/stores/site'
 import { useFlagsStore } from 'src/stores/flags'
+import { useUserStore } from 'src/stores/user'
 
 // QUASAR
 
@@ -128,6 +146,7 @@ const $q = useQuasar()
 
 const flagsStore = useFlagsStore()
 const siteStore = useSiteStore()
+const userStore = useUserStore()
 
 // I18N
 
@@ -150,6 +169,10 @@ const state = reactive({
   }
 })
 
+// REFS
+
+const copyTokenBtn = ref(null)
+
 // METHODS
 
 async function load () {
@@ -207,6 +230,25 @@ async function save () {
 
 onMounted(async () => {
   load()
+  const clip = new ClipboardJS(copyTokenBtn.value.$el, {
+    text: () => {
+      return userStore.token
+    }
+  })
+
+  clip.on('success', () => {
+    $q.notify({
+      type: 'positive',
+      message: 'Token copied successfully',
+      icon: 'las la-clipboard'
+    })
+  })
+  clip.on('error', () => {
+    $q.notify({
+      type: 'negative',
+      message: 'Failed to copy token'
+    })
+  })
 })
 
 </script>

ux/src/pages/AdminSystem.vue

@@ -355,7 +355,7 @@ Total RAM: ${state.info.ramTotal}`
   clip.on('error', () => {
     $q.notify({
       type: 'negative',
-      message: 'Failed to copy to system info'
+      message: 'Failed to copy system info'
     })
   })
 })

ux/src/pages/Search.vue

@@ -401,7 +401,7 @@ async function performSearch () {
     if (!resp?.data?.searchPages) {
       throw new Error('Unexpected error')
     }
-    state.results = cloneDeep(resp.data.searchPages.results)
+    state.results = cloneDeep(resp.data.searchPages.results).map(r => { r.tags.sort(); return r })
     state.total = resp.data.searchPages.totalHits
     siteStore.searchLastQuery = siteStore.search
   } catch (err) {