add loader

src/views/SimproV2/CreatedProyek/AssignK3Project.js

@@ -3,11 +3,14 @@ import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
 import { Button, Form } from 'reactstrap';
 import axios from "../../../const/interceptorApi";
 import { PROJECT_TO_CHECKLIST_K3_ADDS, PROJECT_TO_CHECKLIST_K3_SEARCH } from '../../../const/ApiConst';
-import { Transfer } from 'antd';
+import { Transfer, Spin } from 'antd';
 import 'antd/dist/antd.css';
+import { NotificationManager } from 'react-notifications';
 
 const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3, proyekName }) => {
   const token = localStorage.getItem("token")
+  const [loading, setLoading] = useState(true);
+
   const HEADER = {
     headers: {
       "Content-Type": "application/json",
@@ -30,7 +33,8 @@ const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3
   }, [openDialog])
 
   useEffect(() => {
-    if(idTask && idTask > 0){
+    if (idTask && idTask > 0) {
+        setLoading(true);
         getK3toProject()
     }
   }, [idTask])
@@ -56,8 +60,10 @@ const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3
             });
         }
         setTargetKeys(newTargetKeys)
+        setLoading(false);
     }else{
-        
+      setLoading(false);
+      NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
     }
   }
 
@@ -126,7 +132,9 @@ const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3
       <Modal size="lg" style={{maxWidth: '600px', width: '100%'}} isOpen={openDialog} toggle={toggleDialog}>
         <ModalHeader className="capitalize" toggle={closeDialog}>Assign K3 to Project {proyekName !== '' ? `- ${proyekName}` : ''}</ModalHeader>
         <ModalBody>
-          {renderForm()}
+          <Spin tip="Loading..." spinning={loading}>
+            {renderForm()}
+          </Spin>
         </ModalBody>
         <ModalFooter>
           <Button color="primary" onClick={() => handleSave()}>Save</Button>{' '}