diff --git a/src/Components/InventoryPage/StockRenderer/StockRenderer.tsx b/src/Components/InventoryPage/StockRenderer/StockRenderer.tsx index 8e79b18..af64fa6 100644 --- a/src/Components/InventoryPage/StockRenderer/StockRenderer.tsx +++ b/src/Components/InventoryPage/StockRenderer/StockRenderer.tsx @@ -5,10 +5,16 @@ import IsNumber from "../IsNumber/IsNumber"; import { UpdateProduct } from "../../Api/Api"; import { useQueryClient, useMutation } from "react-query"; import { Product } from "../../../Interfaces/Interfaces"; +import { useDispatch } from "react-redux"; +import { + this_session_increment_removed, + this_session_increment_added, +} from "../../../Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice"; export default function StockRenderer(product: Product) { const [stock, setStock] = useState(product.quantity); const [valueChanged, setValueChanged] = useState(false); + const dispatch = useDispatch(); const queryClient = useQueryClient(); const mutation = useMutation({ mutationFn: UpdateProduct, @@ -23,6 +29,15 @@ export default function StockRenderer(product: Product) { name: product.name, quantity: stock, }); + if (stock > product.quantity) { + dispatch( + this_session_increment_added(Math.abs(stock - product.quantity)) + ); + } else { + dispatch( + this_session_increment_removed(Math.abs(stock - product.quantity)) + ); + } setValueChanged(false); } useEffect(() => { diff --git a/src/Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice.tsx b/src/Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice.tsx new file mode 100644 index 0000000..df6f458 --- /dev/null +++ b/src/Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice.tsx @@ -0,0 +1,22 @@ +import { createSlice } from "@reduxjs/toolkit"; + +export const TransactionsThisSessionSlice = createSlice({ + name: "Transactions", + initialState: { + added: 0, + removed: 0, + }, + reducers: { + this_session_increment_added: (state, action) => { + state.added = action.payload; + }, + this_session_increment_removed: (state, action) => { + state.removed = action.payload; + }, + }, +}); + +export const { this_session_increment_added, this_session_increment_removed } = + TransactionsThisSessionSlice.actions; + +export default TransactionsThisSessionSlice.reducer; diff --git a/src/Interfaces/Interfaces.tsx b/src/Interfaces/Interfaces.tsx index dad1478..fa27e80 100644 --- a/src/Interfaces/Interfaces.tsx +++ b/src/Interfaces/Interfaces.tsx @@ -43,6 +43,13 @@ export interface LoggedInUserState { }; } +export interface SessionTransactions { + session_transactions: { + added: number; + removed: number; + }; +} + // Component Props Interfaces export interface IconProps { diff --git a/src/Plugins/Redux/Store/Store.tsx b/src/Plugins/Redux/Store/Store.tsx index a7e36b1..1a1fdf9 100644 --- a/src/Plugins/Redux/Store/Store.tsx +++ b/src/Plugins/Redux/Store/Store.tsx @@ -2,11 +2,13 @@ import { configureStore } from "@reduxjs/toolkit"; import LoginReducer from "../../../Features/Redux/Slices/Login/LoginSlice"; import LoggedInUserReducer from "../../../Features/Redux/Slices/LoggedInUserSlice/LoggedInUserSlice"; import OldSessionReducer from "../../../Features/Redux/Slices/OldSession/OldSessionSlice"; +import TransactionsThisSessionReducer from "../../../Features/Redux/Slices/TransactionsThisSessionSlice/TransactionsThisSessionSlice"; export default configureStore({ reducer: { logged_in: LoginReducer, logged_in_user: LoggedInUserReducer, old_session_checked: OldSessionReducer, + session_transactions: TransactionsThisSessionReducer, }, }); diff --git a/src/Routes/Dashboard/Dashboard.tsx b/src/Routes/Dashboard/Dashboard.tsx index 12e7f3a..f52b29f 100644 --- a/src/Routes/Dashboard/Dashboard.tsx +++ b/src/Routes/Dashboard/Dashboard.tsx @@ -15,7 +15,8 @@ import { GetLowestStockedProduct, GetProducts, } from "../../Components/Api/Api"; -import { ProductLog } from "../../Interfaces/Interfaces"; +import { ProductLog, SessionTransactions } from "../../Interfaces/Interfaces"; +import { useSelector } from "react-redux"; export default function Dashboard() { const logs = useQuery("logs", GetLogs, { retry: 0 }); @@ -27,6 +28,12 @@ export default function Dashboard() { retry: 0, } ); + const session_added = useSelector( + (state: SessionTransactions) => state.session_transactions.added + ); + const session_removed = useSelector( + (state: SessionTransactions) => state.session_transactions.removed + ); if (logs.isLoading || products.isLoading || lowest_stock_product.isLoading) { return (
254
++ {session_added} +
Removed
118
++ {session_removed} +