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

Portal tooltips

Browse Source
This commit is contained in:
Josh Hawkins 2024-09-25 20:10:42 -05:00
parent a6ccb37683
commit a07fcffe7f
2 changed files with 24 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
web/src/components/card/SearchThumbnail.tsx
View File

@ -15,6 +15,7 @@ import { capitalizeFirstLetter } from "@/utils/stringUtil";
import { SearchResult } from "@/types/search"; import { SearchResult } from "@/types/search";
import useContextMenu from "@/hooks/use-contextmenu"; import useContextMenu from "@/hooks/use-contextmenu";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { TooltipPortal } from "@radix-ui/react-tooltip";
type SearchThumbnailProps = { type SearchThumbnailProps = {
searchResult: SearchResult; searchResult: SearchResult;
@ -95,16 +96,18 @@ export default function SearchThumbnail({
</div> </div>
</TooltipTrigger> </TooltipTrigger>
</div> </div>
<TooltipContent className="capitalize"> <TooltipPortal>
{[...new Set([searchResult.label])] <TooltipContent className="capitalize">
.filter( {[...new Set([searchResult.label])]
(item) => item !== undefined && !item.includes("-verified"), .filter(
) (item) => item !== undefined && !item.includes("-verified"),
.map((text) => capitalizeFirstLetter(text)) )
.sort() .map((text) => capitalizeFirstLetter(text))
.join(", ") .sort()
.replaceAll("-verified", "")} .join(", ")
</TooltipContent> .replaceAll("-verified", "")}
</TooltipContent>
</TooltipPortal>
</Tooltip> </Tooltip>
</div> </div>
<div className="rounded-t-l pointer-events-none absolute inset-x-0 top-0 z-10 h-[30%] w-full bg-gradient-to-b from-black/60 to-transparent"></div> <div className="rounded-t-l pointer-events-none absolute inset-x-0 top-0 z-10 h-[30%] w-full bg-gradient-to-b from-black/60 to-transparent"></div>

19
web/src/views/search/SearchView.tsx
View File

@ -31,6 +31,7 @@ import InputWithTags from "@/components/input/InputWithTags";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { isEqual } from "lodash"; import { isEqual } from "lodash";
import { formatDateToLocaleString } from "@/utils/dateUtil"; import { formatDateToLocaleString } from "@/utils/dateUtil";
import { TooltipPortal } from "@radix-ui/react-tooltip";
type SearchViewProps = { type SearchViewProps = {
search: string; search: string;
@ -401,14 +402,16 @@ export default function SearchView({
% %
</Chip> </Chip>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipPortal>
Matched {value.search_source} at{" "} <TooltipContent>
{zScoreToConfidence( Matched {value.search_source} at{" "}
value.search_distance, {zScoreToConfidence(
value.search_source, value.search_distance,
)} value.search_source,
% )}
</TooltipContent> %
</TooltipContent>
</TooltipPortal>
</Tooltip> </Tooltip>
</div> </div>
)} )}