Skip to content

feat: add market theme token previews |OK-61996 - #13226

Open
zy2000-star wants to merge 8 commits into
xfrom
codex/feat-ok-61996-market-theme-banner
Open

feat: add market theme token previews |OK-61996#13226
zy2000-star wants to merge 8 commits into
xfrom
codex/feat-ok-61996-market-theme-banner

Conversation

@zy2000-star

@zy2000-star zy2000-star commented Sep 7, 2026

Copy link
Copy Markdown
Contributor

OK-61996


Summary

Updates Market theme banners to display token previews, making prices and 24h performance visible directly on the Market homepage.

Related issue: OK-61996
Base branch: x

Changes

Theme banner cards

  • Display up to three token previews per banner.
  • Show each token’s icon, symbol, USD price, and 24h price change.
  • Sort the supplied previews numerically by 24h price change in descending order, placing missing values last.
  • Apply positive, negative, and neutral colors while preserving valid zero values.
  • Render missing or invalid quotes as --.
  • Keep navigation on the banner title and chevron, preserving the existing theme-list and Perps destinations.
  • Retain the existing Perps leverage badge.

API integration and refresh

  • Add a typed optional tokens field to the banner response model.
  • Refresh banner data every 30 seconds and revalidate when focus returns.
  • Reduce banner cache duration from one hour to 30 seconds in both the background service and lightweight Web API.
  • Preserve the legacy banner layout when the API response does not include tokens.
  • Keep banners with an empty token list accessible through their titles.

Loading states and test coverage

  • Update banner skeletons and the Market homepage loading fallback to match the new card dimensions.
  • Add centralized test IDs for banner titles, token rows, prices, and price changes.
  • Extend development fixtures to cover token previews while retaining legacy banner examples.

Validation

  • yarn agent:check --profile commit passed, including lint, formatting, TypeScript, and background API contract checks.
  • All 13 targeted tests passed, covering:
    • Numeric sorting, the three-token limit, and response immutability.
    • Missing and invalid quotes, valid zero values, and change colors.
    • Title navigation for ticker and Perps banners.
    • Empty token lists and legacy response compatibility.
  • Verified the Web UI at desktop and mobile viewport widths:
    • Token icons, symbols, prices, and percentage changes render correctly.
    • Banner titles navigate to the expected lists.
    • Token-row clicks keep the user on the homepage.
    • Quotes refresh and missing values display as --.

Backend dependency

The current backend implementation returns the first three tokens in the configured order. This change sorts those supplied previews, but the frontend cannot determine the top three gainers across the entire theme from an already truncated response.

To fully satisfy the theme-wide top-three-gainers requirement, the backend must sort the complete theme token list by 24h price change before selecting the three preview tokens.

@sidmorizon

Copy link
Copy Markdown
Contributor

@codex review

@sidmorizon

Copy link
Copy Markdown
Contributor

@codex security review

@sidmorizon

Copy link
Copy Markdown
Contributor

@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Sep 8, 2026

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review Completed 2026-09-08T00:08:33.670997Z f318303 Manual request
🔒 Security Review Completed 2026-09-08T00:09:27.152621Z f318303 Manual request
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@chatgpt-codex-connector

Copy link
Copy Markdown

Codex Review: Didn't find any major issues. Swish!

Reviewed commit: f318303385

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

@chatgpt-codex-connector

Copy link
Copy Markdown

Security review completed. No security issues were found in this pull request.

Reviewed commit: f318303385

View security finding report

Only the user who started this review can view the report in Codex.

ℹ️ About Codex security reviews in GitHub

This is an experimental Codex feature. Security reviews are triggered when:

  • You comment "@codex security review"
  • A regular code review gets triggered (for example, "@codex review" or when a PR is opened), and you’re opted in so security review runs alongside code review

Once complete, Codex will leave suggestions, or a comment if no findings are found.

<NumberSizeableText
size="$bodyMdMedium"
formatter="priceChange"
formatterOptions={{ showPlusMinusSigns: true }}

@sidmorizon sidmorizon Sep 8, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Zero changes look positive

Severity: non-severe

With a zero 24-hour change, showPlusMinusSigns formats the neutral value as +0%. The shared formatter adds + to zero when enabled (formatDisplayNumber).

Suggested fix:

        formatterOptions={{ showPlusMinusSigns: numericChange > 0 }}

Comment on lines +201 to +204
<TradingViewDesktopToolbarContext.Provider value={proToolbar}>
<Stack flex={1} minWidth={0} overflow="hidden">
{marketTradingView}
</Stack>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Unavailable Pro chart traps users

Severity: non-severe

When Pro chart data is unavailable, TradingViewDesktopToolbarContext.Provider renders the mode control only through the missing chart. Persisted Pro-mode users see an empty panel and cannot return to Simple mode.

@zy2000-star
zy2000-star force-pushed the codex/feat-ok-61996-market-theme-banner branch from 9330eae to 434a745 Compare September 8, 2026 09:51
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.

2 participants