diff --git a/src/pages/eventAlarm/IndexEventAlarm.jsx b/src/pages/eventAlarm/IndexEventAlarm.jsx
new file mode 100644
index 0000000..554ad55
--- /dev/null
+++ b/src/pages/eventAlarm/IndexEventAlarm.jsx
@@ -0,0 +1,30 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexEventAlarm = memo(function IndexEventAlarm() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Event Alarm }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Event Alarm Page
+
+ );
+});
+
+export default IndexEventAlarm;
diff --git a/src/pages/history/report/IndexReport.jsx b/src/pages/history/report/IndexReport.jsx
new file mode 100644
index 0000000..44c3b7a
--- /dev/null
+++ b/src/pages/history/report/IndexReport.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexReport = memo(function IndexReport() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • History },
+ { title: Report }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Report Page
+
+ );
+});
+
+export default IndexReport;
diff --git a/src/pages/history/trending/IndexTrending.jsx b/src/pages/history/trending/IndexTrending.jsx
new file mode 100644
index 0000000..50a4a4d
--- /dev/null
+++ b/src/pages/history/trending/IndexTrending.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexTrending = memo(function IndexTrending() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • History },
+ { title: Trending }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Trending Page
+
+ );
+});
+
+export default IndexTrending;
diff --git a/src/pages/master/brandDevice/IndexBrandDevice.jsx b/src/pages/master/brandDevice/IndexBrandDevice.jsx
new file mode 100644
index 0000000..aa60fc3
--- /dev/null
+++ b/src/pages/master/brandDevice/IndexBrandDevice.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexBrandDevice = memo(function IndexBrandDevice() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Master },
+ { title: Brand Device }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Brand Device Page
+
+ );
+});
+
+export default IndexBrandDevice;
diff --git a/src/pages/master/errorCode/IndexErrorCode.jsx b/src/pages/master/errorCode/IndexErrorCode.jsx
new file mode 100644
index 0000000..3ce1862
--- /dev/null
+++ b/src/pages/master/errorCode/IndexErrorCode.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexErrorCode = memo(function IndexErrorCode() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Master },
+ { title: Error Code }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Error Code Page
+
+ );
+});
+
+export default IndexErrorCode;
diff --git a/src/pages/master/tag/IndexTag.jsx b/src/pages/master/tag/IndexTag.jsx
new file mode 100644
index 0000000..17ef600
--- /dev/null
+++ b/src/pages/master/tag/IndexTag.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexTag = memo(function IndexTag() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Master },
+ { title: Tag }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Tag Page
+
+ );
+});
+
+export default IndexTag;
diff --git a/src/pages/notification/IndexNotification.jsx b/src/pages/notification/IndexNotification.jsx
new file mode 100644
index 0000000..3f45aa4
--- /dev/null
+++ b/src/pages/notification/IndexNotification.jsx
@@ -0,0 +1,30 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexNotification = memo(function IndexNotification() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Notifikasi }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Notifikasi Page
+
+ );
+});
+
+export default IndexNotification;
diff --git a/src/pages/role/IndexRole.jsx b/src/pages/role/IndexRole.jsx
new file mode 100644
index 0000000..91d9735
--- /dev/null
+++ b/src/pages/role/IndexRole.jsx
@@ -0,0 +1,30 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexRole = memo(function IndexRole() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Role }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Role Page
+
+ );
+});
+
+export default IndexRole;
diff --git a/src/pages/shiftManagement/member/IndexMember.jsx b/src/pages/shiftManagement/member/IndexMember.jsx
new file mode 100644
index 0000000..62789b4
--- /dev/null
+++ b/src/pages/shiftManagement/member/IndexMember.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexMember = memo(function IndexMember() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Manajemen Shift },
+ { title: Anggota Shift }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Anggota Shift Page
+
+ );
+});
+
+export default IndexMember;
diff --git a/src/pages/shiftManagement/schedule/IndexSchedule.jsx b/src/pages/shiftManagement/schedule/IndexSchedule.jsx
new file mode 100644
index 0000000..dd89676
--- /dev/null
+++ b/src/pages/shiftManagement/schedule/IndexSchedule.jsx
@@ -0,0 +1,31 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexSchedule = memo(function IndexSchedule() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • Manajemen Shift },
+ { title: Jadwal Shift }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
Jadwal Shift Page
+
+ );
+});
+
+export default IndexSchedule;
diff --git a/src/pages/user/IndexUser.jsx b/src/pages/user/IndexUser.jsx
new file mode 100644
index 0000000..373aa47
--- /dev/null
+++ b/src/pages/user/IndexUser.jsx
@@ -0,0 +1,30 @@
+import React, { memo, useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
+import { Typography } from 'antd';
+
+const { Text } = Typography;
+
+const IndexUser = memo(function IndexUser() {
+ const navigate = useNavigate();
+ const { setBreadcrumbItems } = useBreadcrumb();
+
+ useEffect(() => {
+ const token = localStorage.getItem('token');
+ if (token) {
+ setBreadcrumbItems([
+ { title: • User }
+ ]);
+ } else {
+ navigate('/signin');
+ }
+ }, []);
+
+ return (
+
+
User Page
+
+ );
+});
+
+export default IndexUser;