From 80bedb9f631894022139d7546609cdaa2103e2a6 Mon Sep 17 00:00:00 2001
From: adamsoffer <adam@livepeer.org>
Date: Wed, 7 Jun 2023 18:47:50 -0400
Subject: [PATCH] Fix line graph when less than 60 days of data

---
 components/LineGraph/index.tsx     |  2 +-
 components/Listing/index.tsx       |  2 +-
 components/RevenueChange/index.tsx | 31 ++++++++++++++++--------------
 components/Ticker/index.tsx        |  2 +-
 4 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/components/LineGraph/index.tsx b/components/LineGraph/index.tsx
index 102eb19..7d4679a 100644
--- a/components/LineGraph/index.tsx
+++ b/components/LineGraph/index.tsx
@@ -83,7 +83,7 @@ const LineGraph = ({ color, days, dimensions }: props) => {
       const formattedData = days.map((day) => {
         return {
           time: new Date(day.date * 1000).toLocaleDateString("fr-CA"),
-          value: day.revenue,
+          value: days.length < 60 ? 0 : day.revenue,
         };
       });
       lineSeries.setData(formattedData);
diff --git a/components/Listing/index.tsx b/components/Listing/index.tsx
index 6fa0351..98fcfd7 100644
--- a/components/Listing/index.tsx
+++ b/components/Listing/index.tsx
@@ -160,7 +160,7 @@ const Listing = ({ data, ...props }) => {
                   : "revenue";
               if (row.values.untracked) return "--";
               const color =
-                row.values.usage[paymentType].thirtyDayPercentChange > 0
+                row.values.usage[paymentType].thirtyDayPercentChange >= 0
                   ? defaultTheme.colors.green
                   : defaultTheme.colors.red;
 
diff --git a/components/RevenueChange/index.tsx b/components/RevenueChange/index.tsx
index 67e39c6..0118192 100644
--- a/components/RevenueChange/index.tsx
+++ b/components/RevenueChange/index.tsx
@@ -3,25 +3,28 @@ import { defaultTheme } from "../../stitches.config";
 
 const RevenueChange = ({ percentChange, css = {}, ...props }) => {
   const color =
-    parseFloat(percentChange) > 0
+    parseFloat(percentChange) >= 0
       ? defaultTheme.colors.green
       : defaultTheme.colors.red;
 
+  console.log(percentChange);
   return (
     <Box css={{ display: "flex", alignItems: "center", ...css }} {...props}>
-      <Box
-        css={{
-          fontSize: "$1",
-          width: "0",
-          height: "0",
-          borderStyle: "solid",
-          borderWidth: "0 4px 6px 4px",
-          borderColor: `transparent transparent ${color} transparent`,
-          mr: "$1",
-          transform:
-            parseFloat(percentChange) > 0 ? "rotate(0)" : "rotate(180deg)",
-        }}
-      />
+      {parseFloat(percentChange) !== 0 && (
+        <Box
+          css={{
+            fontSize: "$1",
+            width: "0",
+            height: "0",
+            borderStyle: "solid",
+            borderWidth: "0 4px 6px 4px",
+            borderColor: `transparent transparent ${color} transparent`,
+            mr: "$1",
+            transform:
+              parseFloat(percentChange) > 0 ? "rotate(0)" : "rotate(180deg)",
+          }}
+        />
+      )}
       <Box css={{ color }}>{percentChange}%</Box>
     </Box>
   );
diff --git a/components/Ticker/index.tsx b/components/Ticker/index.tsx
index 5073c96..f33c97e 100644
--- a/components/Ticker/index.tsx
+++ b/components/Ticker/index.tsx
@@ -13,7 +13,7 @@ const Project = ({ project }) => {
       : "revenue";
 
   const color =
-    project.usage[paymentType].thirtyDayPercentChange > 0
+    project.usage[paymentType].thirtyDayPercentChange >= 0
       ? defaultTheme.colors.green
       : defaultTheme.colors.red;