add notif when gantt null

src/components/BottomModal/BottomModal.js

@@ -6,6 +6,7 @@ import Icon from '@iconify/react'
 import closeCircleOutline from '@iconify/icons-ion/close-circle-outline';
 import removeCircleOutline from '@iconify/icons-ion/remove-circle-outline';
 import windowMaximaze from '@iconify/icons-mdi/window-maximize';
+import { NotificationContainer, NotificationManager } from 'react-notifications';
 
 const BottomModal = ({ title, tableHeader, tableData, closeModal, isReady }) => {
     const [tableHeight, setTableHeight] = useState(150)
@@ -39,19 +40,36 @@ const BottomModal = ({title, tableHeader, tableData, closeModal, isReady}) => {
 
     const renderTableRow = (item) => {
         let row = [];
+
         // looping through its object keys (item is an object)
         Object.keys(item).map(key => {
             if (key === 'project_name') {
                 let URL = `/#/dashboard-project/${item['id']}/${item['last_gantt_id']}`;
-                row.push(<td><a href={URL}>{item[key]}</a></td>)
-			} else if(key === 'last_gantt_id') {
-			} else if(key === 'id') {
+                row.push(
+                    <td>
+                        <a
+                            href={URL}
+                            onClick={(e) => {
+                                e.preventDefault();
+                                if (!item['last_gantt_id']) {
+                                    NotificationManager.warning('Data Gantt Belum Tersedia.', 'Warning');
                                 } else {
-                row.push(<td>{item[key]}</td>)
+                                    window.location.href = URL;
                                 }
-        })
-        return row;
+                            }}
+                        >
+                            {item[key]}
+                        </a>
+                    </td>
+                );
+            } else if (key === 'id' || key === 'last_gantt_id') {
+            } else {
+                row.push(<td>{item[key]}</td>);
             }
+        });
+
+        return row;
+    };
 
     const RenderTable = useMemo(() => {
         if (tableData && tableData.length > 0) {
@@ -92,6 +110,8 @@ const BottomModal = ({title, tableHeader, tableData, closeModal, isReady}) => {
     }, [tableData, isReady])
 
     return (
+        <>
+            <NotificationContainer />
             <Resizable
                 style={{
                     position: "fixed",
@@ -171,6 +191,7 @@ const BottomModal = ({title, tableHeader, tableData, closeModal, isReady}) => {
                     </Card>
                 </div>
             </Resizable>
+        </>
     )
 }