vrr/Pulse
2
0
Fork 0
mirror of https://github.com/rcourtman/Pulse.git synced 2026-04-26 10:31:17 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: Add kiosk mode for clean dashboard display

Browse source 
Add ?kiosk=1 URL parameter to hide the filter panel and section nav
for a cleaner dashboard view. Useful for dedicated LCD displays or
wallboard setups.

Related to #917
This commit is contained in:
rcourtman 2025-12-26 18:06:28 +00:00
parent cf577e715f
commit 2dc144f8dd
1 changed files with 37 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

60
frontend-modern/src/components/Dashboard/Dashboard.tsx
View file

@ -210,6 +210,15 @@ export function Dashboard(props: DashboardProps) {
const { isMobile } = useBreakpoint();
const alertsActivation = useAlertsActivation();
const alertsEnabled = createMemo(() => alertsActivation.activationState() === 'active');
// Kiosk mode - hide filter panel for clean dashboard display
// Usage: Add ?kiosk=1 to URL
const kioskMode = createMemo(() => {
if (typeof window === 'undefined') return false;
const params = new URLSearchParams(window.location.search);
return params.get('kiosk') === '1' || params.get('kiosk') === 'true';
});
const [search, setSearch] = createSignal('');
const [isSearchLocked, setIsSearchLocked] = createSignal(false);
const [selectedNode, setSelectedNode] = createSignal<string | null>(null);
@ -940,7 +949,10 @@ export function Dashboard(props: DashboardProps) {
return (
<div class="space-y-3">
<ProxmoxSectionNav current="overview" />
{/* Section nav - hidden in kiosk mode */}
<Show when={!kioskMode()}>
<ProxmoxSectionNav current="overview" />
</Show>
{/* Unified Node Selector */}
<UnifiedNodeSelector
@ -953,28 +965,30 @@ export function Dashboard(props: DashboardProps) {
searchTerm={search()}
/>
{/* Dashboard Filter */}
<DashboardFilter
search={search}
setSearch={setSearch}
isSearchLocked={isSearchLocked}
viewMode={viewMode}
setViewMode={setViewMode}
statusMode={statusMode}
setStatusMode={setStatusMode}
problemsMode={problemsMode}
setProblemsMode={setProblemsMode}
filteredProblemGuests={problemGuests}
groupingMode={groupingMode}
setGroupingMode={setGroupingMode}
setSortKey={setSortKey}
setSortDirection={setSortDirection}
searchInputRef={(el) => (searchInputRef = el)}
availableColumns={columnVisibility.availableToggles()}
isColumnHidden={columnVisibility.isHiddenByUser}
onColumnToggle={columnVisibility.toggle}
onColumnReset={columnVisibility.resetToDefaults}
/>
{/* Dashboard Filter - hidden in kiosk mode */}
<Show when={!kioskMode()}>
<DashboardFilter
search={search}
setSearch={setSearch}
isSearchLocked={isSearchLocked}
viewMode={viewMode}
setViewMode={setViewMode}
statusMode={statusMode}
setStatusMode={setStatusMode}
problemsMode={problemsMode}
setProblemsMode={setProblemsMode}
filteredProblemGuests={problemGuests}
groupingMode={groupingMode}
setGroupingMode={setGroupingMode}
setSortKey={setSortKey}
setSortDirection={setSortDirection}
searchInputRef={(el) => (searchInputRef = el)}
availableColumns={columnVisibility.availableToggles()}
isColumnHidden={columnVisibility.isHiddenByUser}
onColumnToggle={columnVisibility.toggle}
onColumnReset={columnVisibility.resetToDefaults}
/>
</Show>
{/* Loading State */}
<Show when={connected() && !initialDataReceived()}>