feat(pages/resources): add pectra countdown and blobscan api #15324

TylerAPfledderer · 2025-04-21T00:17:49Z

Description

In the resource page section "Scaling Ethereum" add the date for the Pectra upgrade, and show total blobs and average blob fee.

Related Issue

Closes #15219

netlify · 2025-04-21T00:18:36Z

✅ Deploy Preview for ethereumorg ready!

Name	Link
🔨 Latest commit	`bf9423a`
🔍 Latest deploy log	https://app.netlify.com/projects/ethereumorg/deploys/683074749fef010008ffbe83
😎 Deploy Preview	https://deploy-preview-15324--ethereumorg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	7 paths audited Performance: 46 (🔴 down 9 from production) Accessibility: 94 (no change from production) Best Practices: 91 (🔴 down 8 from production) SEO: 98 (🔴 down 2 from production) PWA: 59 (🟢 up 1 from production) View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

TylerAPfledderer

Comments for @pettinarip and @wackerow here. The formatted values of the two numbers don't seem right to me. 😅 I had to remove the "billion" abbreviation from the formatted "Average blob fee".

TylerAPfledderer · 2025-04-28T03:41:24Z

src/components/Resources/useResources.tsx

+  const ethPrice = useEthPrice()
+  const avgBlobFeeUsd = formatSmallUSD(
+    // Converting value from gwei to USD
+    avgBlobFee * 1e-9 * ethPrice,
+    localeForNumberFormat
+  ).replace(/[A-Za-z]$/, "")
+


I double-checked in a converter, and this value should be correct, returning $2.4 here.

Hey @TylerAPfledderer I think that the problem is that avgBlobFee is in wei, not gwei. That is why we get it in billions. So, if we do

Suggested change

const ethPrice = useEthPrice()

const avgBlobFeeUsd = formatSmallUSD(

// Converting value from gwei to USD

avgBlobFee * 1e-9 * ethPrice,

localeForNumberFormat

).replace(/[A-Za-z]$/, "")

const ethPrice = useEthPrice()

const avgBlobFeeUsd = formatSmallUSD(

// Converting value from wei to USD

avgBlobFee * 1e-18 * ethPrice,

localeForNumberFormat

)

we shouldn't need to replace anything.

@pettinarip ah, that did it! Pushed the change 😄

TylerAPfledderer · 2025-04-28T03:43:59Z

src/components/Resources/useResources.tsx

+          <div className="text-sm">Next upgrade</div>
+          <div className="text-5xl font-bold">Pectra</div>
+          {/* TODO: Convert date to a countdown */}
+          <div className="text-xl font-bold text-body-medium">07 May 2025</div>


Any suggestions on which way to go here? Kinda already doing an approach in useResources for "Time to next block". Use that approach for this?

There is also something more robust like the react-countdown component if this is to used again for something else.

nloureiro · 2025-05-05T14:24:15Z

@TylerAPfledderer, did you manage to see why the page doesn't load?

https://deploy-preview-15324--ethereumorg.netlify.app/en/resources/

TylerAPfledderer · 2025-05-05T14:38:21Z

@TylerAPfledderer, did you manage to see why the page doesn't load?

https://deploy-preview-15324--ethereumorg.netlify.app/en/resources/

@nloureiro

I'm not able to check this. Everything works fine in local dev, and when attempting to build locally, I have issues getting the build to complete successfully for unrelated reasons.

I can try that again today

nloureiro · 2025-05-05T14:49:59Z

@TylerAPfledderer, did you manage to see why the page doesn't load?
https://deploy-preview-15324--ethereumorg.netlify.app/en/resources/

@nloureiro

I'm not able to check this. Everything works fine in local dev, and when attempting to build locally, I have issues getting the build to complete successfully for unrelated reasons.

I can try that again today

nice, thank you!

…a-countdown

TylerAPfledderer · 2025-05-07T20:31:21Z

@nloureiro apologies for the delay. I am still not able to recreate the problem locally. When I attempt to run the build locally, I still get unrelated errors that prevent the build from completing.

@pettinarip @wackerow any input here with the resource not working through the deploy link?

pettinarip · 2025-05-08T08:05:14Z

@nloureiro apologies for the delay. I am still not able to recreate the problem locally. When I attempt to run the build locally, I still get unrelated errors that prevent the build from completing.

@pettinarip @wackerow any input here with the resource not working through the deploy link?

@TylerAPfledderer sorry about this. Here is the error log

The problem is coming from the dataloader layer. In preview deploy envs, we are using mocked data by default, and the loader is failing to load that mocked data because it doesn't exist. You can find these files in https://github.com/ethereum/ethereum-org-website/tree/dev/src/data/mocks

I'll add a new json file to provide the response for the new query we're making in this PR. That should resolve the issue.

pettinarip · 2025-05-08T08:10:27Z

src/data/mocks/blobscanOverallStats.json

added this file. If you run with USE_MOCK_DATA=true this will be used

TylerAPfledderer · 2025-05-08T23:26:19Z

src/components/Resources/useResources.tsx

