Skip to content

[explorer/frontend] feat: add Symbol frontend variant shell#2217

Open
daoka wants to merge 5 commits into
devfrom
explorer/frontend/symbol-variant-shell
Open

[explorer/frontend] feat: add Symbol frontend variant shell#2217
daoka wants to merge 5 commits into
devfrom
explorer/frontend/symbol-variant-shell

Conversation

@daoka
Copy link
Copy Markdown

@daoka daoka commented May 27, 2026

What is the current behavior?

The explorer frontend is effectively NEM-only. Public modules under explorer/frontend/api/* contain the NEM API mapping directly, so adding Symbol support requires editing shared frontend code and makes the Symbol work too large to review safely.

The frontend also assumes a single default asset/config/theme path. There is no variant boundary for selecting NEM or Symbol runtime behavior from NEXT_PUBLIC_PLATFORM / PLATFORM.

What's the issue?

Symbol Explorer work needs to be split into smaller PRs. Without a frontend variant boundary, follow-up Symbol pages and adapters would mix Symbol-specific behavior into shared code or into the existing NEM implementation.

This PR is intended to provide only the minimum frontend shell needed for Symbol startup and review:

  • preserve NEM as the default behavior
  • add a variant selection boundary
  • add a minimal Symbol runtime shell
  • keep account lists, richer block/transaction details, REST API/Puller integration, and feature-complete Symbol pages for follow-up PRs

How have you changed the behavior?

Added frontend variant selection for nem and symbol.

  • Added explorer/frontend/variants/index.js to resolve the active variant from NEXT_PUBLIC_PLATFORM || PLATFORM || 'nem'.
  • Moved the current NEM API implementations into variants/nem/api/*.
  • Kept the existing api/*.js modules as compatibility wrappers so existing imports continue to work.
  • Verified variants/nem/api/* matches the corresponding dev api/* implementation files.

Added a minimal Symbol runtime shell.

  • Added Symbol config, DocumentHead, page config, theme variables, fonts, and runtime assets.
  • Added minimal Symbol API adapters for current shell rendering.
  • Added a temporary Symbol node proxy for frontend-only shell validation. This is intentionally narrow and temporary; the long-term direction remains REST API / Puller parity with NEM.
  • Hardened the temporary proxy with GET-only behavior, path/query allowlists, request timeout handling, and page-size clamping.
  • Avoided misleading output for unsupported temporary Symbol filters by returning empty pages instead of forwarding unsupported filters as unfiltered requests.
  • Added Symbol transaction type coverage for the supported Symbol transaction type list.

Added build/runtime support needed by Symbol.

  • Added Symbol SDK browser build support and frontend-safe stubs for optional Node/WASM-only paths.
  • Added Symbol address conversion support used by the runtime shell.
  • Added local image pattern support for Symbol assets.
  • Escaped inline app config bootstrap data before injecting it into the page.

This is not intended to be a complete Symbol Explorer implementation. Feature-complete Symbol list/detail behavior remains follow-up work.

daoka added 5 commits May 27, 2026 15:13
Introduce the frontend variant boundary so shared API imports resolve through the selected platform while preserving the existing NEM behavior as the default.

Move the NEM API implementations behind variants/nem and keep the public api modules as compatibility wrappers. Add config/env fallback coverage and the app config bootstrap path needed by the variant selector.
Add the browser build plumbing needed by the Symbol runtime shell without changing the default NEM platform behavior.

Transpile the Symbol SDK, alias optional Node/WASM-only crypto paths to frontend-safe stubs, and add the runtime dependencies used by Symbol address formatting.
Add the minimal Symbol frontend shell on top of the variant boundary so NEXT_PUBLIC_PLATFORM=symbol can render against current Symbol REST responses while deeper explorer features remain follow-up work.

This includes Symbol assets, theme variables, runtime adapters, temporary node proxy hardening, and focused tests for transaction mapping, config bootstrap safety, and unsupported filter behavior.
Symbol SDK pulls @noble/hashes 2.x, which requires Node >= 20.19.0 and can fail the CI setup install step on older Node 20 runners with engine checks enabled.

Pin @noble/hashes to 1.8.0 through the frontend dependency graph so Symbol SDK remains available while keeping the install compatible with the current CI runtime.
The CI coverage check dropped below the 95% line threshold after adding the Symbol runtime shell.

Add Symbol account adapter coverage for accounts/search and account info responses so the tests verify account normalization while restoring the required coverage margin.
@codecov
Copy link
Copy Markdown

codecov Bot commented May 27, 2026

Codecov Report

❌ Patch coverage is 95.87766% with 62 lines in your changes missing coverage. Please review.
✅ Project coverage is 96.69%. Comparing base (2421eb1) to head (e39ddf4).
⚠️ Report is 25 commits behind head on dev.

Files with missing lines Patch % Lines
explorer/frontend/variants/nem/DocumentHead.jsx 34.48% 19 Missing ⚠️
...plorer/frontend/pages/api/symbol-node/[...path].js 91.24% 12 Missing ⚠️
explorer/frontend/variants/index.js 87.83% 9 Missing ⚠️
...lorer/frontend/variants/symbol/api/transactions.js 93.44% 8 Missing ⚠️
explorer/frontend/variants/symbol/utils/index.js 93.40% 6 Missing ⚠️
explorer/frontend/utils/client.js 86.36% 3 Missing ⚠️
explorer/frontend/variants/symbol/DocumentHead.jsx 81.81% 2 Missing ⚠️
...plorer/frontend/components/IconTransactionType.jsx 96.55% 1 Missing ⚠️
explorer/frontend/variants/nem/api/blocks.js 98.21% 1 Missing ⚠️
explorer/frontend/variants/symbol/api/accounts.js 98.80% 1 Missing ⚠️
Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##              dev    #2217      +/-   ##
==========================================
- Coverage   96.90%   96.69%   -0.22%     
==========================================
  Files         267      273       +6     
  Lines       19379    19880     +501     
  Branches      215      215              
==========================================
+ Hits        18779    19222     +443     
- Misses        594      652      +58     
  Partials        6        6              
Flag Coverage Δ
explorer-frontend 94.54% <95.87%> (-0.47%) ⬇️
explorer-rest ?

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines Coverage Δ
explorer/frontend/components/ButtonClose.jsx 100.00% <100.00%> (ø)
explorer/frontend/components/ButtonCopy.jsx 100.00% <100.00%> (ø)
explorer/frontend/components/CustomImage.jsx 100.00% <100.00%> (ø)
...r/frontend/components/SectionHeaderTransaction.jsx 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/accounts.js 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/mosaics.js 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/namespaces.js 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/nodes.js 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/search.js 100.00% <100.00%> (ø)
explorer/frontend/variants/nem/api/stats.js 100.00% <100.00%> (ø)
... and 15 more

... and 11 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.

1 participant