1
0
mirror of https://github.com/spacebarchat/client.git synced 2024-11-25 03:32:54 +01:00

attachment upload button

This commit is contained in:
Puyodead1 2023-09-10 22:20:15 -04:00
parent 126c9e21e7
commit a0ee02d0ec
No known key found for this signature in database
GPG Key ID: A4FA4FEC0DD353FC

View File

@ -24,6 +24,37 @@ const HoverIcon = styled(Icon)`
}
`;
// https://github.com/revoltchat/revite/blob/master/src/controllers/client/jsx/legacy/FileUploads.tsx#L81
let input: HTMLInputElement;
export function fileUpload(cb: (files: File[]) => void, onFileTooLarge: () => void) {
if (input) input.remove();
input = document.createElement("input");
input.accept = "*";
input.type = "file";
input.multiple = true;
input.style.display = "none";
input.addEventListener("change", async (e) => {
const files = (e.currentTarget as HTMLInputElement)?.files;
if (!files) return;
for (const file of files) {
if (file.size > MAX_UPLOAD_SIZE) {
return onFileTooLarge();
}
}
cb(Array.from(files));
});
// iOS requires us to append the file input
// to DOM to allow us to add any images
document.body.appendChild(input);
input.click();
}
interface Props {
append: (files: File[]) => void;
}
@ -31,8 +62,13 @@ interface Props {
function FileUpload({ append }: Props) {
const logger = useLogger("FileUpload");
const fileTooLarge = () => {
// TODO: show error modal
logger.error("File too large");
};
const onClick = () => {
// TODO:
fileUpload(append, fileTooLarge);
};
React.useEffect(() => {
@ -46,8 +82,7 @@ function FileUpload({ append }: Props) {
const blob = item.getAsFile();
if (blob) {
if (blob.size > MAX_UPLOAD_SIZE) {
// TODO: show error modal
logger.error("File too large");
fileTooLarge();
continue;
}
@ -73,8 +108,7 @@ function FileUpload({ append }: Props) {
const files = [];
for (const item of dropped) {
if (item.size > MAX_UPLOAD_SIZE) {
// TODO: show error modal
logger.error("File too large");
fileTooLarge();
continue;
}