chore: create advanced charts core package - #9762
Open
sahar-fehri wants to merge 21 commits into
Open
sahar-fehri wants to merge 21 commits into
sahar-fehri wants to merge 21 commits into
Conversation
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
7 tasks
Contributor
Author
|
@metamaskbot publish-preview |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
Prithpal-Sooriya
previously approved these changes
Sep 23, 2026
Prithpal-Sooriya
left a comment
Prithpal-Sooriya
left a comment
Contributor
There was a problem hiding this comment.
This is porting over the agnostic chart files from Mobile into this new shared package. No new implementation was added here. And package is shipping as 0.0.0 / unreleased.
LGTM
|
No dependency changes detected. Learn more about Socket for GitHub. 👍 No dependency changes detected in pull request |
sahar-fehri
force-pushed
the
chore/create-advanced-charts-core-package
branch
from
September 28, 2026 09:28
6a53236 to
e5e0995
Compare
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 2 potential issues.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 2a9290c. Configure here.
sahar-fehri
force-pushed
the
chore/create-advanced-charts-core-package
branch
from
September 28, 2026 10:56
2a9290c to
24f8fbe
Compare
sahar-fehri
force-pushed
the
chore/create-advanced-charts-core-package
branch
from
September 28, 2026 11:02
24f8fbe to
c4789fd
Compare
Contributor
Author
|
@metamaskbot publish-preview |
Contributor
|
Preview builds have been published. Learn how to use preview builds in other projects. Expand for full list of packages and versions. |
Prithpal-Sooriya
approved these changes
Sep 28, 2026
sahar-fehri
enabled auto-merge
September 28, 2026 12:08
This was referenced Sep 28, 2026
salimtb
approved these changes
Sep 28, 2026
cryptodev-2s
pushed a commit
to cryptodev-2s/core
that referenced
this pull request
Sep 28, 2026
## Explanation Initialize `advanced-chart-core` package. This is **scaffolding only** — a standard package skeleton with a placeholder `greeter` export and Jest test. The actual chart engine implementation will follow in a stacked PR. ### What this PR does - Adds `@metamask/advanced-chart-core` workspace package (dual MIT/Apache license, changelog, README, build/test/docs scripts) - Placeholder `greeter` named export + test - Monorepo wiring: - `codeowners.ts` / `CODEOWNERS` — ownership assigned to `@MetaMask/metamask-assets`, `@MetaMask/perps`, `@MetaMask/social-ai` - `teams.json` — adds `advanced-chart-core` entry - `tsconfig.json` / `tsconfig.build.json` — adds project references - `README.md` — adds package to list and dependency diagram - `yarn.lock` — updated ## References - Implementation PR will follow as a stacked PR on top of this branch - Related to MetaMask#9762 ## Checklist - [x] I've updated the test suite for new or updated code as appropriate - [x] I've updated documentation (JSDoc, Markdown, etc.) for new or updated code as appropriate - [ ] I've communicated my changes to consumers by [updating changelogs for packages I've changed](https://github.com/MetaMask/core/tree/main/docs/processes/updating-changelogs.md) - [ ] I've introduced [breaking changes](https://github.com/MetaMask/core/tree/main/docs/processes/breaking-changes.md) in this PR and have prepared draft pull requests for clients and consumer packages to resolve them <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > New isolated package skeleton with no changes to existing controllers or client integration paths. > > **Overview** > Adds **`@metamask/advanced-chart-core`** as a new workspace package with the usual monorepo scaffolding (dual MIT/Apache licensing, build/test/docs scripts, TypeDoc/Jest config, and an **Unreleased** changelog aimed at a future TradingView WebView engine). > > Runtime code is **placeholder only**: a **`greeter`** export plus a small Jest test; there is no chart engine or host transport in this diff. > > **Monorepo wiring** registers the package in root **`tsconfig`** references, **`README`** package list and Mermaid graph, **`yarn.lock`**, **`oxlint-suppressions`** for its Jest config, and ownership via **`CODEOWNERS`**, **`codeowners.ts`** (`@MetaMask/metamask-assets`, `@MetaMask/perps`), and **`teams.json`** (`team-assets`). > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit a94eaf7. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY -->
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Explanation
This PR introduces a new package,
@metamask/advanced-chart-core— the platform-agnostic TradingView Advanced Charts WebView engine, extracted out of MetaMask mobile so it can be shared by both mobile and the browser extension from a single implementation.Current state / why this needs to change. The Advanced Charts engine (the TypeScript that runs inside the chart WebView/iframe: bootstrap, RN bridge, datafeed, OHLCV ingestion, indicators, overlays such as trade markers / position lines / social leaderboard, theming, pagination, etc.) currently lives only in mobile at
app/components/UI/Charts/AdvancedChart/webview/src. As the extension adds its own Token Details Page (TDP) chart, keeping a second copy would mean maintaining the same non-trivial engine twice and inevitably drifting between platforms.What this PR does. It lifts that engine into a standalone, platform-agnostic core package with no React Native / mobile-specific dependencies, wired into the
coremonorepo's build, lint, test, and release tooling. The engine communicates with its host over a pluggable host transport layer, so the same compiled artifact can be embedded by any client — RN WebView or browser iframe — without shims. The near-term consumer is the extension TDP integration (separate repo); mobile has already validated consuming this package and rendering identically to its in-tree copy.Copy-paste / behavior-equivalence framing
The engine source in this package is a behavior-preserving, verbatim copy of mobile's
AdvancedChart/webview/src. The ~40 engine source*.tsfiles were copied over at identical relative paths, and the only edits applied were to satisfy thecoremonorepo's lint/build conventions — not runtime behavior. Concretely, the changes are limited to things like:new-cap, documentation rules),.jsimport extensions on relative specifiers (ESM/tscoutput),===/!==strict-equality and single-sided null checks,??in place of||,prefer-template,curly,consistent-return,interface→type, destructuring, and similar cosmetic rewrites.Host transport layer
On top of the behavior-preserving port, this PR extracts the platform-specific transport code from
bridge.tsinto an injectable host transport layer:ChartHostTransportinterface (core/host.ts): definespostMessage,subscribe, andgetConfig— the three operations that differ between platforms.createReactNativeHost()(platform/reactNativeHost.ts): adapter for RN WebView — outbound via the realwindow.ReactNativeWebView.postMessage()injected by RN, inbound viawindow/documentmessage listeners with null/empty origin filtering, config fromwindow.CONFIG.createIframeHost()(platform/iframeHost.ts): adapter for browser iframes — outbound viawindow.parent.postMessage()withtargetOriginresolved fromdocument.referrer, inbound filtered against anallowedOrigins[]array, config passed explicitly.@metamask/advanced-chart-core/hostsubpath export (host-entry.ts): side-effect-free entry that exports both adapters +bootstrap()without auto-booting. The default entry (index.ts) still auto-boots withcreateReactNativeHost()for backward compatibility.bridge.tsnow handles only JSON framing, parsing, and validation — it callsgetHostTransport().postMessage()and.subscribe()instead of referencing platform globals directly.getConfig()(core/state.ts): centralizes config access —bootstrap.ts,priceFormatter.ts, andscaleLayout.tsno longer readwindow.CONFIGdirectly.The chart-origin server page (which serves the engine to both extension and mobile) detects the environment at boot: if
window.ReactNativeWebViewexists (RN injected it) →createReactNativeHost(); otherwise →createIframeHost(). See advanced-chart-origin PR #6 for the chart-origin side of this change.What's included
src/): ~40*.tsfiles acrosscore/,widget/,features/,interaction/,messages/,overlays/, andpagination/, plus the thin IIFE entrysrc/index.ts.src/core/host.ts,src/platform/):ChartHostTransportinterface withcreateReactNativeHost()andcreateIframeHost()adapters.src/host-entry.ts):@metamask/advanced-chart-core/hostsubpath for non-mobile hosts that choose their own transport and boot timing.src/**/__tests__/): 40 test suites / 563 tests (37 ported from mobile + 3 new for the transport layer).tsc:build/build:allscripts,package.jsonexports(.js/.d.ts), and"sideEffects": falsefor tree-shaking.tsconfig.json/tsconfig.build.json, added to the roottsconfig.json/tsconfig.build.jsonproject references so it participates in the monorepo build graph..github/CODEOWNERS,codeowners.ts, andteams.jsonentries.README.md,CHANGELOG.md,LICENSE((MIT OR Apache-2.0)withLICENSE.MIT/LICENSE.APACHE2), and a rootREADME.mdtable entry.no-restricted-globals: offoverride forpackages/advanced-chart-core/src/**/*.tsonly, because this engine legitimately references browser globals (window,document,requestAnimationFrame) inside the WebView. Platform-specific transport globals (window.ReactNativeWebView,window.parent) are isolated in their respective adapters.jest.config.cjsextends the shared base config and setstestEnvironment: 'jsdom'(upstream in mobile these were per-file@jest-environment jsdomdocblocks) and resets the node-orientedcustomExportConditionsso jsdom resolves browser export conditions.References
packages/advanced-chart-core/README.mdmetamask-mobile→app/components/UI/Charts/AdvancedChart/webview/srcTesting
Verified via the monorepo's standard package checks:
yarn workspace @metamask/advanced-chart-core run test) — 40 suites / 563 tests passing (37 ported from mobile + 3 new for the host transport layer).tsc(ESM) and participates in the root build graph. The./hostsubpath builds correctly alongside the default entry.constraints,knip, and README/changelog content checks.webview/srccopy; bundle-level checks show an identical module graph vs. the mobile origin.Follow-ups / out of scope
webview/src— prepared on a mobile branch, to land once downstreams cut over to the package.0.0.0, unpublished).Checklist
Note
Medium Risk
Introduces a large shared chart/WebView messaging surface that multiple clients will depend on, though it is framed as a behavior-preserving lift with extensive tests and a backward-compatible RN default transport.
Overview
Adds
@metamask/advanced-chart-core, a new monorepo package containing the TradingView Advanced Charts engine previously only in metamask-mobile (AdvancedChart/webview/src), so mobile and the extension can share one implementation.The engine is refactored behind an injectable
ChartHostTransport:createReactNativeHost()remains the default (auto-boot on the main entry), whilecreateIframeHost()and the@metamask/advanced-chart-core/hostsubpath support extension iframe hosts that set transport and boot timing themselves.bridge.tsnow only handles JSON framing/validation and delegates to the active transport; config reads go throughgetHostTransport().getConfig()/getConfig()instead of hard-codedwindow.CONFIGaccess everywhere.Repo wiring includes CODEOWNERS /
codeowners.ts, root README package list and dependency graph, oxlint browser env for this package, jsdom Jest defaults, and a large ported unit test suite. Changelog notes lint-only source adjustments and fixes for barrel imports that broke compiledindexresolution.Reviewed by Cursor Bugbot for commit c4789fd. Bugbot is set up for automated code reviews on this repo. Configure here.