diff --git a/src/components/modals/DeviceModal.tsx b/src/components/modals/DeviceModal.tsx index f038b31..07e4729 100644 --- a/src/components/modals/DeviceModal.tsx +++ b/src/components/modals/DeviceModal.tsx @@ -75,6 +75,7 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) { const [selectedDevice, setSelectedDevice] = useState(null); const [showConfirm, setShowConfirm] = useState(false); const [showSkeleton, setShowSkeleton] = useState(false); + const [showSystemDevices, setShowSystemDevices] = useState(false); // Track previous devices for change detection const prevDevicesRef = useRef(null); @@ -92,6 +93,14 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) { return devices && devices.length > 0; }, [devices]); + // Filter devices based on showSystemDevices toggle + const filteredDevices = useMemo(() => { + if (showSystemDevices) { + return devices; + } + return devices.filter(d => !d.is_system); + }, [devices, showSystemDevices]); + // Show skeleton with minimum delay useEffect(() => { let skeletonTimeout: NodeJS.Timeout; @@ -158,10 +167,28 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) { return ( <> - -
- - {t('flash.dataWarning')} + +
+
+
+ +
+
+ {t('flash.dataWarning')} +
+
+ +
{error ? ( @@ -169,7 +196,7 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) { ) : ( <> {showSkeleton && } - {devices.length === 0 && !showSkeleton && ( + {filteredDevices.length === 0 && !showSkeleton && (

{t('modal.noDevices')}

@@ -183,7 +210,7 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) {
)}
- {!showSkeleton && devices.map((device) => { + {!showSkeleton && filteredDevices.map((device) => { const deviceType = getDeviceType(device); const badge = getDeviceBadge(deviceType, t); return ( @@ -217,7 +244,7 @@ export function DeviceModal({ isOpen, onClose, onSelect }: DeviceModalProps) { ); })}
- {!showSkeleton && devices.length > 0 && ( + {!showSkeleton && filteredDevices.length > 0 && (