Add additional markers for time frame averages and ultrasound barrier

ultrasoundmoney · Feb 10, 2024 · 2ea048e · 2ea048e
1 parent beb080d
commit 2ea048e
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 6 deletions.
diff --git a/src/components/SliderMarkers.tsx b/src/components/SliderMarkers.tsx
@@ -7,6 +7,9 @@ import * as Format from "../format";
 
 export type SliderMarker = { label: string; value: number };
 
+// Minimum percentage difference between markers to avoid overlap
+const MIN_PERCENTAGE_DIFFERENCE = 5;
+
 export const SliderMarkers: FC<{
   markerList: SliderMarker[];
   min: number;
@@ -15,7 +18,7 @@ export const SliderMarkers: FC<{
   const range = max - min;
   const shownList = markerList.reduce((list: SliderMarker[], marker) => {
     const someConflict = list.some(
-      (shownMarker) => Math.abs(shownMarker.value - marker.value) < 0.0017,
+      (shownMarker) => Math.abs(shownMarker.value - marker.value) < ((max - min) * MIN_PERCENTAGE_DIFFERENCE / 100),
     );
 
     if (someConflict) {

diff --git a/src/mainsite/components/TwoYearProjection/index.tsx b/src/mainsite/components/TwoYearProjection/index.tsx
@@ -13,7 +13,7 @@ import styles from "./TwoYearProjection.module.scss";
 import type { ChangeEvent, FC, ReactNode } from "react";
 import { useCallback, useEffect, useState, useContext } from "react";
 import { useBaseFeeOverTime } from "../../api/base-fee-over-time";
-import { useBaseFeePerGas } from "../../api/base-fee-per-gas";
+import { useBaseFeePerGasStats } from "../../api/base-fee-per-gas-stats";
 import { useEffectiveBalanceSum } from "../../api/effective-balance-sum";
 import { TimeFrameText } from "../../../components/Texts";
 const SupplyChart = dynamic(() => import("./TwoYearProjectionChart"));
@@ -24,7 +24,7 @@ const MAX_PROJECTED_ETH_STAKING = 69696969;
 
 const MIN_PROJECTED_BASE_GAS_PRICE = 0;
 const DEFAULT_PROJECTED_BASE_GAS_PRICE = 60;
-const MAX_PROJECTED_BASE_GAS_PRICE = 420;
+const MAX_PROJECTED_BASE_GAS_PRICE = 200;
 
 const DEFAULT_PROJECTED_MERGE_DATE = new Date("2022-09-15T00:00:00Z");
 
@@ -71,6 +71,7 @@ const TwoYearProjection: FC = () => {
 
   const effectiveBalanceSum = useEffectiveBalanceSum();
   const baseFeesOverTime = useBaseFeeOverTime();
+  const baseFeesPerGasStats = useBaseFeePerGasStats();
   const [userHasAdjustedStakedEth, setUserHasAdjustedStakedEth] =
     useState(false);
   const [userHasAdjustedBaseFee, setUserHasAdjustedBaseFee] = useState(false);
@@ -98,15 +99,23 @@ const TwoYearProjection: FC = () => {
     console.log("baseFeesOverTime:", baseFeesOverTime);
     const latestBaseFee =
       baseFeesOverTime.m5[baseFeesOverTime.m5.length - 1]?.wei;
-    if (latestBaseFee === undefined) {
+    if (latestBaseFee === undefined || baseFeesPerGasStats === undefined) {
       return;
     }
+    console.log("barrier", baseFeesPerGasStats.barrier);
     if (!userHasAdjustedBaseFee) {
       setProjectedBaseGasPrice(latestBaseFee / 1e9);
     }
 
-    setBaseFeeSliderMarkers([{ label: "now", value: latestBaseFee / 1e9 }]);
-  }, [baseFeesOverTime, effectiveBalanceSum]);
+      setBaseFeeSliderMarkers([
+          { label: "now", value: latestBaseFee / 1e9 },
+          { label: "🦇🔊🚧", value: baseFeesPerGasStats.barrier},
+          { label: "all", value: baseFeesPerGasStats.base_fee_per_gas_stats.since_burn.average / 1e9 },
+          { label: "30d", value: baseFeesPerGasStats.base_fee_per_gas_stats.d30.average / 1e9 },
+          { label: "7d", value: baseFeesPerGasStats.base_fee_per_gas_stats.d7.average / 1e9 },
+          { label: "1d", value: baseFeesPerGasStats.base_fee_per_gas_stats.d1.average / 1e9 },
+      ]);
+  }, [baseFeesOverTime, baseFeesPerGasStats, effectiveBalanceSum]);
 
   return (
     <>