diff --git a/inventory-manager/src/components/page-content/segment3-table/segment/InventoryTable.tsx b/inventory-manager/src/components/page-content/segment3-table/segment/InventoryTable.tsx index 5de427e..2cdf6de 100644 --- a/inventory-manager/src/components/page-content/segment3-table/segment/InventoryTable.tsx +++ b/inventory-manager/src/components/page-content/segment3-table/segment/InventoryTable.tsx @@ -1,4 +1,4 @@ -import React, {type MouseEventHandler, useRef, useState} from 'react'; +import React, {useRef, useState} from 'react'; import {Button, Input, type InputRef, Modal, Popconfirm, Space, Table, type TableColumnType} from 'antd'; import type {TableColumnsType, TableProps} from 'antd'; import type {Product} from "../../../../types/Product"; @@ -10,7 +10,6 @@ import ProductForm from "../../segment2-new_product/ProductForm"; type DataIndex = keyof Product; const InventoryTable: React.FC = () => { - const [selectedRows, setSelectedRows] = useState([]); const [isModalVisible, setIsModalVisible] = useState(false); const [editingProduct, setEditingProduct] = useState(null); @@ -22,7 +21,9 @@ const InventoryTable: React.FC = () => { const searchInput = useRef(null); const {stockQuantity, name, category, page, setParams} = useSearchContext(); - const {products, loading} = useDataContext() + const {products, loading, refreshProducts} = useDataContext() + const timerRef = React.useRef(null); + const handleTableChange: TableProps['onChange'] = (_pagination, filters, sorter) => { setParams({page: ((page as number))}); @@ -222,53 +223,29 @@ const InventoryTable: React.FC = () => { ]; const rowSelection = { - onChange: (_: any, selectedRowsData: Product[]) => { - setSelectedRows(selectedRowsData); + onChange: async (_: any, selectedRowsData: Product[]) => { + await changeAvailabilityOfSelected(selectedRowsData); }, }; - const changeAvailabilityOfSelected = async () => { + const changeAvailabilityOfSelected = async (selectedRows: Product[]) => { for (const product of selectedRows) { if (product.stockQuantity as number > 0) { await markOutOfStock(product.id); + if (timerRef.current) window.clearTimeout(timerRef.current); + timerRef.current = window.setTimeout(async () => { + await refreshProducts(); + }, 200); } else { await markInStock(product.id); + if (timerRef.current) window.clearTimeout(timerRef.current); + timerRef.current = window.setTimeout(async () => { + await refreshProducts(); + }, 200); } } }; - - const onClickOutOfStock: MouseEventHandler = async () => { - try { - await changeAvailabilityOfSelected().then().finally(() => { - if (stockQuantity === 0) { - setParams( - { - name: undefined, - page: 0, - category: undefined, - stockQuantity: 3, - sort: undefined - }) - } else { - setParams( - { - name: undefined, - page: 0, - category: undefined, - stockQuantity: 0, - sort: undefined - }) - } - }); - } catch (e) { - console.log(e) - } finally { - setSelectedRows([]); - } - }; - - return <> rowSelection={rowSelection} columns={columns} @@ -279,18 +256,6 @@ const InventoryTable: React.FC = () => { pagination={false} style={{width: "100%",}} /> - {selectedRows.length > 0 && ( - <> - - - - )}