added avgFilled, updated tables

DeXter-on-Radix · Oct 28, 2023 · 0f2a315 · 0f2a315
1 parent b7ae98d
commit 0f2a315
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 4 deletions.
diff --git 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
@@ -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) {