Description

Fixes a bug where the Perps trading chart's viewport would break, flicker, or "jump between views" when navigating back to a previously visited candle interval (e.g. 4h → 8h → 4h). The first visit to an interval worked correctly, but revisits would render the wrong zoom, drop candles older than the visible range, and reset continuously on every live tick.

Root causes
There were two independent bugs compounding each other:

1. Cache was overwritten on revisit, shrinking the dataset
   In CandleStreamChannel, the first visit to an interval fetches OneWeek of candles (~42 for 4h). On revisit, we intentionally do a lighter OneDay refetch (~6 candles) to conserve rate limit budget. However, the subscription callback was doing a full cache.set(cacheKey, incoming) — replacing the cached 42 candles with only 6.

When that shrunken dataset propagated to the WebView, TradingView's stored visible range pointed outside the new data, causing the viewport to collapse and candles older than the visible window to disappear.

2. Every live tick triggered a full chart reset
   In TradingViewChart, every new candleData prop (including live ticks) sent SET_CANDLESTICK_DATA to the WebView, which called candlestickSeries.setData(fullDataset). setData is a destructive operation that resets the chart's internal state. On revisit this collided with the shrunken-cache propagation, producing the flicker and zoom reset the user experienced.

Changes

CandleStreamChannel.ts — merge instead of replace

• Added a static mergeCandleData helper that merges incoming candles into the cached dataset by timestamp (incoming wins on overlapping times, older cached candles are preserved), capped at 1000 candles to prevent unbounded growth.
• Updated the subscribeToCandles callback in connectNow to merge instead of replace, so a lighter refetch on revisit no longer drops history.

TradingViewChart.tsx — route live ticks to an incremental path

• Added a lastSentSignatureRef that tracks { symbol, interval, firstTime, count, lastTime } of the last dataset sent to the WebView.
• SET_CANDLESTICK_DATA (full reload) for initial load, symbol/interval change, history prepend, count decrease, or multi-bar jump.
• UPDATE_LAST_CANDLE (incremental, 1–2 candles) for live ticks and single-bar appends on the same symbol/interval/firstTime.
• CHART_READY clears the signature so a WebView remount always forces a full reload.
• CLEAR_DATA clears the signature so the next send is a full reload (empty chart can't be incrementally updated).

TradingViewChartTemplate.tsx — handle incremental updates

• Added a new UPDATE_LAST_CANDLE message handler that calls candlestickSeries.update(candle) for each candle in the payload, keeps window.allCandleData in sync, mirrors the update on the volume series, and refreshes Y-axis decimal precision without touching the visible range or zoom.

Changelog

CHANGELOG entry: fixes bug related to chart re-rendering and flickering

Related issues

Fixes: #29232 https://consensyssoftware.atlassian.net/browse/TAT-2973

Manual testing steps

Feature: Perps chart interval revisit
  Scenario: User revisits a previously loaded candle interval
    Given the user has loaded the Perps chart on the 4h interval
    And the user has switched to the 8h interval
    When the user switches back to the 4h interval
    Then the chart renders with its full candle history preserved
    And the viewport stays zoomed to the same visible range as before
    And no skeleton loader or flicker is shown
  Scenario: User receives a live tick on a revisited interval
    Given the user is viewing the Perps chart on a revisited interval
    And the chart is fully rendered with live data
    When a live candle tick arrives
    Then only the last candle is updated in place
    And the chart's visible range and zoom remain unchanged
    And no full chart reload occurs
  Scenario: User returns after a new candle has closed
    Given the user has loaded the Perps chart on the 4h interval
    And the user has been away long enough for at least one new 4h bar to close
    When the user switches back to the 4h interval
    Then the chart reloads with the merged history and the new bars
    And the chart re-zooms cleanly to the latest candles
    And no older candles are dropped from view
  Scenario: User switches to a different symbol
    Given the user is viewing the Perps chart for BTC
    When the user navigates to the chart for ETH
    Then the chart performs a full reload with the new symbol's data
    And the previous symbol's candles are not shown

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• I've completed the PR template to the best of my ability
• I've included tests if applicable
• I've documented my code using JSDoc format if applicable
• I've applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Performance checks (if applicable)

• I've tested on Android
  • Ideally on a mid-range device; emulator is acceptable
• I've tested with a power user scenario
  • Use these power-user SRPs to import wallets with many accounts and tokens
• I've instrumented key operations with Sentry traces for production performance metrics
  • See trace() for usage and addToken for an example

For performance guidelines and tooling, see the Performance Guide.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.