Live video on the AT Protocol
1import { useCallback } from "react";
2import { isWeb } from "tamagui";
3import { useVideoElement } from "contexts/VideoElementContext";
4import { captureVideoFrame } from "utils/videoCapture";
5
6/**
7 * Hook to capture a frame from the video element
8 *
9 * This hook provides a function to capture a frame from the video element
10 * that was stored in the VideoElementContext.
11 *
12 * @returns A function that captures a frame from the video element
13 */
14export function useCaptureVideoFrame() {
15 const videoElement = useVideoElement();
16
17 const captureFrame = useCallback(
18 async (maxWidth = 1280, quality = 0.85): Promise<Blob | null> => {
19 if (!isWeb || !videoElement) {
20 console.warn("Video element not available or not on web platform");
21 return null;
22 }
23
24 try {
25 return await captureVideoFrame(videoElement, maxWidth, quality);
26 } catch (error) {
27 console.error("Error capturing frame:", error);
28 return null;
29 }
30 },
31 [videoElement],
32 );
33
34 return captureFrame;
35}