administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-14 23:25:25 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

clean up

Browse Source
This commit is contained in:
Josh Hawkins 2024-09-17 15:40:35 -05:00
parent 811d434b00
commit 59a2f2d696
1 changed files with 32 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
web/src/components/input/InputWithTags.tsx
View File

@ -1,10 +1,4 @@
import React, {
useState,
useRef,
useEffect,
useMemo,
useCallback,
} from "react";
import { useState, useRef, useEffect, useMemo, useCallback } from "react";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { LuX, LuFilter, LuImage } from "react-icons/lu";
@ -108,11 +102,15 @@ export default function InputWithTags({
const suggestionRef = useRef<HTMLDivElement>(null);
const filterRef = useRef<HTMLDivElement>(null);
// TODO: search history from browser storage
const searchHistory = useMemo(
() => ["previous search 1", "previous search 2"],
[],
);
// suggestions
const {
suggestions,
selectedSuggestionIndex,
@ -150,29 +148,6 @@ export default function InputWithTags({
[filters, setFilters],
);
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (
suggestionRef.current &&
!suggestionRef.current.contains(event.target as Node) &&
containerRef.current &&
!containerRef.current.contains(event.target as Node)
) {
setShowSuggestions(false);
setShowFilters(false);
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, []);
useEffect(() => {
updateSuggestions(inputValue, currentFilterType);
}, [currentFilterType, inputValue, updateSuggestions]);
const createFilter = useCallback(
(type: FilterType, value: string) => {
if (
@ -226,6 +201,8 @@ export default function InputWithTags({
[filters, setFilters, allSuggestions],
);
// handlers
const handleFilterCreation = useCallback(
(filterType: FilterType, filterValue: string) => {
const trimmedValue = filterValue.trim();
@ -410,6 +387,31 @@ export default function InputWithTags({
],
);
// effects
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (
suggestionRef.current &&
!suggestionRef.current.contains(event.target as Node) &&
containerRef.current &&
!containerRef.current.contains(event.target as Node)
) {
setShowSuggestions(false);
setShowFilters(false);
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, []);
useEffect(() => {
updateSuggestions(inputValue, currentFilterType);
}, [currentFilterType, inputValue, updateSuggestions]);
useEffect(() => {
setInputValue(search || "");
}, [search]);