Fix initial loading state

web/src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="alpha-banner py-1 px-3 bg-amber text-black">
-    <v-icon size="small" icon="mdi-bug" />
-    Em desenvolvimento! Versão 0.0.0.½ Alpha Gambiarra
+    <v-icon size="small" icon="mdi-bug" start />
+    <small>Em desenvolvimento! Versão 0.0.0.½ Alpha Gambiarra</small>
   </div>
   <v-app>
     <v-main>
@@ -17,12 +17,12 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router'
 import { useAppStore } from './store/appStore'
-import { onMounted } from 'vue'
+import { onBeforeMount } from 'vue'
 
 const router = useRouter()
 const appStore = useAppStore()
 
-onMounted(async () => {
+onBeforeMount(async () => {
   await appStore.fetchMe()
 
   if (!appStore.me) {
@@ -31,6 +31,8 @@ onMounted(async () => {
   }
 
   appStore.selectedCampus = appStore.me?.campus || ''
+
+  await appStore.fetchPrinters()
 })
 </script>
 
@@ -40,7 +42,7 @@ onMounted(async () => {
   bottom: 5px;
   right: 5px;
   z-index: 99999;
-  opacity: 0.7;
+  opacity: 0.5;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.12),
     0 4px 4px rgba(0, 0, 0, 0.12), 0 8px 8px rgba(0, 0, 0, 0.12),
     0 16px 16px rgba(0, 0, 0, 0.12);

web/src/layouts/default/View.vue

@@ -11,7 +11,7 @@
         class="ml-2"
         :items="campiSelectItems"
         v-model="appStore.selectedCampus"
-        @update:model-value="appStore.fetchPrinters"
+        @update:menu="appStore.fetchPrinters"
         hide-details
         center-affix
         variant="solo"

web/src/store/appStore.ts

@@ -15,7 +15,10 @@ export const useAppStore = defineStore('app', {
 
   actions: {
     async fetchPrinters(force = false) {
+      if (this.loadingPrinters) return
+
       this.loadingPrinters = true
+
       try {
         this.printers = await api<any[]>(
           `printer?${new URLSearchParams({

web/src/views/Home.vue

@@ -26,11 +26,5 @@
 import PrinterCard from '@/components/PrinterCard.vue'
 import { useAppStore } from '@/store/appStore'
 
-import { onMounted } from 'vue'
-
 const appStore = useAppStore()
-
-onMounted(async () => {
-  await appStore.fetchPrinters()
-})
 </script>