diff --git a/web/src/components/card/ExportCard.tsx b/web/src/components/card/ExportCard.tsx index b73f4ac36..3fb95f31e 100644 --- a/web/src/components/card/ExportCard.tsx +++ b/web/src/components/card/ExportCard.tsx @@ -177,7 +177,7 @@ export default function ExportCard({ {exportedRecording.thumb_path.length > 0 ? ( setLoading(false)} /> ) : ( diff --git a/web/src/components/player/VideoControls.tsx b/web/src/components/player/VideoControls.tsx index f700747e5..35b9522f4 100644 --- a/web/src/components/player/VideoControls.tsx +++ b/web/src/components/player/VideoControls.tsx @@ -1,4 +1,4 @@ -import { useCallback, useMemo, useState } from "react"; +import { useCallback, useMemo, useRef, useState } from "react"; import { isMobileOnly, isSafari } from "react-device-detect"; import { LuPause, LuPlay } from "react-icons/lu"; import { @@ -90,6 +90,12 @@ export default function VideoControls({ onUploadFrame, setFullscreen, }: VideoControlsProps) { + // layout + + const containerRef = useRef(null); + + // controls + const onReplay = useCallback( (e: React.MouseEvent) => { e.stopPropagation(); @@ -183,6 +189,7 @@ export default function VideoControls({ MIN_ITEMS_WRAP && "min-w-[75%] flex-wrap", )} + ref={containerRef} > {video && features.volume && (
@@ -230,7 +237,9 @@ export default function VideoControls({ }} > {`${playbackRate}x`} - + onSetPlaybackRate(parseFloat(rate))} > diff --git a/web/src/components/ui/dropdown-menu.tsx b/web/src/components/ui/dropdown-menu.tsx index 769ff7aa7..5d89b180e 100644 --- a/web/src/components/ui/dropdown-menu.tsx +++ b/web/src/components/ui/dropdown-menu.tsx @@ -56,9 +56,11 @@ DropdownMenuSubContent.displayName = const DropdownMenuContent = React.forwardRef< React.ElementRef, - React.ComponentPropsWithoutRef ->(({ className, sideOffset = 4, ...props }, ref) => ( - + React.ComponentPropsWithoutRef & { + portalProps?: DropdownMenuPrimitive.DropdownMenuPortalProps; + } +>(({ className, portalProps, sideOffset = 4, ...props }, ref) => ( +