mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-02-03 17:55:21 +03:00
fix key prop for lint
* Change MultiSelect onSolo to onSelectSingle
This commit is contained in:
parent
0f7a78876b
commit
0356e33fe0
@ -5,14 +5,13 @@ import { ArrowDropdown } from '../icons/ArrowDropdown';
|
|||||||
import Heading from './Heading';
|
import Heading from './Heading';
|
||||||
import Button from './Button';
|
import Button from './Button';
|
||||||
|
|
||||||
export default function MultiSelect({ className, title, options, selection, onToggle, onShowAll, onSolo }) {
|
export default function MultiSelect({ className, title, options, selection, onToggle, onShowAll, onSelectSingle }) {
|
||||||
|
|
||||||
const popupRef = useRef(null);
|
const popupRef = useRef(null);
|
||||||
|
|
||||||
const [state, setState] = useState({
|
const [state, setState] = useState({
|
||||||
showMenu: false,
|
showMenu: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`${className} p-2`} ref={popupRef}>
|
<div className={`${className} p-2`} ref={popupRef}>
|
||||||
<div
|
<div
|
||||||
@ -31,10 +30,9 @@ export default function MultiSelect({ className, title, options, selection, onTo
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
{options.map((item) => (
|
{options.map((item) => (
|
||||||
<div className='flex grow'>
|
<div className="flex grow" key={item}>
|
||||||
<label
|
<label
|
||||||
className={`flex flex-shrink space-x-2 p-1 my-1 min-w-[176px] hover:bg-gray-200 dark:hover:bg-gray-800 dark:hover:text-white cursor-pointer capitalize text-sm`}
|
className={`flex flex-shrink space-x-2 p-1 my-1 min-w-[176px] hover:bg-gray-200 dark:hover:bg-gray-800 dark:hover:text-white cursor-pointer capitalize text-sm`}>
|
||||||
key={item}>
|
|
||||||
<input
|
<input
|
||||||
className="mx-4 m-0 align-middle"
|
className="mx-4 m-0 align-middle"
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
@ -43,7 +41,7 @@ export default function MultiSelect({ className, title, options, selection, onTo
|
|||||||
{item.replaceAll("_", " ")}
|
{item.replaceAll("_", " ")}
|
||||||
</label>
|
</label>
|
||||||
<div className=' justify-right'>
|
<div className=' justify-right'>
|
||||||
<Button className="mx-2" onClick={() => onSolo(item)}>
|
<Button className="mx-2" onClick={() => onSelectSingle(item)}>
|
||||||
👀
|
👀
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -302,7 +302,7 @@ export default function Events({ path, ...props }) {
|
|||||||
selection={searchParams.cameras}
|
selection={searchParams.cameras}
|
||||||
onToggle={(item) => onToggleNamedFilter("cameras", item)}
|
onToggle={(item) => onToggleNamedFilter("cameras", item)}
|
||||||
onShowAll={() => onFilter("cameras", ["all"])}
|
onShowAll={() => onFilter("cameras", ["all"])}
|
||||||
onSolo={(item) => onFilter("cameras", item)}
|
onSelectSingle={(item) => onFilter("cameras", item)}
|
||||||
/>
|
/>
|
||||||
<MultiSelect
|
<MultiSelect
|
||||||
className="basis-1/5 cursor-pointer rounded dark:bg-slate-800"
|
className="basis-1/5 cursor-pointer rounded dark:bg-slate-800"
|
||||||
@ -311,7 +311,7 @@ export default function Events({ path, ...props }) {
|
|||||||
selection={searchParams.labels}
|
selection={searchParams.labels}
|
||||||
onToggle={(item) => onToggleNamedFilter("labels", item) }
|
onToggle={(item) => onToggleNamedFilter("labels", item) }
|
||||||
onShowAll={() => onFilter("labels", ["all"])}
|
onShowAll={() => onFilter("labels", ["all"])}
|
||||||
onSolo={(item) => onFilter("labels", item)}
|
onSelectSingle={(item) => onFilter("labels", item)}
|
||||||
/>
|
/>
|
||||||
<MultiSelect
|
<MultiSelect
|
||||||
className="basis-1/5 cursor-pointer rounded dark:bg-slate-800"
|
className="basis-1/5 cursor-pointer rounded dark:bg-slate-800"
|
||||||
@ -320,7 +320,7 @@ export default function Events({ path, ...props }) {
|
|||||||
selection={searchParams.zones}
|
selection={searchParams.zones}
|
||||||
onToggle={(item) => onToggleNamedFilter("zones", item) }
|
onToggle={(item) => onToggleNamedFilter("zones", item) }
|
||||||
onShowAll={() => onFilter("zones", ["all"])}
|
onShowAll={() => onFilter("zones", ["all"])}
|
||||||
onSolo={(item) => onFilter("zones", item)}
|
onSelectSingle={(item) => onFilter("zones", item)}
|
||||||
/>
|
/>
|
||||||
{
|
{
|
||||||
filterValues.sub_labels.length > 0 && (
|
filterValues.sub_labels.length > 0 && (
|
||||||
@ -331,7 +331,7 @@ export default function Events({ path, ...props }) {
|
|||||||
selection={searchParams.sub_labels}
|
selection={searchParams.sub_labels}
|
||||||
onToggle={(item) => onToggleNamedFilter("sub_labels", item) }
|
onToggle={(item) => onToggleNamedFilter("sub_labels", item) }
|
||||||
onShowAll={() => onFilter("sub_labels", ["all"])}
|
onShowAll={() => onFilter("sub_labels", ["all"])}
|
||||||
onSolo={(item) => onFilter("sub_labels", item)}
|
onSelectSingle={(item) => onFilter("sub_labels", item)}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<div ref={datePicker} className="ml-auto">
|
<div ref={datePicker} className="ml-auto">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user