src/App.jsx

@@ -32,9 +32,6 @@ import IndexEventAlarm from './pages/eventAlarm/IndexEventAlarm';
 import IndexRole from './pages/role/IndexRole';
 import IndexUser from './pages/user/IndexUser';
 
-// Shift Management
-import IndexMember from './pages/shiftManagement/member/IndexMember';
-
 import SvgTest from './pages/home/SvgTest';
 import SvgOverview from './pages/home/SvgOverview';
 import SvgCompressorA from './pages/home/SvgCompressorA';
@@ -81,21 +78,18 @@ const App = () => {
                     <Route path="status" element={<IndexStatus />} />
                 </Route>
 
-                <Route path="/jadwal-shift" element={<ProtectedRoute />}>
+                <Route path="/report" element={<ProtectedRoute />}>
-                    <Route index element={<IndexJadwalShift />} />
-                </Route>
-
-                <Route path="/history" element={<ProtectedRoute />}>
                     <Route path="trending" element={<IndexTrending />} />
                     <Route path="report" element={<IndexReport />} />
                 </Route>
 
-                <Route path="/notification" element={<ProtectedRoute />}>
+                <Route path="/history" element={<ProtectedRoute />}>
-                    <Route index element={<IndexNotification />} />
+                    <Route path="alarm" element={<IndexEventAlarm />} />
+                    <Route path="event" element={<IndexEventAlarm />} />
                 </Route>
 
-                <Route path="/event-alarm" element={<ProtectedRoute />}>
+                <Route path="/notification" element={<ProtectedRoute />}>
-                    <Route index element={<IndexEventAlarm />} />
+                    <Route index element={<IndexNotification />} />
                 </Route>
 
                 <Route path="/role" element={<ProtectedRoute />}>
@@ -106,8 +100,8 @@ const App = () => {
                     <Route index element={<IndexUser />} />
                 </Route>
 
-                <Route path="/shift-management" element={<ProtectedRoute />}>
+                <Route path="/jadwal-shift" element={<ProtectedRoute />}>
-                    <Route path="member" element={<IndexMember />} />
+                    <Route index element={<IndexJadwalShift />} />
                 </Route>
 
                 {/* Catch-all */}

src/layout/LayoutMenu.jsx

@@ -29,6 +29,8 @@ import {
     DesktopOutlined,
     NodeExpandOutlined,
     GroupOutlined,
+    SlidersOutlined,
+    SnippetsOutlined,
 } from '@ant-design/icons';
 
 const { Text } = Typography;
@@ -93,7 +95,7 @@ const allItems = [
             {
                 key: 'master-plant-section',
                 icon: <ProductOutlined style={{ fontSize: '19px' }} />,
-                label: <Link to="/master/plant-section">Plant Section</Link>,
+                label: <Link to="/master/plant-section">Plant Sub Section</Link>,
             },
             {
                 key: 'master-brand-device',
@@ -127,20 +129,37 @@ const allItems = [
             },
         ],
     },
+    {
+        key: 'report',
+        icon: <SnippetsOutlined style={{ fontSize: '19px' }} />,
+        label: 'Report',
+        children: [
+            {
+                key: 'report-trending',
+                icon: <LineChartOutlined style={{ fontSize: '19px' }} />,
+                label: <Link to="/report/trending">Trending</Link>,
+            },
+            {
+                key: 'report-report',
+                icon: <FileTextOutlined style={{ fontSize: '19px' }} />,
+                label: <Link to="/report/report">Report</Link>,
+            },
+        ],
+    },
     {
         key: 'history',
         icon: <HistoryOutlined style={{ fontSize: '19px' }} />,
         label: 'History',
         children: [
             {
-                key: 'history-trending',
+                key: 'history-alarm',
-                icon: <LineChartOutlined style={{ fontSize: '19px' }} />,
+                icon: <AlertOutlined style={{ fontSize: '19px' }} />,
-                label: <Link to="/history/trending">Trending</Link>,
+                label: <Link to="/history/alarm">Alarm</Link>,
             },
             {
-                key: 'history-report',
+                key: 'history-event',
-                icon: <FileTextOutlined style={{ fontSize: '19px' }} />,
+                icon: <SlidersOutlined style={{ fontSize: '19px' }} />,
-                label: <Link to="/history/report">Report</Link>,
+                label: <Link to="/history/event">Event</Link>,
             },
         ],
     },
@@ -149,16 +168,7 @@ const allItems = [
         icon: <BellOutlined style={{ fontSize: '19px' }} />,
         label: (
             <Link to="/notification" className="fontMenus">
-                Notifikasi
+                Notification
-            </Link>
-        ),
-    },
-    {
-        key: 'event-alarm',
-        icon: <AlertOutlined style={{ fontSize: '19px' }} />,
-        label: (
-            <Link to="/event-alarm" className="fontMenus">
-                Event Alarm
             </Link>
         ),
     },
@@ -206,9 +216,7 @@ const LayoutMenu = () => {
         if (pathname === '/user') return 'user';
         if (pathname === '/role') return 'role';
         if (pathname === '/notification') return 'notification';
-        if (pathname === '/event-alarm') return 'event-alarm';
         if (pathname === '/jadwal-shift') return 'jadwal-shift';
-        if (pathname === '/dashboard-svg') return 'dashboard-svg';
 
         // Handle master routes
         if (pathname.startsWith('/master/')) {
@@ -216,24 +224,24 @@ const LayoutMenu = () => {
             return `master-${subPath}`;
         }
 
-        // Handle master routes
+        // Handle dashboard svg routes
         if (pathname.startsWith('/dashboard-svg/')) {
             const subPath = pathParts[1];
             return `dashboard-svg-${subPath}`;
         }
 
+        // Handle report routes
+        if (pathname.startsWith('/report/')) {
+            const subPath = pathParts[1];
+            return `report-${subPath}`;
+        }
+
         // Handle history routes
         if (pathname.startsWith('/history/')) {
             const subPath = pathParts[1];
             return `history-${subPath}`;
         }
 
-        // Handle shift management routes
-        if (pathname.startsWith('/shift-management/')) {
-            const subPath = pathParts[1];
-            return `shift-${subPath}`;
-        }
-
         return 'home'; // default
     };
 
@@ -241,8 +249,8 @@ const LayoutMenu = () => {
     const getParentKey = (key) => {
         if (key.startsWith('master-')) return 'master';
         if (key.startsWith('dashboard-svg-')) return 'dashboard-svg';
+        if (key.startsWith('report-')) return 'report';
         if (key.startsWith('history-')) return 'history';
-        if (key.startsWith('shift-')) return 'shift-management';
         return null;
     };
 

src/pages/eventAlarm/component/ListEventAlarm.jsx

@@ -104,8 +104,8 @@ const ListEventAlarm = memo(function ListEventAlarm(props) {
             width: '15%',
         },
     ];
+
     const [trigerFilter, setTrigerFilter] = useState(false);
-    const [alarmsData] = useState(initialAlarmsData);
 
     const defaultFilter = { search: '' };
     const [formDataFilter, setFormDataFilter] = useState(defaultFilter);
@@ -115,50 +115,8 @@ const ListEventAlarm = memo(function ListEventAlarm(props) {
 
     // Dummy data function to simulate API call
     const getAllEventAlarm = async (params) => {
-        // Simulate API delay
-        await new Promise((resolve) => setTimeout(resolve, 300));
-
-        // Extract URLSearchParams
-        const searchParam = params.get('search') || '';
-        const page = parseInt(params.get('page')) || 1;
-        const limit = parseInt(params.get('limit')) || 10;
-
-        console.log('getAllEventAlarm called with:', { searchParam, page, limit });
-
-        // Filter by search
-        let filteredAlarms = alarmsData;
-        if (searchParam) {
-            const searchLower = searchParam.toLowerCase();
-            filteredAlarms = alarmsData.filter(
-                (alarm) =>
-                    alarm.tanggal.toLowerCase().includes(searchLower) ||
-                    alarm.plant_sub_section.toLowerCase().includes(searchLower) ||
-                    alarm.device.toLowerCase().includes(searchLower) ||
-                    alarm.tag.toLowerCase().includes(searchLower) ||
-                    alarm.engineer.toLowerCase().includes(searchLower)
-            );
-        }
-
-        // Pagination logic
-        const totalData = filteredAlarms.length;
-        const totalPages = Math.ceil(totalData / limit);
-        const startIndex = (page - 1) * limit;
-        const endIndex = startIndex + limit;
-        const paginatedData = filteredAlarms.slice(startIndex, endIndex);
-
         return {
-            status: 200,
+            data: initialAlarmsData,
-            statusCode: 200,
-            data: {
-                data: paginatedData,
-                total: totalData,
-                paging: {
-                    page: page,
-                    limit: limit,
-                    total: totalData,
-                    page_total: totalPages,
-                },
-            },
         };
     };
 
@@ -172,7 +130,7 @@ const ListEventAlarm = memo(function ListEventAlarm(props) {
         } else {
             navigate('/signin');
         }
-    }, [props.actionMode, alarmsData]);
+    }, [props.actionMode]);
 
     const doFilter = () => {
         setTrigerFilter((prev) => !prev);

src/pages/home/SvgAirDryerA.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/air_dryer_A_rev.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/air_dryer_A_rev.svg';
+// const filePathSvg = '/src/assets/svg/air_dryer_A_rev.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgAirDryerA = () => {

src/pages/home/SvgAirDryerB.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/air_dryer_B_rev.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/air_dryer_B_rev.svg';
+// const filePathSvg = '/src/assets/svg/air_dryer_B_rev.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgAirDryerB = () => {

src/pages/home/SvgAirDryerC.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/air_dryer_C_rev.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/air_dryer_C_rev.svg';
+// const filePathSvg = '/src/assets/svg/air_dryer_C_rev.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgAirDryerC = () => {

src/pages/home/SvgCompressorA.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/test-new.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/test-new.svg';
+// const filePathSvg = '/src/assets/svg/test-new.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgCompressorA = () => {

src/pages/home/SvgCompressorB.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/test-new.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/test-new.svg';
+// const filePathSvg = '/src/assets/svg/test-new.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgCompressorB = () => {

src/pages/home/SvgCompressorC.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/test-new.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/test-new.svg';
+// const filePathSvg = '/src/assets/svg/test-new.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgCompressorC = () => {

src/pages/home/SvgOverview.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import SvgTemplate from './SvgTemplate';
 import SvgViewer from './SvgViewer';
+import filePathSvg from '../../assets/svg/test-new.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/test-new.svg';
+// const filePathSvg = '/src/assets/svg/test-new.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgOverview = () => {

src/pages/home/SvgTest.jsx

@@ -3,10 +3,11 @@ import { Card, Typography, Flex } from 'antd';
 // import { ReactSVG } from 'react-svg';
 import { setValSvg } from '../../components/Global/MqttConnection';
 import { ReactSVG } from 'react-svg';
+import filePathSvg from '../../assets/svg/test-new.svg';
 
 const { Text } = Typography;
 
-const filePathSvg = '/src/assets/svg/test-new.svg';
+// const filePathSvg = '/src/assets/svg/test-new.svg';
 const topicMqtt = 'PIU_GGCP/Devices/PB';
 
 const SvgTest = () => {

src/pages/master/status/IndexStatus.jsx

@@ -64,15 +64,14 @@ const IndexStatus = memo(function IndexStatus() {
 
     return (
         <React.Fragment>
-            {actionMode === 'list' && (
+            <ListStatus
-                <ListStatus
+                actionMode={actionMode}
-                    actionMode={actionMode}
+                setActionMode={setMode}
-                    setActionMode={setMode}
+                selectedData={selectedData}
-                    selectedData={selectedData}
+                setSelectedData={setSelectedData}
-                    setSelectedData={setSelectedData}
+                readOnly={readOnly}
-                    readOnly={readOnly}
+            />
-                />
+
-            )}
             <DetailStatus
                 setActionMode={setMode}
                 selectedData={selectedData}

src/pages/master/unit/component/DetailUnit.jsx

@@ -13,7 +13,7 @@ const DetailUnit = (props) => {
         unit_id: '',
         unit_code: '',
         unit_name: '',
-        description: '',
+        unit_description: '',
         is_active: true,
     };
 
@@ -46,7 +46,7 @@ const DetailUnit = (props) => {
             const payload = {
                 is_active: formData.is_active,
                 unit_name: formData.unit_name,
-                description: formData.description,
+                unit_description: formData.unit_description,
             };
 
             const response =
@@ -206,8 +206,8 @@ const DetailUnit = (props) => {
                     <div style={{ marginBottom: 12 }}>
                         <Text strong>Description</Text>
                         <Input.TextArea
-                            name="description"
+                            name="unit_description"
-                            value={formData.description}
+                            value={formData.unit_description}
                             onChange={handleInputChange}
                             placeholder="Enter Description (Optional)"
                             readOnly={props.readOnly}

src/pages/master/unit/component/ListUnit.jsx

@@ -34,8 +34,8 @@ const columns = (showPreviewModal, showEditModal, showDeleteDialog) => [
     },
     {
         title: 'Description',
-        dataIndex: 'description',
+        dataIndex: 'unit_description',
-        key: 'description',
+        key: 'unit_description',
         width: '25%',
         render: (text) => text || '-',
     },