56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
// * Packages
|
|
import { FileDownIcon } from "lucide-react";
|
|
// * Other
|
|
import BtnOptionnalLinkWithTooltip from "@/back/Components/BtnOptionnalLinkWithTooltip";
|
|
|
|
type ExportConfigJsonProps<T> = {
|
|
// The data in string.
|
|
data: T;
|
|
// Name of the downloaded file.
|
|
filename?: string;
|
|
// String present in the tooltip.
|
|
tooltipContent: string;
|
|
// Disable the button or not.
|
|
disabled?: boolean;
|
|
};
|
|
|
|
export default function ExportConfigJson<T>({
|
|
data,
|
|
filename = "config.json",
|
|
tooltipContent,
|
|
disabled = false,
|
|
}: ExportConfigJsonProps<T>) {
|
|
const handleExport = () => {
|
|
try {
|
|
// Transform data into json structure.
|
|
const json = JSON.stringify(data, null);
|
|
|
|
// Create blob from the json.
|
|
const blob = new Blob([json], {
|
|
type: "application/json;charset=utf-8",
|
|
});
|
|
|
|
// Creates a link on the fly and opens it.
|
|
const url = URL.createObjectURL(blob);
|
|
const link = document.createElement("a");
|
|
link.href = url;
|
|
link.download = filename;
|
|
link.click();
|
|
URL.revokeObjectURL(url);
|
|
} catch (error) {
|
|
console.error("Error during JSON export:", error);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<BtnOptionnalLinkWithTooltip
|
|
content={<FileDownIcon className="w-4 h-4 m-auto" />}
|
|
tooltipContent={tooltipContent}
|
|
type="button"
|
|
variant="outline"
|
|
size="icon"
|
|
disabled={disabled}
|
|
onClick={handleExport}
|
|
/>
|
|
);
|
|
}
|