Polished and removed redundant type interfaces for redux states

src/Components/DashboardPage/SessionStatsWidget/SessionStatsWidget.tsx

@@ -3,16 +3,16 @@ import styles from "../../../styles";
 import ColoredCube from "../../ColoredCube/ColoredCube";
 import StatsIcon from "../../Icons/StatsIcon/StatsIcon";
 import { useSelector } from "react-redux";
-import { SessionTransactions } from "../../../Interfaces/Interfaces";
+import { RootState } from "../../../Plugins/Redux/Store/Store";
 
 export interface props {}
 
 export default function SessionStatsWidget() {
   const session_added = useSelector(
-    (state: SessionTransactions) => state.session_transactions.added
+    (state: RootState) => state.session_transactions.added
   );
   const session_removed = useSelector(
-    (state: SessionTransactions) => state.session_transactions.removed
+    (state: RootState) => state.session_transactions.removed
   );
   return (
     <div

src/Components/Login/Login.tsx

@@ -2,13 +2,12 @@ import { useSelector } from "react-redux";
 import { Button } from "@mui/material";
 import styles from "../../styles";
 import { useNavigate } from "react-router-dom";
-import { LoggedInUserState } from "../../Interfaces/Interfaces";
+import { RootState } from "../../Plugins/Redux/Store/Store";
-import { LoginState } from "../../Interfaces/Interfaces";
 
 export default function Login() {
-  const logged_in = useSelector((state: LoginState) => state.logged_in.value);
+  const logged_in = useSelector((state: RootState) => state.logged_in.value);
   const logged_in_user = useSelector(
-    (state: LoggedInUserState) => state.logged_in_user.value
+    (state: RootState) => state.logged_in_user.value
   );
   const navigate = useNavigate();
   if (logged_in) {

src/Components/LoginChecker/LoginChecker.tsx

@@ -2,14 +2,14 @@ import * as React from "react";
 import { Navigate } from "react-router-dom";
 
 import { useSelector } from "react-redux";
-import { LoginState, OldSessionState } from "../../Interfaces/Interfaces";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export interface props {}
 
 export default function LoginChecker() {
-  const logged_in = useSelector((state: LoginState) => state.logged_in.value);
+  const logged_in = useSelector((state: RootState) => state.logged_in.value);
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   if (!logged_in && !old_session_checked) {
   } else if (!logged_in && old_session_checked) {

src/Components/PreviousSessionChecker/PreviousSessionChecker.tsx

@@ -1,30 +1,32 @@
 import * as React from "react";
-import { useEffect } from "react";
+import { useEffect, useCallback } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { UserInfo } from "../Api/Api";
 import { toggle_login } from "../../Features/Redux/Slices/Login/LoginSlice";
 import { SetUser } from "../../Features/Redux/Slices/LoggedInUserSlice/LoggedInUserSlice";
-import { LoginState } from "../../Interfaces/Interfaces";
 import { set_checked } from "../../Features/Redux/Slices/OldSession/OldSessionSlice";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 export default function PreviousSessionChecker() {
   const dispatch = useDispatch();
-  const logged_in = useSelector((state: LoginState) => state.logged_in.value);
+  const logged_in = useSelector((state: RootState) => state.logged_in.value);
   // Function to check for previous login session
-  useEffect(() => {
+  const check = useCallback(async () => {
-    async function check() {
+    if (await UserInfo()) {
-      if (await UserInfo()) {
+      if (logged_in !== true) {
-        if (logged_in !== true) {
+        console.log("Previous session found. Restoring");
-          console.log("Previous session found. Restoring");
+        await dispatch(toggle_login());
-          await dispatch(toggle_login());
+        await dispatch(SetUser(await UserInfo()));
-          await dispatch(SetUser(await UserInfo()));
-        }
-      } else {
-        console.log("No old session found");
-        localStorage.removeItem("token");
       }
-      await dispatch(set_checked());
+    } else {
+      console.log("No old session found");
+      localStorage.removeItem("token");
     }
-    check();
+    await dispatch(set_checked());
-  }, []);
+  }, [dispatch, logged_in]);
+  useEffect(() => {
+    if (!logged_in) {
+      check();
+    }
+  }, [check, logged_in]);
   return <div />;
 }

src/Components/Sidebar/Sidebar.tsx

@@ -10,15 +10,11 @@ import InventoryIcon from "../Icons/InventoryIcon/InventoryIcon";
 import LogsIcon from "../Icons/LogsIcon/LogsIcon";
 import LogoutIcon from "../Icons/LogoutIcon/LogoutIcon";
 import TodayIcon from "../Icons/TodayIcon/TodayIcon";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
-export interface state {
-  logged_in: {
-    value: boolean;
-  };
-}
 export default function Sidebar() {
   const navigate = useNavigate();
-  const logged_in = useSelector((state: state) => state.logged_in.value);
+  const logged_in = useSelector((state: RootState) => state.logged_in.value);
   function LogoutButton() {
     if (!logged_in) {
       return <div />;

src/Interfaces/Interfaces.tsx

@@ -39,36 +39,6 @@ export interface ProductLog {
   history_user: string;
 }
 
-// Redux Interfaces
-export interface LoginState {
-  logged_in: {
-    value: boolean;
-  };
-}
-
-export interface OldSessionState {
-  old_session_checked: {
-    value: boolean;
-  };
-}
-
-export interface LoggedInUserState {
-  logged_in_user: {
-    value: {
-      email: string;
-      id: number;
-      username: string;
-    };
-  };
-}
-
-export interface SessionTransactions {
-  session_transactions: {
-    added: number;
-    removed: number;
-  };
-}
-
 // Component Props Interfaces
 
 export interface IconProps {

src/Plugins/Redux/Store/Store.tsx

@@ -4,7 +4,7 @@ import LoggedInUserReducer from "../../../Features/Redux/Slices/LoggedInUserSlic
 import OldSessionReducer from "../../../Features/Redux/Slices/OldSession/OldSessionSlice";
 import TransactionsThisSessionReducer from "../../../Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice";
 
-export default configureStore({
+const store = configureStore({
   reducer: {
     logged_in: LoginReducer,
     logged_in_user: LoggedInUserReducer,
@@ -12,3 +12,10 @@ export default configureStore({
     session_transactions: TransactionsThisSessionReducer,
   },
 });
+
+export default store;
+
+// Infer the `RootState` and `AppDispatch` types from the store itself
+export type RootState = ReturnType<typeof store.getState>;
+// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
+export type AppDispatch = typeof store.dispatch;

src/Routes/DailyView/DailyView.tsx

@@ -8,7 +8,7 @@ import {
   GetLowestStockedProduct,
   GetProducts,
 } from "../../Components/Api/Api";
-import { OldSessionState, Product } from "../../Interfaces/Interfaces";
+import { Product } from "../../Interfaces/Interfaces";
 import { useSelector } from "react-redux";
 import TodayIcon from "../../Components/Icons/TodayIcon/TodayIcon";
 import moment from "moment";
@@ -16,13 +16,13 @@ import GetToday from "../../Components/GetToday/GetToday";
 import Moment from "react-moment";
 import { useNavigate } from "react-router-dom";
 import {
-  Button,
   TableBody,
   TableCell,
   TableContainer,
   TableHead,
   TableRow,
 } from "@mui/material";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function DailyView() {
   const logs = useQuery("logs", GetLogs, { retry: 0 });
@@ -35,7 +35,7 @@ export default function DailyView() {
     }
   );
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   const navigate = useNavigate();
   if (

src/Routes/Dashboard/Dashboard.tsx

@@ -1,13 +1,7 @@
-import React, { useState } from "react";
+import React from "react";
-import TotalProductsIcon from "../../Components/Icons/TotalProductsIcon/TotalProductsIcon";
-import LowStockIcon from "../../Components/Icons/LowStockIcon/LowStockIcon";
-import StatsIcon from "../../Components/Icons/StatsIcon/StatsIcon";
-import LogsIcon from "../../Components/Icons/LogsIcon/LogsIcon";
 import "../../index.css";
 import styles from "../../styles";
 import HomeIcon from "../../Components/Icons/HomeIcon/HomeIcon";
-import ColoredCube from "../../Components/ColoredCube/ColoredCube";
-import RecentlyAddedIcon from "../../Components/Icons/RecentlyAddedIcon/RecentlyAddedIcon";
 import LoginChecker from "../../Components/LoginChecker/LoginChecker";
 import { useQuery } from "react-query";
 import {
@@ -15,17 +9,13 @@ import {
   GetLowestStockedProduct,
   GetProducts,
 } from "../../Components/Api/Api";
-import {
-  OldSessionState,
-  ProductLog,
-  SessionTransactions,
-} from "../../Interfaces/Interfaces";
 import { useSelector } from "react-redux";
 import LowestStockWidget from "../../Components/DashboardPage/LowestStockWidget/LowestStockWidget";
 import RecentlyAddedWidget from "../../Components/DashboardPage/RecentlyAddedWidget/RecentlyAddedWidget";
 import TotalProductsWidget from "../../Components/DashboardPage/TotalProductsWidget/TotalProductsWidget";
 import SessionStatsWidget from "../../Components/DashboardPage/SessionStatsWidget/SessionStatsWidget";
 import RecentTransactionsWidget from "../../Components/DashboardPage/RecentTransactionsWidget/RecentTransactionsWidget";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function Dashboard() {
   const logs = useQuery("logs", GetLogs, { retry: 0 });
@@ -38,7 +28,7 @@ export default function Dashboard() {
     }
   );
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   if (
     logs.isLoading ||

src/Routes/Logs/Logs.tsx

@@ -10,23 +10,19 @@ import {
   TableHead,
   TableRow,
 } from "@mui/material";
-import { SampleLogData } from "../../Components/SampleData/SampleData";
 import LoginChecker from "../../Components/LoginChecker/LoginChecker";
 import { useQuery } from "react-query";
-import { GetLogs, UserInfo } from "../../Components/Api/Api";
+import { GetLogs } from "../../Components/Api/Api";
-import {
+import { ProductLog } from "../../Interfaces/Interfaces";
-  OldSessionState,
-  ProductLog,
-  ProductLogEntry,
-} from "../../Interfaces/Interfaces";
 import { useState } from "react";
 import { useSelector } from "react-redux";
 import GetToday from "../../Components/LogsPage/GetToday/GetToday";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function Logs() {
   const logs = useQuery("logs", GetLogs, { retry: 0 });
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   const [searchTerm, setSearchTerm] = useState("");
   const [searchToday, setSearchToday] = useState("");

src/Routes/Product/Product.tsx

@@ -14,11 +14,9 @@ import { DeleteProduct, GetProduct } from "../../Components/Api/Api";
 import { useMutation, useQuery, useQueryClient } from "react-query";
 import ProductIcon from "../../Components/Icons/ProductIcon/ProductIcon";
 import { useSelector } from "react-redux";
-import {
+import { ProductHistoryEntry } from "../../Interfaces/Interfaces";
-  OldSessionState,
-  ProductHistoryEntry,
-} from "../../Interfaces/Interfaces";
 import moment from "moment";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function Product() {
   const navigate = useNavigate();
@@ -41,7 +39,7 @@ export default function Product() {
     },
   });
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   if (isLoading || !old_session_checked) {
     return (

src/Routes/Products/Products.tsx

@@ -1,16 +1,15 @@
-import React, { useState } from "react";
+import React from "react";
 import styles from "../../styles";
 import { useNavigate } from "react-router-dom";
 import ProductsIcon from "../../Components/Icons/ProductsIcon/ProductsIcon";
 import AddIcon from "../../Components/Icons/AddIcon/AddIcon";
 import { Button } from "@mui/material";
-import { SampleProducts } from "../../Components/SampleData/SampleData";
 import ViewManager from "../../Components/ProductsPage/ViewManager";
 import { useQuery } from "react-query";
 import { GetProducts } from "../../Components/Api/Api";
 import LoginChecker from "../../Components/LoginChecker/LoginChecker";
 import { useSelector } from "react-redux";
-import { OldSessionState } from "../../Interfaces/Interfaces";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function Products() {
   const navigate = useNavigate();
@@ -20,7 +19,7 @@ export default function Products() {
     error,
   } = useQuery("products", GetProducts, { retry: 0 });
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   if (isLoading || !old_session_checked) {
     return (

src/routes/Inventory/Inventory.tsx

@@ -4,22 +4,19 @@ import InventoryIcon from "../../Components/Icons/InventoryIcon/InventoryIcon";
 import {
   Button,
   Table,
-  TableBody,
   TableCell,
   TableContainer,
   TableHead,
   TableRow,
 } from "@mui/material";
-import { SampleInventoryData } from "../../Components/SampleData/SampleData";
-import StockRenderer from "../../Components/InventoryPage/StockRenderer/StockRenderer";
 import LoginChecker from "../../Components/LoginChecker/LoginChecker";
-import { GetProducts, UpdateProduct } from "../../Components/Api/Api";
+import { GetProducts } from "../../Components/Api/Api";
-import { useMutation, useQuery, useQueryClient } from "react-query";
+import { useQuery } from "react-query";
 import RowRenderer from "../../Components/InventoryPage/RowRenderer/RowRenderer";
 import AddIcon from "../../Components/Icons/AddIcon/AddIcon";
 import { useNavigate } from "react-router-dom";
 import { useSelector } from "react-redux";
-import { OldSessionState } from "../../Interfaces/Interfaces";
+import { RootState } from "../../Plugins/Redux/Store/Store";
 
 export default function Inventory() {
   const {
@@ -29,7 +26,7 @@ export default function Inventory() {
   } = useQuery("products", GetProducts, { retry: 0 });
   const navigate = useNavigate();
   const old_session_checked = useSelector(
-    (state: OldSessionState) => state.old_session_checked.value
+    (state: RootState) => state.old_session_checked.value
   );
   if (isLoading || !old_session_checked) {
     return (