fix: item history page now live updates

ordr-ui/app/components/ItemHistoryTable.tsx

@@ -1,9 +1,7 @@
 import { Mutex } from "async-mutex"
-import { useState } from "react"
 import styled from "styled-components"
 import useAsyncEffect from "use-async-effect"
-import { GetItemHistory } from "../client/controllers"
-import { ItemHistoryResponse } from "../client/response"
+import { useItemStore } from "../providers/ItemsProvider"
 
 type ItemHistoryTableProps = {
     itemId: number
@@ -39,17 +37,15 @@ const ItemHistoryTableRow = styled.tr`
 const itemHistoryMutex = new Mutex()
 
 export const ItemHistoryTable = ({itemId}: ItemHistoryTableProps) => {
-    const [itemPriceHistory, setItemPriceHistory] = useState<ItemHistoryResponse[]>([])
+    const itemStore = useItemStore((state) => state)
 
     useAsyncEffect(async () => {
-        if(itemPriceHistory.length === 0) {
+        if(itemStore.itemHistories.filter((ih) => parseInt(ih.ItemId) === itemId).length === 0) {
             const release = await itemHistoryMutex.acquire()
-            setItemPriceHistory(await GetItemHistory(itemId))
+            await itemStore.getItemHistory(itemId)
             await release()
         }
-    }, [])
-
-    console.log(itemPriceHistory)
+    }, [itemStore.itemHistories])
 
     return (
         <ItemHistoryTableStyle>
@@ -70,7 +66,7 @@ export const ItemHistoryTable = ({itemId}: ItemHistoryTableProps) => {
                 </tr>
             </ItemHistoryTableHead>
             <ItemHistoryTableBody>
-                {itemPriceHistory.map((iph) => (
+                {itemStore.itemHistories.filter((ih) => parseInt(ih.ItemId) === itemId).map((iph) => (
                     <ItemHistoryTableRow key = {iph.ItemId + new Date(iph.ValidFrom).getMilliseconds()}>
                         <ItemHistoryTableItem>
                             {iph.ItemName}