fix(control): startup and shutdown buttons were not reactive and flickered

This commit is contained in:
E44
2026-01-14 19:00:19 +01:00
parent 548f8ccba8
commit 1c59b40971
+22 -17
View File
@@ -20,6 +20,13 @@
import { selected_display_ids } from '$lib/ts/stores/select'; import { selected_display_ids } from '$lib/ts/stores/select';
import TipTapInput from './TipTapInput.svelte'; import TipTapInput from './TipTapInput.svelte';
import { db } from '$lib/ts/database'; import { db } from '$lib/ts/database';
import { liveQuery, type Observable } from 'dexie';
let all_display_states: Observable<'on' | 'off' | 'mixed'> | undefined = $state();
$effect(() => {
const ids = $selected_display_ids;
all_display_states = liveQuery(() => all_state(ids));
});
let popup_content: PopupContent = $state({ let popup_content: PopupContent = $state({
open: false, open: false,
@@ -115,7 +122,7 @@
<p>Bist du sicher, dass du alle ausgewählten Displays herunterfahren möchtest?</p> <p>Bist du sicher, dass du alle ausgewählten Displays herunterfahren möchtest?</p>
<div class="flex flex-row justify-end gap-2"> <div class="flex flex-row justify-end gap-2">
<Button className="button space" click_function={() => (popup_content.open = false)}> <Button className="button space font-bold" click_function={() => (popup_content.open = false)}>
Abbrechen Abbrechen
</Button> </Button>
<Button click_function={shutdown_action} className="button error space">Herunterfahren</Button> <Button click_function={shutdown_action} className="button error space">Herunterfahren</Button>
@@ -192,23 +199,21 @@
</div> </div>
<div class="flex flex-col gap-2 justify-between"> <div class="flex flex-col gap-2 justify-between">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
{#await all_state($selected_display_ids) then all} <Button
<Button className="px-3 flex gap-3 w-full xl:w-75 justify-normal"
className="px-3 flex gap-3 w-full xl:w-75 justify-normal" disabled={$all_display_states === 'on' || $selected_display_ids.length === 0}
disabled={all === 'on' || $selected_display_ids.length === 0} click_function={startup_action}
click_function={startup_action} >
> <Power /> PC hochfahren
<Power /> PC hochfahren </Button>
</Button>
<Button <Button
className="px-3 flex gap-3 w-full xl:w-75 justify-normal" className="px-3 flex gap-3 w-full xl:w-75 justify-normal"
disabled={all === 'off' || $selected_display_ids.length === 0} disabled={$all_display_states === 'off' || $selected_display_ids.length === 0}
click_function={ask_shutdonw} click_function={ask_shutdonw}
> >
<PowerOff /> PC herunterfahren</Button <PowerOff /> PC herunterfahren</Button
> >
{/await}
</div> </div>
<Button className="px-3 flex gap-3 w-full xl:w-75 justify-normal" disabled> <Button className="px-3 flex gap-3 w-full xl:w-75 justify-normal" disabled>
<SquareTerminal /> <SquareTerminal />