Darkages/SpotMicroESP32-Leika
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🧼 Updates menu list

Browse Source
This commit is contained in:
Rune Harlyk
2025-03-01 23:09:45 +01:00
committed by Rune Harlyk
parent 113ac1bc2c
commit 31dd7f7ba4
3 changed files with 24 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/lib/components/GithubUpdateDialog.svelte
+3 -5
View File
@@ -1,6 +1,4 @@
<script lang="ts"> <script lang="ts">
import { run } from 'svelte/legacy';
import { focusTrap } from 'svelte-focus-trap'; import { focusTrap } from 'svelte-focus-trap';
import { fly } from 'svelte/transition'; import { fly } from 'svelte/transition';
import { telemetry } from '$lib/stores/telemetry'; import { telemetry } from '$lib/stores/telemetry';
@@ -17,13 +15,13 @@
let updating = $state(true); let updating = $state(true);
let progress = $state(0); let progress = $state(0);
run(() => { $effect(() => {
if ($telemetry.download_ota.status == 'progress') { if ($telemetry.download_ota.status == 'progress') {
progress = $telemetry.download_ota.progress; progress = $telemetry.download_ota.progress;
} }
}); });
run(() => { $effect(() => {
if ($telemetry.download_ota.status == 'error') { if ($telemetry.download_ota.status == 'error') {
updating = false; updating = false;
} }
@@ -32,7 +30,7 @@
let message = $state('Preparing ...'); let message = $state('Preparing ...');
let timerId: number = $state(); let timerId: number = $state();
run(() => { $effect(() => {
if ($telemetry.download_ota.status == 'progress') { if ($telemetry.download_ota.status == 'progress') {
message = 'Downloading ...'; message = 'Downloading ...';
} else if ($telemetry.download_ota.status == 'error') { } else if ($telemetry.download_ota.status == 'error') {
app/src/lib/components/menu/Menu.svelte
+15 -15
View File
@@ -1,8 +1,5 @@
<script lang="ts"> <script lang="ts">
import { run } from 'svelte/legacy'; import { page } from '$app/state';
import { page } from '$app/stores';
import { createEventDispatcher } from 'svelte';
import { useFeatureFlags } from '$lib/stores/featureFlags'; import { useFeatureFlags } from '$lib/stores/featureFlags';
import GithubButton from '../menu/GithubButton.svelte'; import GithubButton from '../menu/GithubButton.svelte';
import LogoButton from '../menu/LogoButton.svelte'; import LogoButton from '../menu/LogoButton.svelte';
@@ -29,11 +26,11 @@
const features = useFeatureFlags(); const features = useFeatureFlags();
const appName = $page.data.app_name; const appName = page.data.app_name;
const copyright = $page.data.copyright; const copyright = page.data.copyright;
const github = { href: 'https://github.com/' + $page.data.github, active: true }; const github = { href: 'https://github.com/' + page.data.github, active: true };
type menuItem = { type menuItem = {
title: string; title: string;
@@ -44,8 +41,9 @@
submenu?: menuItem[]; submenu?: menuItem[];
}; };
let menuItems = $state(); let menuItems = $state<menuItem[]>([]);
run(() => {
$effect(() => {
menuItems = [ menuItems = [
{ {
title: 'Connection', title: 'Connection',
@@ -137,14 +135,16 @@
icon: Update, icon: Update,
href: '/system/update', href: '/system/update',
feature: feature:
$features.ota || $features.upload_firmware || $features.download_firmware $features.ota ||
$features.upload_firmware ||
$features.download_firmware
} }
] ]
} }
] as menuItem[]; ] as menuItem[];
}); });
const dispatch = createEventDispatcher(); const { menuClicked } = $props();
function setActiveMenuItem(targetTitle: string) { function setActiveMenuItem(targetTitle: string) {
menuItems.forEach(item => { menuItems.forEach(item => {
@@ -154,11 +154,11 @@
}); });
}); });
menuItems = menuItems; menuItems = menuItems;
dispatch('menuClicked'); menuClicked();
} }
run(() => { $effect(() => {
setActiveMenuItem($page.data.title); setActiveMenuItem(page.data.title);
}); });
const updateMenu = (event: any) => { const updateMenu = (event: any) => {
@@ -169,7 +169,7 @@
<div class="bg-base-200 text-base-content flex h-full w-80 flex-col p-4"> <div class="bg-base-200 text-base-content flex h-full w-80 flex-col p-4">
<LogoButton {appName} /> <LogoButton {appName} />
<MenuList {menuItems} on:select{updateMenu} class="flex-grow flex-nowrap overflow-y-auto" /> <MenuList {menuItems} select={updateMenu} class="flex-grow flex-nowrap overflow-y-auto" />
<div class="divider my-0"></div> <div class="divider my-0"></div>
app/src/lib/components/menu/MenuList.svelte
+6 -1
View File
@@ -27,7 +27,12 @@
{menuItem.title} {menuItem.title}
</summary> </summary>
<div class="pl-4"> <div class="pl-4">
<MenuList menuItems={menuItem.submenu} level={level + 1} /> <MenuList
menuItems={menuItem.submenu}
level={level + 1}
{select}
class={klass}
/>
</div> </div>
</details> </details>
{:else} {:else}