Skip to content

[explorer/frontend] fix: use runtime configuration on error pages - #2483

Open
cryptoBeliever wants to merge 1 commit into
devfrom
explorer/fix-runtime-config-on-error-pages
Open

[explorer/frontend] fix: use runtime configuration on error pages#2483
cryptoBeliever wants to merge 1 commit into
devfrom
explorer/fix-runtime-config-on-error-pages

Conversation

@cryptoBeliever

Copy link
Copy Markdown
Contributor

Fixes #2469

Problem

Using the header search bar on a 404 page sends requests to a malformed URL:

❌ https://nem.fyi/undefined/block/B411ECEB...
✅ https://nem.fyi/api/nem/block/B411ECEB...

The requests fail and the search bar silently returns no results.

Root cause

Next.js requires pages/404 and pages/500 to be statically prerendered - it explicitly rejects getServerSideProps and getInitialProps on them. Their HTML, including the window.appConfig script that _app inlines, is therefore generated once, during next build.

PUBLIC_* variables are runtime configuration: the Dockerfile only passes NEXT_PUBLIC_EXPLORER_VARIANT as a build arg. At build time process.env.PUBLIC_API_BASE_URL is undefined, and JSON.stringify drops keys with undefined values entirely - so the key is simply missing from window.appConfig on those pages.

createApiUrl then interpolates it into a template literal:

  `${undefined}/block/HASH`  // → "undefined/block/HASH"

Every other page is server-rendered per request, which is why they are unaffected.

Solution

Serve the configuration from a route that is never statically optimized, and load it from a script tag that runs before the application does.

The inline script is deliberately retained: if /runtime-config.js ever fails to load, server-rendered pages keep working with their freshly inlined values instead of losing configuration entirely.

Because the fix works below the level of any individual request, it covers the search bar, the backend health check, and any request added in the future - no per-caller handling required.

Problem:
`pages/404` and `pages/500` must be statically prerendered by Next.js, so the
`window.appConfig` script `_app` inlines into them is frozen at image build time.
`PUBLIC_*` variables are only set when the container starts, so those pages ship
without `PUBLIC_API_BASE_URL` and `createApiUrl` interpolates the literal string
"undefined" into every request made from them.

Solution:
Serve the runtime configuration from an API route instead, loaded through a
non-deferred script tag. Next.js defers all of its own bundles, so the script
runs before any application module reads the configuration.

Fixes #2469
@cryptoBeliever

Copy link
Copy Markdown
Contributor Author

@OlegMakarenko, could you please have a look and let me know if this solution makes sense to you or if you'd prefer a different approach?

@codecov

codecov Bot commented Aug 6, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 96.87%. Comparing base (03f0aa1) to head (6771ea8).
⚠️ Report is 1 commits behind head on dev.

Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##              dev    #2483      +/-   ##
==========================================
- Coverage   97.14%   96.87%   -0.27%     
==========================================
  Files         343      320      -23     
  Lines       24477    22212    -2265     
  Branches      221      221              
==========================================
- Hits        23777    21518    -2259     
+ Misses        693      687       -6     
  Partials        7        7              
Flag Coverage Δ
explorer-frontend 94.59% <ø> (ø)
explorer-puller ?

Flags with carried forward coverage won't be shown. Click here to find out more.
see 23 files with indirect coverage changes

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[explorer/frontend] Search sends requests to /undefined/... on 404 pages

1 participant