50 lines · 1.4 KB · TypeScript
RawDownload
import { requireNativeModule } from "expo";import { useEffect, useEffectEvent, useId } from "react";import { Alert } from "react-native"; import type { ResolvedFilePreviewSource } from "./FilePreviewModal"; const NativeControls = requireNativeModule<{  presentFile(    uri: string,    name: string,    sourceIdentifier: string,    identifier: string,  ): Promise<void>;  dismissFile(identifier: string): Promise<void>;}>("T3NativeControls"); function NativeFilePreview(props: {  readonly source: ResolvedFilePreviewSource;  readonly onRequestClose: () => void;}) {  const { uri, name, sourceIdentifier } = props.source;  const identifier = useId();  const onRequestClose = useEffectEvent(props.onRequestClose);   useEffect(() => {    let canceled = false;    void NativeControls.presentFile(uri, name ?? "Preview", sourceIdentifier ?? "", identifier)      .catch(() => {        if (!canceled) {          Alert.alert("Could not open preview", "The file could not be loaded. Please try again.");        }      })      .finally(() => {        if (!canceled) onRequestClose();      });    return () => {      canceled = true;      void NativeControls.dismissFile(identifier).catch(() => undefined);    };  }, [uri, name, sourceIdentifier, identifier]);   return null;} export function FilePreview(props: {  readonly source: ResolvedFilePreviewSource;  readonly onRequestClose: () => void;}) {  return <NativeFilePreview {...props} />;}