🚸 Make menu button toggle settings

src/components/titlebar-element.vue

@@ -1,17 +1,28 @@
 <script setup>
 import MenuIcon from "./icons/menu-icon.vue";
 import { computed } from "vue";
-import { useRoute, RouterLink } from "vue-router";
+import { useRoute, useRouter, RouterLink } from "vue-router";
+import { lastRoute } from "../store";
 
 const route = useRoute();
+const router = useRouter();
 const routeName = computed(() => route.name);
+function goBack() {
+  if (routeName.value != "Settings") return;
+  if (lastRoute.value.name) router.go(-1);
+  else router.push("/timetable");
+}
 </script>
 
 <template>
   <div class="titlebar">
     <span class="title">{{ routeName }}</span>
     <div class="settings">
-      <RouterLink to="/settings" v-show="$route.name != 'Login'">
+      <RouterLink
+        to="/settings"
+        v-show="$route.name != 'Login'"
+        @click="goBack()"
+      >
         <MenuIcon />
       </RouterLink>
     </div>

src/router/index.js

@@ -1,4 +1,5 @@
 import { createRouter, createWebHistory } from "vue-router";
+import { lastRoute } from "../store";
 import TimetableView from "../views/TimetableView.vue";
 import SubstitutionView from "../views/SubstitutionView.vue";
 import HistoryView from "../views/HistoryView.vue";
@@ -40,4 +41,9 @@ const router = createRouter({
   ],
 });
 
+router.beforeEach((_to, from) => {
+  lastRoute.value = from;
+  return true;
+});
+
 export default router;

src/store.js

@@ -2,6 +2,8 @@ import { computed } from "@vue/reactivity";
 import { ref, watch } from "vue";
 import router from "./router";
 
+export const lastRoute = ref();
+
 export const substitutionFilter = ref(
   localStorage.getItem("substitutionFilter") || "all"
 );