Account login possible

software/src/App.vue

@@ -1,13 +1,12 @@
 <script setup lang="ts">
-import { ref } from 'vue';
 import { useTheme } from 'vuetify/lib/framework.mjs';
 import { useUserStore } from './data/stores/userStore';
-import vuetify from './plugins/vuetify';
-import { useBasketStore } from './data/stores/basketStore';
 import { i18n } from './plugins/i18n';
+import { ref } from 'vue';
+import vuetify from './plugins/vuetify';
+import navigationDrawer from './components/navigationDrawer.vue';
 
 const userStore = useUserStore()
-const basketStore = useBasketStore()
 const theme = useTheme()
 const navRail = ref(vuetify.display.mobile)
 
@@ -24,39 +23,7 @@ i18n.global.locale = userStore.language
     </v-app-bar>
 
     <v-navigation-drawer :rail="navRail" permanent>
-      <v-list>
-        <v-list-subheader>
-          <div v-if="!navRail">{{ $t('menu.shopping') }}</div>
-          <div v-else></div>
-        </v-list-subheader>
-        <v-list-item :title="$t('menu.products')" prepend-icon="mdi-store" to="/" link />
-        <v-list-item :title="$t('menu.basket')" to="/basket" link >
-          <template v-slot:prepend>
-            <v-badge color="primary" :content="basketStore.itemsInBasket.length">
-              <v-icon icon="mdi-cart" />
-            </v-badge>
-          </template>
-        </v-list-item>
-
-        <v-divider />
-
-        <v-list-subheader>
-          <div v-if="!navRail">{{ $t('menu.account') }}</div>
-          <div v-else></div>
-        </v-list-subheader>
-        <v-list-item :title="$t('menu.login')" prepend-icon="mdi-login" to="/login" link />
-        <v-list-item :title="$t('menu.account')" prepend-icon="mdi-account" to="/account" link />
-        <v-list-item :title="$t('menu.orders')" prepend-icon="mdi-cart-check" to="/orders" link />
-
-        <v-divider />
-        
-        <v-list-subheader>
-          <div v-if="!navRail">{{ $t('menu.systemAndHelp') }}</div>
-          <div v-else></div>
-        </v-list-subheader>
-        <v-list-item :title="$t('menu.helpInstructions')" prepend-icon="mdi-chat-question" to="/help" link />
-        <v-list-item :title="$t('menu.preferences')" prepend-icon="mdi-cog" to="/preferences" link />
-      </v-list>
+      <navigation-drawer v-model:nav-rail="navRail" />
     </v-navigation-drawer>
 
     <v-main>