49 lines
1 KiB
TypeScript
49 lines
1 KiB
TypeScript
import { RefObject, useRef, useState } from "react";
|
|
import { UploadButton } from "./UploadButton";
|
|
|
|
export const FileInput = () => {
|
|
const inputRef = useRef<HTMLInputElement>() as RefObject<HTMLInputElement>;
|
|
const [file, setFile] = useState<File | null>(null);
|
|
|
|
const onFileChange = async () => {
|
|
if (!inputRef?.current?.files) {
|
|
return;
|
|
}
|
|
const file = inputRef.current.files[0];
|
|
setFile(file);
|
|
};
|
|
|
|
const reset = () => {
|
|
if (!inputRef?.current) {
|
|
return;
|
|
}
|
|
inputRef.current.value = "";
|
|
setFile(null);
|
|
};
|
|
|
|
const onClick = () => {
|
|
if (!inputRef?.current) {
|
|
return;
|
|
}
|
|
inputRef.current.click();
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<input
|
|
type="file"
|
|
ref={inputRef}
|
|
accept=".torrent"
|
|
onChange={onFileChange}
|
|
className="d-none"
|
|
/>
|
|
<UploadButton
|
|
variant="secondary"
|
|
buttonText="Upload .torrent File"
|
|
onClick={onClick}
|
|
data={file}
|
|
resetData={reset}
|
|
/>
|
|
</>
|
|
);
|
|
};
|