FE: add selected/selectable visual states to BarChart#1748
Conversation
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
❌ Fast Track: checks did not pass
To run the guardrails locally, from Reflects |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: d958aead1e
ℹ️ 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".
| if (typeof params.dataIndex !== 'number') return; | ||
| const item = data[params.dataIndex]; | ||
| if (item) onBarClick?.(item); | ||
| if (item && item.selectable !== false) onBarClick?.(item); |
There was a problem hiding this comment.
This is the only place that enforces selectable=false, but the added tests only inspect the ECharts option and do not exercise this click branch. A regression could start calling onBarClick for unselectable bars while the new option-builder test still passes, so please add a BarChart component test using the mocked click handler for a selectable: false datum.
AGENTS.md reference: AGENTS.md:L39-L41
Useful? React with 👍 / 👎.
| opacity: item.selectable === false ? 0.45 : 1, | ||
| borderColor: item.selected ? SELECTED_BORDER_COLOR : 'transparent', | ||
| borderWidth: item.selected ? 3 : 0 |
There was a problem hiding this comment.
The new selected/unselectable styling hard-codes 0.45, 1, 3, and 0 inside the series-data mapper even though these values define reusable visual states. Please lift the opacity and border-width values into named constants next to BAR_COLOR/SELECTED_BORDER_COLOR so the option builder stays easier to scan and future changes to the disabled/selected treatment are centralized.
AGENTS.md reference: AGENTS.md:L39-L41
Useful? React with 👍 / 👎.
CategoryCount gains optional selected and selectable fields; buildEchartsOption renders a bright border on selected bars and dims unselectable ones. Clicks on bars with selectable=false are suppressed. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
8788416 to
aaeaf8a
Compare
d958aea to
a32f9c9
Compare
…t-filter-ui-8-sp.p6' into kondrat-lig-9585-frontend-categorical-metadata-bar-chart-filter-ui-8-sp.p7
1 participant
Summary
Stacked on p6.
Extends
CategoryCountwith optionalselectedandselectableboolean fields;buildEchartsOptionapplies visual feedback:rgba(255,255,255,0.95))selectable=falsebars are suppressed at theBarChartlevel so the host component only receives intentional selectionsBars without either field behave identically to before (backwards-compatible).
Test plan
make static-checks(frontend) passesnpm run test:unitpasses (new tests inbuildEchartsOption.test.ts)Part of LIG-9585.