From 0f2a315473b1c32ad01bf57de8886daab6af67bd Mon Sep 17 00:00:00 2001
From: Victor <victor@sentryhealth.ca>
Date: Sat, 28 Oct 2023 00:54:32 -0400
Subject: [PATCH] added avgFilled, updated tables

---
 src/app/components/DisplayTable.tsx | 22 ++++++++++++++++++----
 src/app/utils.ts                    | 11 +++++++++++
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/src/app/components/DisplayTable.tsx b/src/app/components/DisplayTable.tsx
index 693a1816..a549727c 100644
--- a/src/app/components/DisplayTable.tsx
+++ b/src/app/components/DisplayTable.tsx
@@ -1,6 +1,11 @@
 import React, { useMemo } from "react";
 import { useAppSelector, useAppDispatch } from "../hooks";
-import { displayTime, displayOrderSide, calculateTotalFees } from "../utils";
+import {
+  displayTime,
+  displayOrderSide,
+  calculateTotalFees,
+  calculateAvgFilled,
+} from "../utils";
 import {
   cancelOrder,
   selectOpenOrders,
@@ -82,6 +87,7 @@ export function DisplayTable() {
   const openOrders = useAppSelector(selectOpenOrders);
   const orderHistory = useAppSelector(selectOrderHistory);
   const tradeHistory = useAppSelector(selectTradeHistory);
+  console.log(orderHistory);
 
   const tableToShow = useMemo(() => {
     switch (selectedTable) {
@@ -142,7 +148,9 @@ const OpenOrdersRows = ({ data }: TableProps) => {
         <td>
           {order.amount} {order.specifiedToken.symbol}
         </td>
-        <td>PlaceHolder {order.specifiedToken.symbol}</td>
+        <td>
+          {order.price} {order.specifiedToken.symbol}
+        </td>
         <td>
           {order.amountFilled} {order.specifiedToken.symbol}
         </td>
@@ -175,10 +183,13 @@ const OrderHistoryRows = ({ data }: TableProps) => {
         <td>
           {order.amount} {order.specifiedToken.symbol}
         </td>
+        <td>
+          {calculateAvgFilled(order.token1Filled, order.token2Filled)}{" "}
+          {order.specifiedToken.symbol}
+        </td>
         <td>
           {order.price} {order.specifiedToken.symbol}
         </td>
-        <td>PlaceHolder {order.specifiedToken.symbol}</td>
         <td>
           {calculateTotalFees(order)} {order.unclaimedToken.symbol}
         </td>
@@ -203,10 +214,13 @@ const TradeHistoryTable = ({ data }: TableProps) => {
         <td className={displayOrderSide(order.side).className}>
           {displayOrderSide(order.side).text}
         </td>
-        <td>PlaceHolder {order.specifiedToken.symbol}</td>
         <td>
           {order.price} {order.specifiedToken.symbol}
         </td>
+        <td>
+          {calculateAvgFilled(order.token1Filled, order.token2Filled)}{" "}
+          {order.specifiedToken.symbol}
+        </td>
         <td>
           {order.amountFilled} {order.specifiedToken.symbol}
         </td>
diff --git a/src/app/utils.ts b/src/app/utils.ts
index 5b9b273a..dd84534d 100644
--- a/src/app/utils.ts
+++ b/src/app/utils.ts
@@ -313,6 +313,17 @@ export function calculateTotalFees(order: any): number {
     : totalFees;
 }
 
+//Calculate the Avg Filled from recieved token amounts
+export function calculateAvgFilled(tokenOne: number, tokenTwo: number): number {
+  console.log(tokenOne, tokenTwo);
+  if (tokenOne == 0 || tokenTwo == 0) return 0;
+  const avgFilled = tokenTwo / tokenOne;
+  const decimalPart = (avgFilled % 1).toString().split(".")[1];
+  return decimalPart && decimalPart.length > 8
+    ? roundTo(avgFilled, 8, RoundType.NEAREST)
+    : avgFilled;
+}
+
 //Chart Helper Functions
 export const formatPercentageChange = (percChange: number | null): string => {
   if (percChange !== null) {