IO-889 Document Upload notification and file list clear

client/src/components/documents-upload/documents-upload.component.jsx

@@ -1,6 +1,6 @@
 import { UploadOutlined } from "@ant-design/icons";
 import { notification, Progress, Result, Space, Upload } from "antd";
-import React, { useMemo } from "react";
+import React, { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -27,6 +27,7 @@ export function DocumentsUploadComponent({
   ignoreSizeLimit = false,
 }) {
   const { t } = useTranslation();
+  const [fileList, setFileList] = useState([]);
 
   const pct = useMemo(() => {
     return parseInt(
@@ -40,12 +41,24 @@ export function DocumentsUploadComponent({
         status="error"
         title={t("documents.labels.storageexceeded_title")}
         subTitle={t("documents.labels.storageexceeded")}
-      ></Result>
+      />
     );
 
+  const handleDone = (uid) => {
+    setTimeout(() => {
+      setFileList((fileList) => fileList.filter((x) => x.uid !== uid));
+    }, 2000);
+  };
+
   return (
     <Upload.Dragger
       multiple={true}
+      fileList={fileList}
+      onChange={(f) => {
+        console.log(`f`, f);
+        if (f.event && f.event.percent === 100) handleDone(f.file.uid);
+        setFileList(f.fileList);
+      }}
       beforeUpload={(file, fileList) => {
         if (ignoreSizeLimit) return true;
         const newFiles = fileList.reduce((acc, val) => acc + val.size, 0);