mirror of
https://github.com/blakeblackshear/frigate.git
synced 2025-02-05 00:15:51 +01:00
Don't prevent default when tracked object details description input is focused (#16064)
This commit is contained in:
parent
83ac42cbdc
commit
aedfaa3641
@ -85,6 +85,7 @@ type SearchDetailDialogProps = {
|
|||||||
setSearch: (search: SearchResult | undefined) => void;
|
setSearch: (search: SearchResult | undefined) => void;
|
||||||
setSearchPage: (page: SearchTab) => void;
|
setSearchPage: (page: SearchTab) => void;
|
||||||
setSimilarity?: () => void;
|
setSimilarity?: () => void;
|
||||||
|
setInputFocused: React.Dispatch<React.SetStateAction<boolean>>;
|
||||||
};
|
};
|
||||||
export default function SearchDetailDialog({
|
export default function SearchDetailDialog({
|
||||||
search,
|
search,
|
||||||
@ -92,6 +93,7 @@ export default function SearchDetailDialog({
|
|||||||
setSearch,
|
setSearch,
|
||||||
setSearchPage,
|
setSearchPage,
|
||||||
setSimilarity,
|
setSimilarity,
|
||||||
|
setInputFocused,
|
||||||
}: SearchDetailDialogProps) {
|
}: SearchDetailDialogProps) {
|
||||||
const { data: config } = useSWR<FrigateConfig>("config", {
|
const { data: config } = useSWR<FrigateConfig>("config", {
|
||||||
revalidateOnFocus: false,
|
revalidateOnFocus: false,
|
||||||
@ -232,6 +234,7 @@ export default function SearchDetailDialog({
|
|||||||
config={config}
|
config={config}
|
||||||
setSearch={setSearch}
|
setSearch={setSearch}
|
||||||
setSimilarity={setSimilarity}
|
setSimilarity={setSimilarity}
|
||||||
|
setInputFocused={setInputFocused}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{page == "snapshot" && (
|
{page == "snapshot" && (
|
||||||
@ -266,12 +269,14 @@ type ObjectDetailsTabProps = {
|
|||||||
config?: FrigateConfig;
|
config?: FrigateConfig;
|
||||||
setSearch: (search: SearchResult | undefined) => void;
|
setSearch: (search: SearchResult | undefined) => void;
|
||||||
setSimilarity?: () => void;
|
setSimilarity?: () => void;
|
||||||
|
setInputFocused: React.Dispatch<React.SetStateAction<boolean>>;
|
||||||
};
|
};
|
||||||
function ObjectDetailsTab({
|
function ObjectDetailsTab({
|
||||||
search,
|
search,
|
||||||
config,
|
config,
|
||||||
setSearch,
|
setSearch,
|
||||||
setSimilarity,
|
setSimilarity,
|
||||||
|
setInputFocused,
|
||||||
}: ObjectDetailsTabProps) {
|
}: ObjectDetailsTabProps) {
|
||||||
const apiHost = useApiHost();
|
const apiHost = useApiHost();
|
||||||
|
|
||||||
@ -283,6 +288,14 @@ function ObjectDetailsTab({
|
|||||||
|
|
||||||
const [desc, setDesc] = useState(search?.data.description);
|
const [desc, setDesc] = useState(search?.data.description);
|
||||||
|
|
||||||
|
const handleDescriptionFocus = useCallback(() => {
|
||||||
|
setInputFocused(true);
|
||||||
|
}, [setInputFocused]);
|
||||||
|
|
||||||
|
const handleDescriptionBlur = useCallback(() => {
|
||||||
|
setInputFocused(false);
|
||||||
|
}, [setInputFocused]);
|
||||||
|
|
||||||
// we have to make sure the current selected search item stays in sync
|
// we have to make sure the current selected search item stays in sync
|
||||||
useEffect(() => setDesc(search?.data.description ?? ""), [search]);
|
useEffect(() => setDesc(search?.data.description ?? ""), [search]);
|
||||||
|
|
||||||
@ -499,6 +512,8 @@ function ObjectDetailsTab({
|
|||||||
placeholder="Description of the tracked object"
|
placeholder="Description of the tracked object"
|
||||||
value={desc}
|
value={desc}
|
||||||
onChange={(e) => setDesc(e.target.value)}
|
onChange={(e) => setDesc(e.target.value)}
|
||||||
|
onFocus={handleDescriptionFocus}
|
||||||
|
onBlur={handleDescriptionBlur}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -444,6 +444,7 @@ export default function SearchView({
|
|||||||
setSimilarity={
|
setSimilarity={
|
||||||
searchDetail && (() => setSimilaritySearch(searchDetail))
|
searchDetail && (() => setSimilaritySearch(searchDetail))
|
||||||
}
|
}
|
||||||
|
setInputFocused={setInputFocused}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
|
Loading…
Reference in New Issue
Block a user