feat: move Admin to left hand side menu

lnbits/static/js/base.js

@@ -333,12 +333,6 @@ window.windowMixin = {
     }
   },
 
-  computed: {
-    isAdminUser: function () {
-      return this.g.user?.admin
-    }
-  },
-
   methods: {
     changeColor: function (newValue) {
       document.body.setAttribute('data-theme', newValue)
@@ -348,9 +342,6 @@ window.windowMixin = {
       this.$q.dark.toggle()
       this.$q.localStorage.set('lnbits.darkMode', this.$q.dark.isActive)
     },
-    goToAdminConsole: function () {
-      window.location.href = '/admin?usr=' + this.g.user.id
-    },
     copyText: function (text, message, position) {
       var notify = this.$q.notify
       Quasar.utils.copyToClipboard(text).then(function () {

lnbits/static/js/components.js

@@ -177,6 +177,35 @@ Vue.component('lnbits-extension-list', {
   }
 })
 
+
+Vue.component('lnbits-admin-ui', {
+  data: function () {
+    return {
+      extensions: [],
+      user: null
+    }
+  },
+  template: `
+    <q-list v-if="user && user.admin" dense class="lnbits-drawer__q-list">
+      <q-item-label header>Admin</q-item-label>
+      <q-item clickable tag="a" :href="['/admin?usr=', user.id].join('')">
+        <q-item-section side>
+          <q-icon name="admin_panel_settings" color="grey-5" size="md"></q-icon>
+        </q-item-section>
+        <q-item-section>
+          <q-item-label lines="1" class="text-caption">Manage Server</q-item-label>
+        </q-item-section>
+      </q-item>
+    </q-list>
+  `,
+
+  created: function () {
+    if (window.user) {
+      this.user = LNbits.map.user(window.user)
+    }
+  }
+})
+
 Vue.component('lnbits-payment-details', {
   props: ['payment'],
   data: function () {

lnbits/templates/base.html

@@ -163,17 +163,6 @@
           >
             <q-tooltip>Toggle Dark Mode</q-tooltip>
           </q-btn>
-          <q-btn
-            v-if="isAdminUser"
-            dense
-            flat
-            round
-            @click="goToAdminConsole"
-            icon="admin_panel_settings"
-            size="sm"
-          >
-            <q-tooltip>Admin Console</q-tooltip>
-          </q-btn>
         </q-toolbar>
       </q-header>
 
@@ -186,6 +175,7 @@
         :elevated="$q.screen.lt.md"
       >
         <lnbits-wallet-list></lnbits-wallet-list>
+        <lnbits-admin-ui></lnbits-admin-ui>
         <lnbits-extension-list class="q-pb-xl"></lnbits-extension-list>
       </q-drawer>
       {% endblock %} {% block page_container %}