feat(settings): render title and menu image in notification

This commit is contained in:
2025-11-25 18:13:52 +01:00
parent 9f1e2015c6
commit 2e06600293
8 changed files with 128 additions and 53 deletions

View File

@@ -99,43 +99,22 @@ const { selectedButton: selected, selectorPosition } = useButtonNavigation({
},
});
const isMenuOpen = (menu: string) => {
const regex = new RegExp(`^${menu}[A-Z]`);
return regex.test(selected.value);
};
const settingsStore = useSettingsStore();
const isAnyOtherMenuOpen = (excludeMenu: string) => {
return ["options", "clock", "user"]
.filter((menu) => menu !== excludeMenu)
.some((menu) => isMenuOpen(menu));
};
watch(
selected,
(newSelected) => {
settingsStore.setActiveMenu(newSelected);
},
{ immediate: true },
);
</script>
<template>
<OptionsMenu
:x="33"
:y="121"
:is-open="isMenuOpen('options')"
:is-any-other-menu-open="isAnyOtherMenuOpen('options')"
/>
<ClockMenu
:x="81"
:y="121"
:is-open="isMenuOpen('clock')"
:is-any-other-menu-open="isAnyOtherMenuOpen('clock')"
/>
<UserMenu
:x="129"
:y="121"
:is-open="isMenuOpen('user')"
:is-any-other-menu-open="isAnyOtherMenuOpen('user')"
/>
<TouchScreenMenu
:x="177"
:y="121"
:opacity="1"
:is-any-other-menu-open="isAnyOtherMenuOpen('touchScreen')"
/>
<OptionsMenu :x="33" :y="121" />
<ClockMenu :x="81" :y="121" />
<UserMenu :x="129" :y="121" />
<TouchScreenMenu :x="177" :y="121" :opacity="1" />
<Selector :rect="selectorPosition" :opacity="1" />
</template>