ok

src/App.js

@@ -1,26 +1,47 @@
 import "./App.css";
-
 import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
 
 import Dashboard from "./Dashboard";
 import Login from "./Login";
 import CameraKtp from "./KTPScanner";
 
-import "./App.css";
+// Komponen untuk melindungi route dengan token
-
-// ✅ Komponen proteksi route
 const ProtectedRoute = ({ element }) => {
   const token = localStorage.getItem("token");
   return token ? element : <Navigate to="/login" />;
 };
 
+// Komponen redirect berdasarkan sessionStorage
+const HomeRedirect = () => {
+  const token = localStorage.getItem("token");
+  const hasOpen = sessionStorage.getItem("hasOpen");
+
+  if (!token) {
+    return <Navigate to="/login" />;
+  }
+
+  // Jika tidak ada sessionId (anggap sebagai session baru)
+  if (!hasOpen) {
+    sessionStorage.setItem("hasOpen", true);
+
+    return <Navigate to="/scan" />;
+  }
+
+  // Jika sudah ada sessionId
+  return <Navigate to="/dashboard" />;
+};
+
 function App() {
   return (
     <div className="App">
       <Routes>
         <Route path="/login" element={<Login />} />
         <Route path="/scan" element={<CameraKtp />} />
-        <Route path="/" element={<ProtectedRoute element={<Dashboard />} />} />
+        <Route
+          path="/dashboard"
+          element={<ProtectedRoute element={<Dashboard />} />}
+        />
+        <Route path="/" element={<HomeRedirect />} />
       </Routes>
     </div>
   );

src/Dashboard.js

@@ -217,7 +217,7 @@ const Dashboard = () => {
         <div className={styles.dashboardGrid}>
           {user.role === "admin" && (
             <div className={styles.formSection}>
-              <h2>Tambah Officer Baru</h2>
+              <h2>Tambah Petugas Baru</h2>
               <form onSubmit={handleAddOfficer} className={styles.form}>
                 <label>
                   Username

src/KTPScanner.js

@@ -1,10 +1,14 @@
 import React, { useEffect, useRef, useState } from "react";
+import { useNavigate } from "react-router-dom";
+
 import Modal from "./Modal";
 import PaginatedFormEditable from "./PaginatedFormEditable";
 
 const STORAGE_KEY = "camera_canvas_gallery";
 
 const CameraCanvas = () => {
+  const navigate = useNavigate();
+
   const videoRef = useRef(null);
   const canvasRef = useRef(null);
   const hiddenCanvasRef = useRef(null);

src/Login.js

@@ -49,7 +49,7 @@ const Login = () => {
     <div className={styles.loginContainer}>
       <div className={styles.loginBox}>
         <img src="/PSI.png" alt="Logo" className={styles.logo} />
-        <h1 className={styles.h1}>PSI Admin Login</h1>
+        <h1 className={styles.h1}>KTP Scanner login</h1>
         <p className={styles.subtitle}>
           Silakan masuk untuk melanjutkan ke dashboard
         </p>