update download btn disable

src/components/FileList.js

@@ -19,6 +19,7 @@ export default function FileList({ refType, refId, allowDelete, sx, dateHideable
     const theme = useTheme();
     const isMdOrLg = useMediaQuery(theme.breakpoints.up('md'));
     const intl = useIntl();
+    const [onDownload, setOnDownload] = React.useState(false);
 
     React.useEffect(() => {
         loadData();
@@ -41,10 +42,17 @@ export default function FileList({ refType, refId, allowDelete, sx, dateHideable
     };
 
     const onDownloadClick = (fileId, skey, filename) => () => {
+        setOnDownload(true)
         HttpUtils.fileDownload({
             fileId: fileId,
             skey: skey,
             filename: filename,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     };
 
@@ -91,6 +99,7 @@ export default function FileList({ refType, refId, allowDelete, sx, dateHideable
                             className="textPrimary"
                             onClick={onDownloadClick(params.id, params.row.skey, params.row.filename)}
                             color="primary"
+                            disabled={onDownload}
                         />]
                 },
             },
@@ -139,6 +148,7 @@ export default function FileList({ refType, refId, allowDelete, sx, dateHideable
                             className="textPrimary"
                             onClick={onDownloadClick(params.id, params.row.skey, params.row.filename)}
                             color="primary"
+                            disabled={onDownload}
                         />]
                 },
             },

src/pages/AuditLog/AuditLogSearchForm.js

@@ -21,8 +21,8 @@ import {ThemeProvider} from "@emotion/react";
 import * as DateUtils from "utils/DateUtils";
 import * as UrlUtils from "utils/ApiPathConst";
 import * as HttpUtils from "utils/HttpUtils";
-import Loadable from 'components/Loadable';
-const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
+// import Loadable from 'components/Loadable';
+// const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));
 
 import {DatePicker} from "@mui/x-date-pickers/DatePicker";
 import dayjs from "dayjs";
@@ -190,16 +190,13 @@ const AuditLogSearchForm = ({ applySearch, searchCriteria, onGridReady}) => {
                                 <Grid container maxWidth justifyContent="flex-end">
                                     {isGranted("MAINTAIN_SETTING") ?
                                         <Grid item sx={{ ml: 3, mr: 3, mb: 3,}}>
-                                            {onDownload?
-                                                <LoadingComponent disableText={true} alignItems="flex-start"/>
-                                            :
-                                                <Button
-                                                    variant="contained"
-                                                    onClick={exportExcel}
-                                                >
-                                                Export
-                                                </Button>
-                                            }
+                                            <Button
+                                                variant="contained"
+                                                onClick={exportExcel}
+                                                disabled={onDownload}
+                                            >
+                                            Export
+                                            </Button>
                                         </Grid> : null
                                     }
                                     <Grid item sx={{ ml: 3, mr: 3, mb: 3,}}>

src/pages/DemandNote/Search/DataGrid.js

@@ -41,6 +41,7 @@ export default function SearchDemandNote({ applySearch, searchCriteria, applyGri
     const [_searchCriteria, set_searchCriteria] = useState({});
     const [selectedRowItems, setSelectedRowItems] = useState([]);
     const navigate = useNavigate()
+    const [onDownload, setOnDownload] = useState(false);
 
     useEffect(() => {
         set_searchCriteria(searchCriteria);
@@ -86,10 +87,17 @@ export default function SearchDemandNote({ applySearch, searchCriteria, applyGri
     }
 
     const onDownloadClick = (params) => () => {
+        setOnDownload(true)
         HttpUtils.fileDownload({
             fileId: params.row.fileId,
             skey: params.row.skey,
             filename: params.row.filename,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     };
 
@@ -282,7 +290,7 @@ export default function SearchDemandNote({ applySearch, searchCriteria, applyGri
             ),
             width: 280,
             renderCell: (params) => {
-                return <Button onClick={onDownloadClick(params)}><u>{params.row.filename}</u></Button>;
+                return <Button disabled={onDownload} onClick={onDownloadClick(params)}><u>{params.row.filename}</u></Button>;
             },
         },
         {

src/pages/Organization/SearchPage/OrganizationSearchForm.js

@@ -24,6 +24,7 @@ const OrganizationSearchForm = ({ applySearch, onGridReady, searchCriteria }) =>
     const [type, setType] = useState([]);
     const [creditorSelected, setCreditorSelected] = React.useState(ComboData.CreditorStatus[0]);
     const { reset, register, handleSubmit } = useForm()
+    const [onDownload, setOnDownload] = React.useState(false);
     
     useEffect(() => {
         if(searchCriteria.creditor!=undefined){
@@ -65,8 +66,15 @@ const OrganizationSearchForm = ({ applySearch, onGridReady, searchCriteria }) =>
     }
 
     const doExport=()=>{
+        setOnDownload(true)
         HttpUtils.fileDownload({
-            url: UrlUtils.GET_ORG_EXPORT
+            url: UrlUtils.GET_ORG_EXPORT,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     }
 
@@ -164,6 +172,7 @@ const OrganizationSearchForm = ({ applySearch, onGridReady, searchCriteria }) =>
                             <Button
                                 variant="contained"
                                 onClick={doExport}
+                                disabled={onDownload}
                             >
                                 Export
                             </Button>

src/pages/Payment/Details_GLD/PaymentDetails.js

@@ -165,14 +165,10 @@ const PaymentDetails = ({ formData,doPrint,onDownload }) => {
                                             </FormLabel>
                                         </Grid>
                                         <Grid xs={6} md={5} sx={{ml:5,textAlign: "left" }}>
-                                            {onDownload?
-                                                <LoadingComponent disableText={true} alignItems="flex-start"/>
-                                            :
-                                                <Button className="printHidden" variant="contained" sx={{ mt:2 }} onClick={doPrint}>
-                                                    <DownloadIcon/>
-                                                    <Typography sx={{fontSize: "16px"}}>Download</Typography>
-                                                </Button>
-                                            }
+                                            <Button className="printHidden" variant="contained" disabled={onDownload} sx={{ mt:2 }} onClick={doPrint}>
+                                                <DownloadIcon/>
+                                                <Typography sx={{fontSize: "16px"}}>Download</Typography>
+                                            </Button>
                                         </Grid>
                                     </Grid>
                                 </Grid>

src/pages/Payment/Details_Public/PaymentDetails.js

@@ -208,16 +208,12 @@ const PaymentDetails = ({ formData,doPrint,onDownload }) => {
                                                     </FormLabel>
                                                 </Grid>
                                                 <Grid item xs={6} md={5} sx={{textAlign: "left" }}>
-                                                    {onDownload?
-                                                        <LoadingComponent disableText={true} alignItems="flex-start"/>
-                                                    :
-                                                        <Button className="printHidden" variant="contained" sx={{ mt:2 }} onClick={doPrint}>
-                                                            <DownloadIcon/>
-                                                            <Typography sx={{fontSize: "16px"}}>
-                                                                <FormattedMessage id="download"/>
-                                                            </Typography>
-                                                        </Button>
-                                                    }
+                                                    <Button className="printHidden" variant="contained" disabled={onDownload} sx={{ mt:2 }} onClick={doPrint}>
+                                                        <DownloadIcon/>
+                                                        <Typography sx={{fontSize: "16px"}}>
+                                                            <FormattedMessage id="download"/>
+                                                        </Typography>
+                                                    </Button>
                                                 </Grid>
                                             </Grid>
                                         </Grid>

src/pages/Proof/Reply_GLD/ApplicationDetails.js

@@ -34,6 +34,7 @@ const ApplicationDetailCard = ({
 
     const [data, setData] = useState({});
     const [cancelPopUp, setCancelPopUp] = useState(false);
+    const [onDownload, setOnDownload] = useState(false);
 
     useEffect(() => {
         if (formData) {
@@ -108,8 +109,15 @@ const ApplicationDetailCard = ({
     }
 
     const genProof = () => {
+        setOnDownload(true)
         HttpUtils.fileDownload({
-            url: UrlUtils.GEN_GAZETTE_PROOF + "/" + params.id
+            url: UrlUtils.GEN_GAZETTE_PROOF + "/" + params.id,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     }
 
@@ -130,7 +138,7 @@ const ApplicationDetailCard = ({
                         component="span"
                         variant="contained"
                         size="large"
-                        disabled={!showProofBtn}
+                        disabled={!showProofBtn||onDownload}
                         onClick={genProof}
                     >
                         <Typography variant="h5">Proof Slip</Typography>

src/pages/PublicNotice/Details_GLD/ApplicationDetailCard.js

@@ -56,6 +56,7 @@ const ApplicationDetailCard = (
     const [warningText, setWarningText] = useState("");
 
     const [remarksPopUp, setRemarksPopUp] = useState(false);
+    const [onDownload, setOnDownload] = useState(false);
 
     useEffect(() => {
         //if user data from parent are not null
@@ -84,12 +85,19 @@ const ApplicationDetailCard = (
     }
 
     const onDownloadClick = () => () => {
+        setOnDownload(true)
         HttpUtils.fileDownload({
             fileId: fileDetail?.id,
             skey: fileDetail?.skey,
             filename: fileDetail?.filename,
+            onResponse:()=>{
+                setOnDownload(false)
+                notifyDownloadSuccess()
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
-        notifyDownloadSuccess()
         setUploadStatus(true)
     };
 
@@ -680,7 +688,7 @@ const ApplicationDetailCard = (
                                                                 size="small"
                                                                 variant="contained"
                                                                 onClick={onDownloadClick()}
-                                                                disabled={!fileDetail?.filename}
+                                                                disabled={!fileDetail?.filename||onDownload}
                                                                 sx={{
                                                                     textTransform: 'capitalize',
                                                                     alignItems: 'end',

src/pages/PublicNotice/Details_Public/ApplicationDetailCard.js

@@ -61,6 +61,8 @@ const ApplicationDetailCard = (
     const [onReady, setOnReady] = useState(false);
     const [issueNum, setIssueNum] = useState("");
     const [issueDate, setIssueDate] = useState("");
+    const [onDownload, setOnDownload] = useState(false);
+    
     const { register,
         // getValues
     } = useForm();
@@ -89,10 +91,17 @@ const ApplicationDetailCard = (
     }, [currentApplicationDetailData]);
 
     const onDownloadClick = () => () => {
+        setOnDownload(true)
         HttpUtils.fileDownload({
             fileId: fileDetail?.id,
             skey: fileDetail?.skey,
             filename: fileDetail?.filename,
+            onResponse:()=>{
+                setOnDownload(false)
+            },
+            onError:()=>{
+                setOnDownload(false)
+            }
         });
     };
 
@@ -646,7 +655,7 @@ const ApplicationDetailCard = (
                                                                     aria-label={intl.formatMessage({ id: 'download' })}
                                                                     title={intl.formatMessage({ id: 'download' })}
                                                                     color="save"
-                                                                    disabled={!fileDetail?.filename}
+                                                                    disabled={!fileDetail?.filename||onDownload}
                                                                     startIcon={<DownloadIcon sx={{ alignItems: "center" }} />}
                                                                 >
                                                                     <FormattedMessage id="download" />