Refactor components. Improve design. Improve routing

src/components/LeftDrawer.vue

@@ -17,6 +17,10 @@
             <q-item-section> {{ link.name }} </q-item-section>
           </q-item>
         </template>
+        <q-item clickable v-ripple @click="logout(router)">
+          <q-item-section avatar><q-icon name="logout" /></q-item-section
+          ><q-item-section>Logout</q-item-section>
+        </q-item>
       </q-list>
     </q-scroll-area>
   </q-drawer>
@@ -25,6 +29,10 @@
 <script lang="ts" setup>
 import { defineComponent } from 'vue';
 import { links } from 'src/router/navlinks.js';
+import { logout } from 'boot/appwrite';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
 
 defineProps(['drawer']);
 defineEmits(['drawer-toggle']);