diff --git a/web/src/components/MultiSelect.jsx b/web/src/components/MultiSelect.jsx index 1ff30a231..a04fc7778 100644 --- a/web/src/components/MultiSelect.jsx +++ b/web/src/components/MultiSelect.jsx @@ -5,6 +5,8 @@ import { ArrowDropdown } from '../icons/ArrowDropdown'; import Heading from './Heading'; import Button from './Button'; import CameraIcon from '../icons/Camera'; +import SpeakerIcon from '../icons/Speaker'; +import useSWR from 'swr'; export default function MultiSelect({ className, title, options, selection, onToggle, onShowAll, onSelectSingle }) { const popupRef = useRef(null); @@ -18,7 +20,7 @@ export default function MultiSelect({ className, title, options, selection, onTo }; const menuHeight = Math.round(window.innerHeight * 0.55); - + const { data: config } = useSWR('config'); return (
setState({ showMenu: true })}> @@ -59,7 +61,8 @@ export default function MultiSelect({ className, title, options, selection, onTo className="max-h-[35px] mx-2" onClick={() => onSelectSingle(item)} > - + { (title === "Labels" && config.audio.listen.includes(item)) ? ( ) : ( ) } +
diff --git a/web/src/icons/Audio.jsx b/web/src/icons/Audio.jsx index cec783854..4e178ccf0 100644 --- a/web/src/icons/Audio.jsx +++ b/web/src/icons/Audio.jsx @@ -1,7 +1,7 @@ import { h } from 'preact'; import { memo } from 'preact/compat'; -export function Snapshot({ className = 'h-6 w-6', stroke = 'currentColor', onClick = () => {} }) { +export function Audio({ className = 'h-6 w-6', stroke = 'currentColor', onClick = () => {} }) { return ( {}, +}) { + return ( + + + + ); +} +export default memo(Speaker);