import Link from "next/link";
import { AllegatoIframe } from "~/components/allegato-iframe";
import { LoadingPage } from "~/components/loading";
import { useTranslation } from "~/providers/I18nProvider";
import { api } from "~/utils/api";

export const FileSection = ({ storageId }: { storageId: string }) => {
	const { data: fileInfos, isLoading } = api.storage.getFileInfos.useQuery({
		storageId,
	});
	const { t } = useTranslation();
	if (isLoading) return <LoadingPage />;
	if (!fileInfos) return <p>{t.file_section.error}</p>;
	return (
		<>
			<AllegatoIframe
				allegato={fileInfos}
				className="h-full max-h-[70vh] min-h-[60vh]"
			/>

			<Link
				className="underline underline-offset-1 after:content-['_↗']"
				href={`/storage-api/get/${fileInfos.id}?mode=download`}
			>
				{t.file_section.download}
			</Link>
		</>
	);
};
