56 lines
1.1 KiB
JavaScript
56 lines
1.1 KiB
JavaScript
import { useRef } from "react";
|
|
import FileUploadIcon from "@mui/icons-material/FileUpload";
|
|
import { useI18n } from "../../hooks/I18n";
|
|
import Button from "@mui/material/Button";
|
|
|
|
export default function UploadButton({
|
|
handleImport,
|
|
text,
|
|
fileType = "json",
|
|
fileExts = [".json"],
|
|
}) {
|
|
const i18n = useI18n();
|
|
const inputRef = useRef(null);
|
|
const handleClick = () => {
|
|
if (inputRef.current) {
|
|
inputRef.current.click();
|
|
inputRef.current.value = null;
|
|
}
|
|
};
|
|
const onChange = (e) => {
|
|
const file = e.target.files[0];
|
|
if (!file) {
|
|
return;
|
|
}
|
|
|
|
if (!file.type.includes(fileType)) {
|
|
alert(i18n("error_wrong_file_type"));
|
|
return;
|
|
}
|
|
|
|
const reader = new FileReader();
|
|
reader.onload = async (e) => {
|
|
handleImport(e.target.result);
|
|
};
|
|
reader.readAsText(file);
|
|
};
|
|
|
|
return (
|
|
<Button
|
|
size="small"
|
|
variant="outlined"
|
|
onClick={handleClick}
|
|
startIcon={<FileUploadIcon />}
|
|
>
|
|
{text}
|
|
<input
|
|
type="file"
|
|
accept={fileExts.join(", ")}
|
|
ref={inputRef}
|
|
onChange={onChange}
|
|
hidden
|
|
/>
|
|
</Button>
|
|
);
|
|
}
|