refactor: simplify notification state management across components

src/pages/CheckInOutLog.jsx

@@ -10,10 +10,7 @@ import { useLoading } from "../hooks/useLoading";
 function CheckInOutLog() {
   const [time, setTime] = useState(null);
   const [checkType, setCheckType] = useState("");
-  const [notification, setNotification] = useState({
-    message: "",
-    type: "",
-  });
+  const [notification, setNotification] = useState({ message: "", type: "" });
 
   const location = useLocation();
   const showToast = useToast();
@@ -29,7 +26,11 @@ function CheckInOutLog() {
     // Add your logic here
     try {
       setIsLoading(true);
-      const response = await lockerService.checkInOut(accountNumber, time, checkType);
+      const response = await lockerService.checkInOut(
+        accountNumber,
+        time,
+        checkType
+      );
       if (response.status === 200) {
         setNotification({ message: response.data.message, type: "success" });
       } else {
@@ -42,7 +43,7 @@ function CheckInOutLog() {
     } finally {
       setIsLoading(false);
     }
-  }
+  };
 
   return (
     <div>
@@ -80,7 +81,7 @@ function CheckInOutLog() {
             </select>
           </div>
         </div>
-        <Button text="Submit" onClick={handleSubmit}/>
+        <Button text="Submit" onClick={handleSubmit} />
       </FormBox>
     </div>
   );