From 46320cc5c1ad87d5044e34c9f4656a92799b1bb5 Mon Sep 17 00:00:00 2001
From: Matt Upham <30577966+mattupham@users.noreply.github.com>
Date: Tue, 27 Aug 2024 12:57:55 -0700
Subject: [PATCH] Update 0.00%

---
 packages/web/components/assets/price.tsx | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/packages/web/components/assets/price.tsx b/packages/web/components/assets/price.tsx
index 63b543c783..2c8f37fce6 100644
--- a/packages/web/components/assets/price.tsx
+++ b/packages/web/components/assets/price.tsx
@@ -1,4 +1,5 @@
 import { PricePretty, RatePretty } from "@keplr-wallet/unit";
+import { Dec } from "@keplr-wallet/unit";
 import { CommonPriceChartTimeFrame } from "@osmosis-labs/server";
 import classNames from "classnames";
 import { FunctionComponent, useMemo } from "react";
@@ -11,6 +12,9 @@ import { api } from "~/utils/trpc";
 import { Sparkline } from "../chart/sparkline";
 import { CustomClasses } from "../types";
 
+// 0.01%
+const THRESHOLD = 0.0001;
+
 /** Colored price change text with up/down arrow. */
 export const PriceChange: FunctionComponent<
   {
@@ -19,10 +23,14 @@ export const PriceChange: FunctionComponent<
     value?: PricePretty;
   } & CustomClasses
 > = ({ priceChange, overrideTextClasses = "body1", className, value }) => {
-  const isBullish = priceChange.toDec().isPositive();
-  const isBearish = priceChange.toDec().isNegative();
+  const isBullish = priceChange.toDec().gt(new Dec(THRESHOLD));
+  const isBearish = priceChange.toDec().lt(new Dec(-THRESHOLD));
   const isFlat = !isBullish && !isBearish;
 
+  console.log("----");
+  console.log("priceChange.toDec(): ", priceChange.toDec().toString());
+  console.log("priceChange", priceChange.toDec().toString());
+
   // remove negative symbol since we're using arrows
   if (isBearish) {
     priceChange = priceChange.mul(new RatePretty(-1));
@@ -30,10 +38,12 @@ export const PriceChange: FunctionComponent<
   }
 
   const priceChangeDisplay = priceChange
-    .maxDecimals(1)
+    .maxDecimals(2)
     .inequalitySymbol(false)
     .toString();
 
+  console.log("priceChangeDisplay: ", priceChangeDisplay);
+  console.log("----");
   const formattedPriceChangeDisplay =
     value !== undefined ? `(${priceChangeDisplay})` : priceChangeDisplay;
 
@@ -67,7 +77,7 @@ export const PriceChange: FunctionComponent<
       >
         {value !== undefined ? value.toString() + " " : null}
 
-        {isFlat ? "-" : formattedPriceChangeDisplay}
+        {isFlat ? "0.00%" : formattedPriceChangeDisplay}
       </div>
     </div>
   );