Conversation
Show a floating tooltip with Open, High, Low, Close, and Volume data when the user taps and holds on a candle in the perpetual chart. - Tooltip appears near the top of the chart, flipping sides based on candle position - Includes a visual Low-High range bar with close position indicator - Volume displayed in abbreviated format (M/B) - Uses TextValue + TextStyle pattern consistent with ListItemView - Extracted RangeBarView / RangeBarViewModel as reusable components - Deduplicated price model creation in CandlestickChartView - Replaced inline color logic with PriceChangeColor.color(for:)
Use the full "Volume" label in the candle tooltip, add extra bottom padding to the RangeBarView and Divider to improve tooltip layout, and remove several unused localization entries (close, high, low, open) from Localized.swift.
Summary of ChangesHello @gemdev111, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request introduces a significant enhancement to the perpetual chart by adding an interactive tooltip feature. This allows users to gain immediate, detailed insights into individual candlesticks by simply tapping on them. The change improves the user experience by providing crucial financial data like open, close, low, high, and volume in an easily accessible and visually intuitive manner, directly within the chart interface. Highlights
🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console. Changelog
Activity
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
The pull request introduces a floating tooltip for the perpetual chart, displaying Open, Close, Low/High range, and Volume when a candle is tapped. This is a great feature for enhancing user experience by providing detailed information on demand. The refactoring to use ChartCandleStick directly for selectedCandle and deriving ChartPriceViewModel via selectedPriceModel is a good separation of concerns. Additionally, the use of PriceChangeColor.color for consistent color application is a positive change. However, there are a few areas for improvement regarding consistency in style definitions and a critical layout issue with the tooltip's padding that could cause it to go off-screen.
| .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: isRightHalf ? .topLeading : .topTrailing) | ||
| .padding(.leading, Spacing.small) | ||
| .padding(.top, Spacing.small) | ||
| .padding(.trailing, Spacing.extraLarge + Spacing.medium) |
There was a problem hiding this comment.
The padding applied to the CandleTooltipView is unconditional. Specifically, padding(.trailing, Spacing.extraLarge + Spacing.medium) is applied even when the tooltip is aligned to the trailing edge (isRightHalf is false). This will cause the tooltip to be pushed off-screen to the right, leading to a poor user experience. The padding should be conditional based on the isRightHalf flag to ensure the tooltip remains within the visible chart bounds.
Consider applying leading padding when isRightHalf is false (aligned trailing) and trailing padding when isRightHalf is true (aligned leading).
| .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: isRightHalf ? .topLeading : .topTrailing) | |
| .padding(.leading, Spacing.small) | |
| .padding(.top, Spacing.small) | |
| .padding(.trailing, Spacing.extraLarge + Spacing.medium) | |
| CandleTooltipView(model: CandleTooltipViewModel(candle: candle, formatter: formatter)) | |
| .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: isRightHalf ? .topLeading : .topTrailing) | |
| .padding(.top, Spacing.small) | |
| .padding(isRightHalf ? .leading : .trailing, Spacing.small) | |
| .padding(isRightHalf ? .trailing : .leading, Spacing.extraLarge + Spacing.medium) | |
| .transition(.opacity) |
|
|
||
| private let candle: ChartCandleStick | ||
| private let formatter: CurrencyFormatter | ||
| private static let volumeFormatter = CurrencyFormatter(type: .abbreviated, currencyCode: Currency.usd.rawValue) |
There was a problem hiding this comment.
The currencyCode for volumeFormatter is hardcoded to Currency.usd.rawValue. While rawValue provides the string, it's still a specific currency. If the application is intended to support multiple currencies, this should ideally be dynamic or configurable rather than hardcoded to USD, to prevent potential inconsistencies or future maintenance issues if other currencies need to be displayed for volume.
| highTitle: TextValue(text: "High", style: TextStyle(font: .system(size: .space8), color: Colors.green, fontWeight: .medium)), | ||
| lowValue: TextValue(text: formatter.string(double: candle.low), style: StyleDefaults.rangePrice), |
There was a problem hiding this comment.
The TextStyle for lowTitle and highTitle is defined inline here. For consistency and better maintainability, it would be beneficial to define these styles within the StyleDefaults struct, similar to label, value, small, and rangePrice. This centralizes style definitions and makes them easier to manage and update across the application.
| highTitle: TextValue(text: "High", style: TextStyle(font: .system(size: .space8), color: Colors.green, fontWeight: .medium)), | |
| lowValue: TextValue(text: formatter.string(double: candle.low), style: StyleDefaults.rangePrice), | |
| lowTitle: TextValue(text: "Low", style: StyleDefaults.lowTitle), | |
| highTitle: TextValue(text: "High", style: StyleDefaults.highTitle), |
1 participant
Show a floating tooltip with Open, Close, Low/High range bar, and Volume when tapping a candle on the perpetual chart.
closes #1695
images: