UniqAI/hexabot
1
0
Fork 0
mirror of https://github.com/hexastack/hexabot synced 2025-05-08 06:44:49 +00:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

Merge pull request #920 from Hexastack/153-request---add-loading-state-for-document-upload-in-attachmentuploader-component
Some checks are pending
Build and Push Docker API Image / build-and-push (push) Waiting to run
Details
Build and Push Docker Base Image / build-and-push (push) Waiting to run
Details
Build and Push Docker UI Image / build-and-push (push) Waiting to run
Details

Browse Source 
feat: add loading spinner for document upload
This commit is contained in:
Yassine 2025-04-12 12:35:35 +01:00 committed by GitHub
commit dadb263176
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
frontend/src/app-components/attachment/AttachmentUploader.tsx
View File

@ -8,7 +8,15 @@
import CloudUploadIcon from "@mui/icons-material/CloudUpload"; import CloudUploadIcon from "@mui/icons-material/CloudUpload";
import FolderCopyIcon from "@mui/icons-material/FolderCopy"; import FolderCopyIcon from "@mui/icons-material/FolderCopy";
import { Box, Button, Divider, Grid, styled, Typography } from "@mui/material"; import {
Box,
Button,
CircularProgress,
Divider,
Grid,
styled,
Typography,
} from "@mui/material";
import { ChangeEvent, DragEvent, FC, useState } from "react"; import { ChangeEvent, DragEvent, FC, useState } from "react";
import { useUpload } from "@/hooks/crud/useUpload"; import { useUpload } from "@/hooks/crud/useUpload";
@ -84,17 +92,20 @@ const AttachmentUploader: FC<FileUploadProps> = ({
const dialogs = useDialogs(); const dialogs = useDialogs();
const [isDragOver, setIsDragOver] = useState<boolean>(false); const [isDragOver, setIsDragOver] = useState<boolean>(false);
const { toast } = useToast(); const { toast } = useToast();
const { mutate: uploadAttachment } = useUpload(EntityType.ATTACHMENT, { const { mutate: uploadAttachment, isLoading } = useUpload(
onError: () => { EntityType.ATTACHMENT,
toast.error(t("message.upload_failed")); {
onError: () => {
toast.error(t("message.upload_failed"));
},
onSuccess: (data) => {
toast.success(t("message.success_save"));
setAttachment(data);
onChange?.(data);
onUploadComplete?.();
},
}, },
onSuccess: (data) => { );
toast.success(t("message.success_save"));
setAttachment(data);
onChange && onChange(data);
onUploadComplete && onUploadComplete();
},
});
const stopDefaults = (e: DragEvent) => { const stopDefaults = (e: DragEvent) => {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
@ -167,7 +178,9 @@ const AttachmentUploader: FC<FileUploadProps> = ({
alignItems="center" alignItems="center"
sx={{ padding: "20px" }} sx={{ padding: "20px" }}
> >
{attachment ? ( {isLoading ? (
<CircularProgress />
) : attachment ? (
<AttachmentThumbnail <AttachmentThumbnail
id={attachment.id} id={attachment.id}
format="full" format="full"