fix file selector

This commit is contained in:
grimhilt 2023-07-31 01:38:01 +02:00
parent 35de39fef8
commit 9d17398953
3 changed files with 24 additions and 18 deletions

View File

@ -78,8 +78,8 @@ const HeaderSearch = () => {
{items} {items}
</Group> </Group>
<SwitchToggle /> <SwitchToggle />
<Tooltip label={'Connect'} withArrow color={color}> <Tooltip label={'Connect'} withArrow>
<ActionIcon variant="light" size="lg" onClick={logout} color={color}> <ActionIcon variant="light" size="lg" onClick={logout}>
<IconUserOff size="1.2rem" stroke={1.5} /> <IconUserOff size="1.2rem" stroke={1.5} />
</ActionIcon> </ActionIcon>
</Tooltip> </Tooltip>

View File

@ -29,7 +29,7 @@ const ModalAddFile = ({ opened, handler, addFiles }) => {
API.upload(formData) API.upload(formData)
.then((res) => { .then((res) => {
if (res.status === 200) { if (res.status === 200) {
validate(files); validate(res.data);
} }
}) })
.catch((err) => { .catch((err) => {

View File

@ -10,29 +10,35 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
const [files, setFiles] = useState([]); const [files, setFiles] = useState([]);
const [showAdd, setShowAdd] = useState(false); const [showAdd, setShowAdd] = useState(false);
const [search, setSearch] = useState(''); const [search, setSearch] = useState('');
let resfiless = []; let resFiles = [];
const toggleShowAdd = () => setShowAdd(!showAdd); const toggleShowAdd = () => setShowAdd(!showAdd);
const clickHandler = (files) => { const clickHandler = (file) => {
if (props.multi) { if (props.multi) {
// eslint-disable-next-line eqeqeq // eslint-disable-next-line eqeqeq
const indexfiles = resfiless.findIndex((item) => item._id == files._id); const indexFile = resFiles.findIndex((item) => item.id == file.id);
if (indexfiles === -1) { if (indexFile === -1) {
resfiless.push(files); resFiles.push(file);
} else { } else {
resfiless.splice(indexfiles, 1); resFiles.splice(indexFile, 1);
} }
} else { } else {
handleSubmitLocal(files); handleSubmitLocal(file);
} }
}; };
const handleSubmitLocal = (files) => { const handleSubmitLocal = (file) => {
handleSubmit(props.multi ? resfiless : files); handleSubmit(props.multi ? resFiles : file);
handleClose(); handleClose();
}; };
const addFiles = (objects) => {
for(let i = 0; i < objects.length; i++) {
setFiles((prev) => [...prev, objects[i]]);
}
}
useEffect(() => { useEffect(() => {
API.getFiles() API.getFiles()
.then((res) => { .then((res) => {
@ -41,7 +47,7 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
} }
}) })
.catch((err) => { .catch((err) => {
setNotification(true, err.response.data.error); setNotification(true, err.message);
}); });
return () => {}; return () => {};
@ -57,7 +63,7 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
} }
}) })
.catch((err) => { .catch((err) => {
setNotification(true, err.response.data.error); setNotification(true, err.message);
}); });
} else if (search.length === 0) { } else if (search.length === 0) {
API.getFiles() API.getFiles()
@ -67,7 +73,7 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
} }
}) })
.catch((err) => { .catch((err) => {
setNotification(true, err.response.data.error); setNotification(true, err.message);
}); });
} }
}, [search]); }, [search]);
@ -94,8 +100,8 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
/> />
<ScrollArea h={430} offsetScrollbars> <ScrollArea h={430} offsetScrollbars>
<Grid columns={3}> <Grid columns={3}>
{files.map((file) => ( {files.map((file, index) => (
<SelectorItem file={file} clickHandler={clickHandler} key={file.id} /> <SelectorItem file={file} clickHandler={clickHandler} key={file.id+index} />
))} ))}
</Grid> </Grid>
</ScrollArea> </ScrollArea>
@ -118,7 +124,7 @@ const ModalFileSelector = ({ opened, handleClose, handleSubmit, ...props }) => {
<ModalAddFile <ModalAddFile
opened={showAdd} opened={showAdd}
handler={toggleShowAdd} handler={toggleShowAdd}
addFiles={(files) => setFiles((prev) => [...prev, files])} addFiles={(files) => addFiles(files)}
/> />
)} )}
</Modal.Body> </Modal.Body>