import type React from "react"; import { useAppStore } from "@app/core/stores/appStore.js"; import { useDeviceStore } from "@app/core/stores/deviceStore.js"; import { Hashicon } from "@emeraldpay/hashicon-react"; import { PlusIcon } from "@heroicons/react/24/outline"; export const DeviceSelector = (): JSX.Element => { const { getDevices } = useDeviceStore(); const { selectedDevice, setSelectedDevice } = useAppStore(); return (
Connected Devices {getDevices().map((device) => (
{ setSelectedDevice(device.id); }} className="group flex w-8 h-8 p-0.5 cursor-pointer drop-shadow-md" >
))}
{ setSelectedDevice(0); }} className={`w-8 h-8 p-2 border-dashed border-2 rounded-md hover:border-orange-300 cursor-pointer ${ selectedDevice === 0 ? "border-orange-400" : "border-slate-200" }`} >
); };