feat(settings): render top and bottom bar, implement notifications stack and submenu navigation

app/components/Settings/BottomScreen/BottomScreen.vue

@@ -1,15 +1,44 @@
 <script setup lang="ts">
 import Background from "./Background.vue";
 import Menus from "./Menus/Menus.vue";
+import OptionsStartUp from "./Menus/Options/StartUp.vue";
+import OptionsLanguage from "./Menus/Options/Language.vue";
+import OptionsGbaMode from "./Menus/Options/GbaMode.vue";
 
 const store = useSettingsStore();
 
+const viewComponents: Record<string, Component> = {
+  optionsStartUp: OptionsStartUp,
+  optionsLanguage: OptionsLanguage,
+  optionsGbaMode: OptionsGbaMode,
+};
+
+const currentViewComponent = computed(() => {
+  if (store.currentView === "menu" || !store.currentView) return null;
+  return viewComponents[store.currentView] || null;
+});
+
+const handleBackNavigation = (event: KeyboardEvent) => {
+  if (event.key === "Escape" || event.key === "Backspace") {
+    if (store.navigationStack.length > 0) {
+      store.popNavigation();
+      event.preventDefault();
+    }
+  }
+};
+
 onMounted(() => {
   store.$reset();
+  window.addEventListener("keydown", handleBackNavigation);
+});
+
+onUnmounted(() => {
+  window.removeEventListener("keydown", handleBackNavigation);
 });
 </script>
 
 <template>
   <Background />
-  <Menus />
+  <Menus v-if="store.currentView === 'menu'" />
+  <component :is="currentViewComponent" v-else-if="currentViewComponent" />
 </template>