-    notation: "compact",
-    minimumSignificantDigits: 2,
-    maximumSignificantDigits: 2,


Simplify the price formatting for formatSmallUSD(), so that two decimal places are always shown, no matter the number of significant figures. (i.e. $xx.xx versus $x.xx)

TylerAPfledderer · 2025-05-09T00:27:35Z

@pettinarip @nloureiro should be all set here.

Since the Pectra Upgrade should already be live at this point (May 7th 2025) then the "Live" tag is rendered, but I still set up the countdown for any future upgrade that might be added here.

…a-countdown

nloureiro · 2025-05-15T11:12:21Z

src/components/Resources/useResources.tsx

-      // TODO: Add metric
+      metric: (
+        <div className="grid place-items-center py-5">
+          <div className="text-sm">Next upgrade</div>


@TylerAPfledderer from my end we just need to change this details to "Latest upgrade" because it's live now

…a-countdown

github-actions · 2025-06-23T08:08:12Z

This issue is stale because it has been open 30 days with no activity.

wackerow

Thanks a lot @TylerAPfledderer! Sorry for delays here, pulling in

wackerow · 2025-09-18T01:26:27Z

Ah spoke too soon, forgot this got refactored to server-side without hooks. Will need to refactor this a bit

feat(pages/resources): get blobscan api data

8e35750

github-actions bot added the tooling 🔧 Changes related to tooling of the project label Apr 21, 2025

TylerAPfledderer added 2 commits April 22, 2025 10:32

feat(pages/resources): add pectra schedule

25597af

refactor(page/resources): show average blob fee in usd

b9158d7

TylerAPfledderer marked this pull request as ready for review April 28, 2025 03:39

TylerAPfledderer requested review from wackerow, corwintines, pettinarip and minimalsm as code owners April 28, 2025 03:39

TylerAPfledderer commented Apr 28, 2025

View reviewed changes

fix(useResources): to avg blob fee conversion from wei

a504bc1

Merge remote-tracking branch 'upstream/dev' into feat/dashboard-pectr…

55a27de

…a-countdown

add mock data for blobscanOverallStats

d31aa0e

pettinarip reviewed May 8, 2025

View reviewed changes

src/data/mocks/blobscanOverallStats.json

Copy link

Member

pettinarip May 8, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added this file. If you run with USE_MOCK_DATA=true this will be used

refactor(useResources): simplify formatSmallUSD

040d7bb

TylerAPfledderer commented May 8, 2025

View reviewed changes

TylerAPfledderer added 2 commits May 8, 2025 20:19

refactor(useResources): add countdown for scaling upgrade

eba75bf

refactor(useResources): set link for Pectra page

9771acf

Merge remote-tracking branch 'upstream/dev' into feat/dashboard-pectr…

472b762

…a-countdown

nloureiro approved these changes May 20, 2025

View reviewed changes

TylerAPfledderer added 2 commits May 23, 2025 09:11

Merge remote-tracking branch 'upstream/dev' into feat/dashboard-pectr…

15408bb

…a-countdown

refactor(useResources): update label for latest scaling upgrade

bf9423a

github-actions bot added the Status: Stale This issue is stale because it has been open 30 days with no activity. label Jun 23, 2025

wackerow approved these changes Sep 18, 2025

View reviewed changes

github-actions bot removed the Status: Stale This issue is stale because it has been open 30 days with no activity. label Sep 18, 2025

feat(pages/resources): add pectra countdown and blobscan api #15324

Are you sure you want to change the base?

feat(pages/resources): add pectra countdown and blobscan api #15324

Uh oh!

Conversation

TylerAPfledderer commented Apr 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Related Issue

Uh oh!

netlify bot commented Apr 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for ethereumorg ready!

Uh oh!

TylerAPfledderer left a comment

Choose a reason for hiding this comment

Uh oh!

TylerAPfledderer Apr 28, 2025

Choose a reason for hiding this comment

Uh oh!

pettinarip Apr 28, 2025

Choose a reason for hiding this comment

Uh oh!

TylerAPfledderer Apr 28, 2025

Choose a reason for hiding this comment

Uh oh!

TylerAPfledderer Apr 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

nloureiro commented May 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TylerAPfledderer commented May 5, 2025

Uh oh!

nloureiro commented May 5, 2025

Uh oh!

TylerAPfledderer commented May 7, 2025

Uh oh!

pettinarip commented May 8, 2025

Uh oh!

pettinarip May 8, 2025

Choose a reason for hiding this comment

Uh oh!

TylerAPfledderer May 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

TylerAPfledderer commented May 9, 2025

Uh oh!

nloureiro May 15, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Jun 23, 2025

Uh oh!

wackerow left a comment

Choose a reason for hiding this comment

Uh oh!

wackerow commented Sep 18, 2025

Uh oh!

Uh oh!

TylerAPfledderer commented Apr 21, 2025 •

edited

Loading

netlify bot commented Apr 21, 2025 •

edited

Loading

TylerAPfledderer Apr 28, 2025 •

edited

Loading

nloureiro commented May 5, 2025 •

edited

Loading

TylerAPfledderer May 8, 2025 •

edited

Loading