Correction to the kiosk grid design (user, 2026-08-26): tiles now match the Dashboard's ZoneCard -- one tile per room showing its TRV and AC together (reusing ZoneCard's own rad-row/ac-block/fan-bar CSS), not a separate tile per device. Selection/bulk-edit now operates on selected zones, gathering every live device across them for KioskBulkPanel's type-aware sections. Single-zone tap opens a modal listing that zone's device panels, mirroring ZoneDetailModal's device loop minus the staff-only schedule/override UI. - KioskZoneBlock.tsx replaces KioskDeviceBlock.tsx - KioskZonePanel.tsx: new, one control panel per live device in a zone Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
27 lines
1.2 KiB
TypeScript
27 lines
1.2 KiB
TypeScript
import type { DeviceSummary } from '../types'
|
|
import MhiControlPanel from './MhiControlPanel'
|
|
import DaikinControlPanel from './DaikinControlPanel'
|
|
import TrvControlPanel from './TrvControlPanel'
|
|
|
|
// Single-zone edit modal content — one card per live device in this zone, each
|
|
// with its normal control panel. Same "loop the zone's devices, render the
|
|
// matching control panel" pattern as ZoneDetailModal.tsx, minus the staff-only
|
|
// schedule/override sections (kiosk isn't for editing scheduling config).
|
|
export default function KioskZonePanel({ devices }: { devices: DeviceSummary[] }) {
|
|
if (devices.length === 0) {
|
|
return <p className="muted">No live-controllable devices in this zone.</p>
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
{devices.map(d => (
|
|
<div key={d.id} className="card">
|
|
<div style={{ fontWeight: 600, fontSize: 13 }}>{d.location || d.discovered_name || d.external_ref}</div>
|
|
{d.device_type === 'shelly_trv' && <TrvControlPanel deviceId={d.id} canControl={true} />}
|
|
{d.device_type === 'mhi_mqtt' && <MhiControlPanel deviceId={d.id} canControl={true} />}
|
|
{d.device_type === 'daikin' && <DaikinControlPanel deviceId={d.id} canControl={true} />}
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|