fix(ui): hidden components on hard reload

src/layouts/MainLayout.vue

@@ -1,8 +1,19 @@
 <template>
   <q-layout view="hHh Lpr fFf">
-    <ToolbarComponent
-      :pageTitle="route.meta.title as string"
-      @drawer-toggle="toggleLeftDrawer" />
+    <q-header elevated>
+      <q-toolbar>
+        <q-btn
+          flat
+          dense
+          round
+          icon="menu"
+          aria-label="Menu"
+          @click="toggleLeftDrawer" />
+        <q-toolbar-title>{{ route.meta.title as string }}</q-toolbar-title>
+        <q-space />
+        <div>v{{ APP_VERSION }}</div>
+      </q-toolbar>
+    </q-header>
     <LeftDrawer
       :drawer="leftDrawerOpen"
       @drawer-toggle="toggleLeftDrawer" />
@@ -20,8 +31,8 @@ import { ref } from 'vue';
 import { useQuasar } from 'quasar';
 import { useRoute } from 'vue-router';
 import BottomNavComponent from 'src/components/BottomNavComponent.vue';
-import ToolbarComponent from 'src/components/ToolbarComponent.vue';
 import LeftDrawer from 'src/components/LeftDrawer.vue';
+import { APP_VERSION } from 'src/version';
 
 const q = useQuasar();
 const route = useRoute();