feat(DeviceDetailOverlay): add clear cache button and enhance mode selection UI

This commit is contained in:
Jaime Idolpx 2026-06-11 22:03:54 -04:00
parent d9f95c6864
commit d05eaaa84d

View File

@ -431,25 +431,42 @@ export default function DeviceDetailOverlay({
<button <button
onClick={() => setBrowsingField('cache')} onClick={() => setBrowsingField('cache')}
className="px-3 py-2 border border-neutral-300 rounded-lg bg-neutral-50 hover:bg-neutral-100" className="px-3 py-2 border border-neutral-300 rounded-lg bg-neutral-50 hover:bg-neutral-100"
title="Browse"
> >
<FolderOpen className="w-5 h-5" /> <FolderOpen className="w-5 h-5" />
</button> </button>
<button
onClick={() => {
const path = getDevicePath();
updateDeviceSetting([...path, 'cache'], '');
}}
className="px-3 py-2 border border-neutral-300 rounded-lg bg-neutral-50 hover:bg-red-50 hover:border-red-300 hover:text-red-500"
title="Clear Cache"
>
<X className="w-5 h-5" />
</button>
</div> </div>
</div> </div>
)} )}
{deviceData.mode !== undefined && ( {deviceData.mode !== undefined && (
<div> <div className="flex items-center justify-between">
<label className="text-sm text-neutral-500 block mb-2">Mode</label> <label className="text-sm text-neutral-500">Mode</label>
<input <div className="flex rounded-lg border border-neutral-300 overflow-hidden text-sm">
type="number" {([0, 1] as const).map((val, i) => (
value={deviceData.mode} <button
onChange={(e) => { key={val}
const path = getDevicePath(); onClick={() => updateDeviceSetting([...getDevicePath(), 'mode'], val)}
updateDeviceSetting([...path, 'mode'], parseInt(e.target.value)); className={`px-4 py-2 ${i > 0 ? 'border-l border-neutral-300' : ''} ${
}} (deviceData.mode ?? 0) === val
className="w-full px-3 py-2 border border-neutral-300 rounded-lg" ? 'bg-blue-600 text-white'
/> : 'bg-white text-neutral-700 hover:bg-neutral-50'
}`}
>
{val === 0 ? 'Read Only' : 'Write Enabled'}
</button>
))}
</div>
</div> </div>
)} )}