revert long press code

This commit is contained in:
Josh Hawkins 2024-12-02 11:19:36 -06:00
parent cd82e220b1
commit 4a3a213b57
2 changed files with 5 additions and 20 deletions

View File

@ -1,4 +1,4 @@
import { useMemo, useRef } from "react"; import { useMemo } from "react";
import { useApiHost } from "@/api"; import { useApiHost } from "@/api";
import { getIconForLabel } from "@/utils/iconUtil"; import { getIconForLabel } from "@/utils/iconUtil";
import useSWR from "swr"; import useSWR from "swr";
@ -12,7 +12,6 @@ import { capitalizeFirstLetter } from "@/utils/stringUtil";
import { SearchResult } from "@/types/search"; import { SearchResult } from "@/types/search";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { TooltipPortal } from "@radix-ui/react-tooltip"; import { TooltipPortal } from "@radix-ui/react-tooltip";
import usePress from "@/hooks/use-press";
import useContextMenu from "@/hooks/use-contextmenu"; import useContextMenu from "@/hooks/use-contextmenu";
type SearchThumbnailProps = { type SearchThumbnailProps = {
@ -27,19 +26,13 @@ export default function SearchThumbnail({
const apiHost = useApiHost(); const apiHost = useApiHost();
const { data: config } = useSWR<FrigateConfig>("config"); const { data: config } = useSWR<FrigateConfig>("config");
const [imgRef, imgLoaded, onImgLoad] = useImageLoaded(); const [imgRef, imgLoaded, onImgLoad] = useImageLoaded();
const containerRef = useRef<HTMLDivElement | null>(null);
// interactions // interactions
useContextMenu(containerRef, () => { useContextMenu(imgRef, () => {
onClick(searchResult, true, false); onClick(searchResult, true, false);
}); });
const bindClickAndLongPress = usePress({
onLongPress: () => onClick(searchResult, true, false),
onPress: () => onClick(searchResult, false, true),
})();
const objectLabel = useMemo(() => { const objectLabel = useMemo(() => {
if ( if (
!config || !config ||
@ -54,9 +47,8 @@ export default function SearchThumbnail({
return ( return (
<div <div
ref={containerRef}
className="relative size-full cursor-pointer" className="relative size-full cursor-pointer"
{...bindClickAndLongPress} onClick={() => onClick(searchResult, false, true)}
> >
<ImageLoadingIndicator <ImageLoadingIndicator
className="absolute inset-0" className="absolute inset-0"

View File

@ -21,8 +21,6 @@ import { cn } from "@/lib/utils";
import { InProgressPreview, VideoPreview } from "../preview/ScrubbablePreview"; import { InProgressPreview, VideoPreview } from "../preview/ScrubbablePreview";
import { Preview } from "@/types/preview"; import { Preview } from "@/types/preview";
import { baseUrl } from "@/api/baseUrl"; import { baseUrl } from "@/api/baseUrl";
import usePress from "@/hooks/use-press";
import { LongPressReactEvents } from "use-long-press";
type PreviewPlayerProps = { type PreviewPlayerProps = {
review: ReviewSegment; review: ReviewSegment;
@ -51,7 +49,7 @@ export default function PreviewThumbnailPlayer({
const [ignoreClick, setIgnoreClick] = useState(false); const [ignoreClick, setIgnoreClick] = useState(false);
const handleOnClick = useCallback( const handleOnClick = useCallback(
(e: LongPressReactEvents<Element>) => { (e: React.MouseEvent<HTMLDivElement>) => {
if (!ignoreClick) { if (!ignoreClick) {
onClick(review, e.metaKey, false); onClick(review, e.metaKey, false);
} }
@ -79,11 +77,6 @@ export default function PreviewThumbnailPlayer({
onClick(review, true, false); onClick(review, true, false);
}); });
const bindClickAndLongPress = usePress({
onLongPress: () => onClick(review, true, false),
onPress: (e) => handleOnClick(e),
})();
// playback // playback
const relevantPreview = useMemo(() => { const relevantPreview = useMemo(() => {
@ -183,7 +176,7 @@ export default function PreviewThumbnailPlayer({
className="relative size-full cursor-pointer" className="relative size-full cursor-pointer"
onMouseOver={isMobile ? undefined : () => setIsHovered(true)} onMouseOver={isMobile ? undefined : () => setIsHovered(true)}
onMouseLeave={isMobile ? undefined : () => setIsHovered(false)} onMouseLeave={isMobile ? undefined : () => setIsHovered(false)}
{...bindClickAndLongPress} onClick={handleOnClick}
onAuxClick={(e) => { onAuxClick={(e) => {
if (e.button === 1) { if (e.button === 1) {
window.open(`${baseUrl}review?id=${review.id}`, "_blank")?.focus(); window.open(`${baseUrl}review?id=${review.id}`, "_blank")?.focus();