import { useCallback, useState } from "react";
import { FileViewerModal, type ViewableFile } from "@edr/ui-common";

/**
 * Drives a single shared {@link FileViewerModal} for a page. Call `view(file)`
 * from any file row to open the document inline (pdf / image / video / office /
 * text); render `viewer` once near the page root.
 *
 *   const { view, viewer } = useFileViewer();
 *   <Button onClick={() => view({ name, url, mimeType })}>View</Button>
 *   {viewer}
 */
export function useFileViewer() {
  const [file, setFile] = useState<ViewableFile | null>(null);

  const view = useCallback((f: ViewableFile) => setFile(f), []);
  const close = useCallback(() => setFile(null), []);

  const viewer = (
    <FileViewerModal open={file !== null} file={file} onClose={close} />
  );

  return { view, close, viewer };
}