Merge pull request #16 from kenshanta/agree-once-session

session storage agreement asked once
kenshanta · Sep 17, 2024 · 0508abc · 0508abc
2 parents 5f7d41d + 81dbc49
commit 0508abc
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 17 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -16,7 +16,11 @@ import {
 import { Box, Button, CircularProgress } from "@mui/material";
 import { HousingService } from "./services";
 import { getYearlyQuarters, createNumberToQuarterMap } from "./utils/helpers";
-import { clearHistoryEntry, createHistoryEntry } from "./stores/historySlice";
+import {
+  clearHistoryEntry,
+  createHistoryEntry,
+  addHistoryEntry,
+} from "./stores/historySlice";
 import { useParams, useNavigate } from "react-router-dom";
 import { useDispatch, useSelector } from "react-redux";
 import { toast } from "react-toastify";
@@ -34,14 +38,14 @@ ChartJS.register(
   Title,
   Tooltip,
   LineController,
-  BarController,
+  BarController
 );
 
 const App: React.FC = () => {
   const navigate = useNavigate();
   const dispatch = useDispatch();
   const { houseNumber = "00", from = "3", to = "7" } = useParams();
-  const [open, setOpen] = React.useState(false);
+  const [open, setOpen] = React.useState(!sessionStorage.getItem("agreed"));
   const searchHistoryList = useSelector((state: any) => state.history.history); //TODO: add type
   const [newData, setNewData] = React.useState({
     labels: [""],
@@ -95,24 +99,30 @@ const App: React.FC = () => {
     apartmentType: string;
     quarterly: number[];
   }) => {
-    if (
-      !searchHistoryList.includes(
-        `${window.location.protocol}//${window.location.host}/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`,
-      )
-    ) {
+    console.log(searchHistoryList, "------");
+    if (searchHistoryList.length === 0 && !sessionStorage.getItem("agreed")) {
       setOpen(true);
     } else if (
       searchHistoryList.includes(
-        `${window.location.protocol}//${window.location.host}/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`,
+        `${window.location.protocol}//${window.location.host}/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`
       )
     ) {
       toast("History already in list", { type: "success" });
       return;
+    } else if (sessionStorage.getItem("agreed") === "true") {
+      console.log(window.location.search, "parameter?");
+      dispatch(createHistoryEntry(window.location.href));
+      dispatch(addHistoryEntry());
+      navigate(
+        `/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`
+      );
+      return;
     }
+    dispatch(createHistoryEntry(window.location.href));
+
     navigate(
-      `/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`,
+      `/${data.apartmentType}/${data.quarterly[0]}/${data.quarterly[1]}`
     );
-    dispatch(createHistoryEntry(window.location.href));
   };
 
   return (
@@ -134,7 +144,7 @@ const App: React.FC = () => {
         <ConfirmationDialog open={open} setOpen={setOpen} />
         <SearchForm handleRegistration={handleRegistration} />
         <SearchHistoryList />
-        {localStorage.getItem("historyUrl") ? (
+        {sessionStorage.getItem("historyUrl") ? (
           <Box
             mt={2}
             display={"flex"}

diff --git a/src/components/confirmationDialog.tsx b/src/components/confirmationDialog.tsx
@@ -8,7 +8,12 @@ import {
   Button,
 } from "@mui/material";
 import { useDispatch } from "react-redux";
-import { addHistoryEntry, removeHistoryEntry } from "../stores/historySlice";
+import {
+  addHistoryEntry,
+  removeHistoryEntry,
+  addAgreementEntry,
+  addDisagreementEntry,
+} from "../stores/historySlice";
 
 interface ConfirmationDialogProps {
   setOpen: Dispatch<SetStateAction<boolean>>;
@@ -21,11 +26,14 @@ const ConfirmationDialog: React.FC<ConfirmationDialogProps> = ({
 }) => {
   const dispatch = useDispatch();
   const onConfirm = () => {
+    dispatch(addAgreementEntry());
     dispatch(addHistoryEntry());
     setOpen(false);
   };
   const handleClose = () => {
     setOpen(false);
+    dispatch(addDisagreementEntry());
+
     dispatch(removeHistoryEntry());
   };
   return (

diff --git a/src/components/searchHistoryList.tsx b/src/components/searchHistoryList.tsx
@@ -3,7 +3,9 @@ import { Box, Typography, List, ListItem, ListItemText } from "@mui/material";
 import { createNumberToQuarterMap, getHouseName } from "../utils/helpers";
 
 const SearchHistoryList: React.FC = () => {
-  const memoryHistory = JSON.parse(localStorage.getItem("historyUrl") || "[]");
+  const memoryHistory = JSON.parse(
+    sessionStorage.getItem("historyUrl") || "[]"
+  );
   if (memoryHistory.length === 0) {
     return (
       <Box

diff --git a/src/stores/historySlice.tsx b/src/stores/historySlice.tsx
@@ -5,7 +5,7 @@ interface InitialStateProps {
 }
 
 const initialState: InitialStateProps = {
-  history: JSON.parse(localStorage.getItem("historyUrl") || "[]"),
+  history: JSON.parse(sessionStorage.getItem("historyUrl") || "[]"),
 };
 
 const historySlice = createSlice({
@@ -16,13 +16,20 @@ const historySlice = createSlice({
       state.history = [...state.history, action.payload];
     },
     addHistoryEntry(state) {
-      localStorage.setItem("historyUrl", JSON.stringify([...state.history]));
+      sessionStorage.setItem("historyUrl", JSON.stringify([...state.history]));
+    },
+    addAgreementEntry() {
+      sessionStorage.setItem("agreed", "true");
+    },
+    addDisagreementEntry() {
+      sessionStorage.setItem("agreed", "false");
     },
     removeHistoryEntry(state) {
       state.history.pop();
     },
     clearHistoryEntry(state) {
-      localStorage.clear();
+      sessionStorage.removeItem("historyUrl");
+      sessionStorage.removeItem("agreed");
       state.history = [];
       // window.location.reload();
     },
@@ -34,5 +41,7 @@ export const {
   createHistoryEntry,
   clearHistoryEntry,
   removeHistoryEntry,
+  addAgreementEntry,
+  addDisagreementEntry,
 } = historySlice.actions;
 export default historySlice.reducer;