From 6ee6edb7ee3ce51cabd77d2dd3403d09024b311b Mon Sep 17 00:00:00 2001
From: pthmas <9058370+pthmas@users.noreply.github.com>
Date: Tue, 31 Mar 2026 16:44:23 +0200
Subject: [PATCH] Fix empty gas price chart buckets

---
 .../atlas-server/src/api/handlers/stats.rs     |  4 ++--
 frontend/src/api/chartData.ts                  |  2 +-
 frontend/src/hooks/useChartData.ts             | 18 +++++++++++++++++-
 frontend/src/pages/StatusPage.tsx              |  8 ++++++--
 4 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/backend/crates/atlas-server/src/api/handlers/stats.rs b/backend/crates/atlas-server/src/api/handlers/stats.rs
index 5947df5..6218c3c 100644
--- a/backend/crates/atlas-server/src/api/handlers/stats.rs
+++ b/backend/crates/atlas-server/src/api/handlers/stats.rs
@@ -77,7 +77,7 @@ pub struct DailyTxPoint {
 #[derive(Serialize)]
 pub struct GasPricePoint {
     pub bucket: String,
-    pub avg_gas_price: f64,
+    pub avg_gas_price: Option<f64>,
 }
 
 /// GET /api/stats/blocks-chart?window=1h|6h|24h|7d
@@ -221,7 +221,7 @@ pub async fn get_gas_price_chart(
         .into_iter()
         .map(|(bucket, avg_gas_price)| GasPricePoint {
             bucket: bucket.to_rfc3339(),
-            avg_gas_price: avg_gas_price.unwrap_or(0.0),
+            avg_gas_price,
         })
         .collect();
 
diff --git a/frontend/src/api/chartData.ts b/frontend/src/api/chartData.ts
index 724d5b3..4c7ac73 100644
--- a/frontend/src/api/chartData.ts
+++ b/frontend/src/api/chartData.ts
@@ -15,7 +15,7 @@ export interface DailyTxPoint {
 
 export interface GasPricePoint {
   bucket: string; // ISO timestamp
-  avg_gas_price: number; // wei
+  avg_gas_price: number | null; // wei
 }
 
 export function getBlocksChart(window: ChartWindow): Promise<BlockChartPoint[]> {
diff --git a/frontend/src/hooks/useChartData.ts b/frontend/src/hooks/useChartData.ts
index c00f0c1..2dee5a5 100644
--- a/frontend/src/hooks/useChartData.ts
+++ b/frontend/src/hooks/useChartData.ts
@@ -21,6 +21,22 @@ interface ChartData {
   gasPriceError: string | null;
 }
 
+function fillMissingGasPriceBuckets(points: GasPricePoint[]): GasPricePoint[] {
+  let lastObservedPrice: number | null = null;
+
+  return points.map((point) => {
+    if (point.avg_gas_price !== null) {
+      lastObservedPrice = point.avg_gas_price;
+      return point;
+    }
+
+    return {
+      ...point,
+      avg_gas_price: lastObservedPrice,
+    };
+  });
+}
+
 function getChartErrorMessage(err: unknown, fallback: string): string {
   if (err && typeof err === 'object' && 'error' in err && typeof (err as { error: unknown }).error === 'string') {
     return (err as { error: string }).error;
@@ -124,7 +140,7 @@ export function useChartData(window: ChartWindow): ChartData {
       try {
         setGasPriceError(null);
         const gasPrice = await getGasPriceChart(window);
-        if (mounted) setGasPriceChart(gasPrice);
+        if (mounted) setGasPriceChart(fillMissingGasPriceBuckets(gasPrice));
       } catch (err) {
         if (mounted) {
           setGasPriceError(getChartErrorMessage(err, 'Failed to load gas price chart'));
diff --git a/frontend/src/pages/StatusPage.tsx b/frontend/src/pages/StatusPage.tsx
index 7b6009e..8d39b47 100644
--- a/frontend/src/pages/StatusPage.tsx
+++ b/frontend/src/pages/StatusPage.tsx
@@ -235,7 +235,7 @@ export default function StatusPage() {
                       contentStyle={{ background: CHART_TOOLTIP_BG, border: `1px solid ${CHART_GRID}`, borderRadius: 8 }}
                       labelStyle={{ color: CHART_AXIS_TEXT }}
                       itemStyle={{ color: '#f8fafc' }}
-                      formatter={(v: unknown) => [formatGwei(v as number), 'Avg Gas Price']}
+                      formatter={(v: unknown) => [formatGwei(v as number | null), 'Avg Gas Price']}
                       labelFormatter={(v) => formatBucketTooltip(v, window)}
                     />
                     <Line
@@ -329,7 +329,11 @@ function formatCompact(n: number): string {
   return String(n);
 }
 
-function formatGwei(wei: number): string {
+function formatGwei(wei: number | null | undefined): string {
+  if (wei === null || wei === undefined || Number.isNaN(wei)) {
+    return '—';
+  }
+
   const gwei = wei / 1e9;
   if (gwei >= 1_000) return `${(gwei / 1_000).toFixed(1)}K gwei`;
   if (gwei >= 1) return `${gwei.toFixed(2)} gwei`;