import { Item, ItemType } from "@/features/drivers/types";
import { FilePreview, FilePreviewType } from "../FilesPreview";
import { useTranslation } from "react-i18next";
import { useMemo } from "react";
import { itemToPreviewFile } from "@/features/explorer/utils/utils";
import { useDownloadItem } from "@/features/items/hooks/useDownloadItem";
import { ItemInfo } from "@/features/items/components/ItemInfo";
import { Button, useModal } from "@gouvfr-lasuite/cunningham-react";
import { ItemShareModal } from "@/features/explorer/components/modals/share/ItemShareModal";

type CustomFilesPreviewProps = {
  currentItem?: Item;
  items: Item[];
  setPreviewItem?: (item?: Item) => void;
};

export const CustomFilesPreview = ({
  currentItem,
  items,
  setPreviewItem,
}: CustomFilesPreviewProps) => {
  const { t } = useTranslation();

  const { handleDownloadItem } = useDownloadItem();

  const files = useMemo(() => {
    return items
      .filter((item) => item.type === ItemType.FILE)
      .map(itemToPreviewFile);
  }, [items]);

  const handleClosePreview = () => {
    setPreviewItem?.(undefined);
  };

  const handleChangePreviewItem = (file?: FilePreviewType) => {
    const item = items.find((item) => file?.id === item.id);
    setPreviewItem?.(item);
  };

  return (
    <FilePreview
      isOpen={!!currentItem}
      onClose={handleClosePreview}
      title={t("file_preview.title")}
      files={files}
      onChangeFile={handleChangePreviewItem}
      handleDownloadFile={() => handleDownloadItem(currentItem)}
      openedFileId={currentItem?.id}
      headerRightContent={
        <CustomFilesPreviewRightHeader currentItem={currentItem} />
      }
      sidebarContent={currentItem && <ItemInfo item={currentItem} />}
    />
  );
};

type CustomFilesPreviewRightHeaderProps = {
  currentItem?: Item;
};

const CustomFilesPreviewRightHeader = ({
  currentItem,
}: CustomFilesPreviewRightHeaderProps) => {
  const { t } = useTranslation();
  const shareModal = useModal();

  if (!currentItem) {
    return null;
  }

  return (
    <>
      <div className="custom-files-preview-right-header">
        <Button variant="tertiary" onClick={shareModal.open}>
          {t("explorer.rightPanel.share")}
        </Button>
      </div>

      {shareModal.isOpen && (
        <ItemShareModal {...shareModal} item={currentItem} />
      )}
    </>
  );
};
