Fix block stats (#515)

* refactor: Update DailyAvgBlobGasPriceChart to round average gas prices

* chore: add changeset

* feat: Round average blob fees in DailyAvgBlobFeeChart

* Updates the convertWei function to handle decimal values

* feat: Add tests for shifting decimal string values in eth-units.test.ts

* chore: update changeset

.changeset/light-wombats-try.md

@@ -0,0 +1,5 @@
+---
+"@blobscan/web": patch
+---
+
+Updates the convertWei function to handle decimal values

apps/web/src/components/Charts/Block/DailyAvgBlobFeeChart.tsx

@@ -17,7 +17,7 @@ export type DailyAvgBlobFeeChartProps = {
 export const DailyAvgBlobFeeChart: FC<Partial<DailyAvgBlobFeeChartProps>> =
   function ({ days, avgBlobFees }) {
     const formattedAvgBlobFees = useMemo(
-      () => avgBlobFees?.map((fee) => convertWei(BigInt(fee))),
+      () => avgBlobFees?.map((fee) => convertWei(fee)),
       [avgBlobFees]
     );
 

apps/web/src/components/Charts/Block/DailyAvgBlobGasPriceChart.tsx

@@ -17,7 +17,7 @@ export const DailyAvgBlobGasPriceChart: FC<
   Partial<DailyAvgBlobGasPriceChartProps>
 > = function ({ days, avgBlobGasPrices }) {
   const formattedAvgBlobGasPrices = useMemo(
-    () => avgBlobGasPrices?.map((price) => convertWei(BigInt(price))),
+    () => avgBlobGasPrices?.map((price) => convertWei(price)),
     [avgBlobGasPrices]
   );
 

packages/eth-format/index.ts

@@ -15,7 +15,10 @@ const compactFormatter = Intl.NumberFormat("en-US", {
  * This function never converts the provided value to a Number
  * ensuring that the full precision of the input is preserved.
  */
-export function formatWei(wei: bigint, toUnit: EtherUnit = "Gwei"): string {
+export function formatWei(
+  wei: string | number | bigint,
+  toUnit: EtherUnit = "Gwei"
+): string {
   const converted = convertWei(wei, toUnit);
   const formatted = insertCommas(converted);
   return `${formatted} ${toUnit}`;
@@ -36,7 +39,10 @@ export function prettyFormatWei(wei: bigint, toUnit: EtherUnit = "Gwei") {
 /**
  * This function converts `wei` to the unit specified by `toUnit`.
  */
-export function convertWei(wei: bigint, toUnit: EtherUnit = "Gwei"): string {
+export function convertWei(
+  wei: string | number | bigint,
+  toUnit: EtherUnit = "Gwei"
+): string {
   return shiftDecimal(wei, ETH_UNITS[toUnit]);
 }
 
@@ -60,20 +66,25 @@ export function findBestUnit(wei: bigint): EtherUnit {
 /**
  * This function moves the decimal point to the left by `decimals` places.
  */
-export function shiftDecimal(value: bigint, decimals: number): string {
-  const negative = value < 0;
+export function shiftDecimal(
+  value: string | number | bigint,
+  decimals: number
+): string {
+  value = value.toString();
+
+  const negative = value.startsWith("-");
 
   if (negative) {
-    value = -value;
+    value = value.slice(1);
   }
 
-  const str = value.toString().padStart(decimals, "0");
+  let [integer = "", decimal = ""] = value.split(".");
 
-  const sign = negative ? "-" : "";
-  const integer = str.slice(0, str.length - decimals) || "0";
-  const decimal = str.slice(str.length - decimals);
+  const padded = integer.padStart(decimals, "0");
+  integer = padded.slice(0, padded.length - decimals) || "0";
+  decimal = padded.slice(padded.length - decimals) + decimal;
 
-  return removeExtraZeros(`${sign}${integer}.${decimal}`);
+  return removeExtraZeros(`${negative ? "-" : ""}${integer}.${decimal}`);
 }
 
 /**

packages/eth-format/test/eth-units.test.ts

@@ -331,3 +331,31 @@ test("can format negative ether", () => {
     "-1,234.567890123456789012 ether"
   );
 });
+
+test("can shift string values", () => {
+  expect(shiftDecimal("1", 0)).toBe("1");
+  expect(shiftDecimal("10", 1)).toBe("1");
+  expect(shiftDecimal("100", 2)).toBe("1");
+
+  expect(shiftDecimal("100", 3)).toBe("0.1");
+  expect(shiftDecimal("100", 4)).toBe("0.01");
+
+  expect(shiftDecimal("11", 1)).toBe("1.1");
+  expect(shiftDecimal("1000000000000000000", 18)).toBe("1");
+});
+
+test("can shift decimal string values", () => {
+  expect(shiftDecimal("1.1", 0)).toBe("1.1");
+  expect(shiftDecimal("1.1", 2)).toBe("0.011");
+
+  expect(shiftDecimal("123.123", 1)).toBe("12.3123");
+  expect(shiftDecimal("123.123", 2)).toBe("1.23123");
+});
+
+test("can shift negative decimal string values", () => {
+  expect(shiftDecimal("-1.1", 0)).toBe("-1.1");
+  expect(shiftDecimal("-1.1", 2)).toBe("-0.011");
+
+  expect(shiftDecimal("-123.123", 1)).toBe("-12.3123");
+  expect(shiftDecimal("-123.123", 2)).toBe("-1.23123");
+});