47 lines · 1.7 KB · TypeScript
RawDownload
import { useState } from "react";import { View } from "react-native"; import { EmptyState } from "../../components/EmptyState";import { MediaVideoPlayer } from "../../components/MediaVideoPlayer";import { VideoPreviewModal, type VideoPreviewSource } from "../../components/VideoPreviewModal";import type { MediaVideoPreviewSource } from "../../lib/videoPreviewSource"; /** Uses the signed progressive URL directly; choosing a file never preloads its video bytes as text. */export function WorkspaceFileVideoPreview(props: {  readonly name: string;  readonly thumbnailKey: string;  readonly uri: string | null;  readonly source: MediaVideoPreviewSource | null;  readonly resolvePlaybackUri: () => Promise<string | null>;  readonly unavailable: boolean;}) {  const [preview, setPreview] = useState<VideoPreviewSource | null>(null);  const uri = props.uri;   if (props.unavailable) {    return (      <View className="flex-1 items-center justify-center bg-sheet px-6">        <EmptyState          title="Video unavailable"          detail="This file may be missing, unsupported, or unavailable on this environment."        />      </View>    );  }   return (    <View className="flex-1 items-center justify-center bg-sheet p-4">      <MediaVideoPlayer        uri={uri}        resolvePlaybackUri={props.resolvePlaybackUri}        name={props.name}        thumbnailKey={props.thumbnailKey}        actionsSource={props.source?.actionsSource}        onExpand={          uri === null || props.source === null ? undefined : () => setPreview(props.source)        }      />      <VideoPreviewModal source={preview} onRequestClose={() => setPreview(null)} />    </View>  );}