Fix: UI polish and stale forecast#4845
Open
ncarazon wants to merge 4 commits into
Open
Conversation
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (9)
🚧 Files skipped from review as they are similar to previous changes (9)
📝 WalkthroughWalkthroughAdds optional ChangesLatest Value Display and UI Refinements
Estimated Code Review Effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly Related PRs
Suggested Reviewers
Poem
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 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 |
ncarazon
force-pushed
the
fix/ui-polish-and-stale-forecast
branch
from
c3b8576 to
e698bdd
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
front_end/src/components/consumer_post_card/group_forecast_card/percentage_forecast_card.tsx (1)
64-64: ⚡ Quick winUse a last-non-null fallback for aggregation values here too.
Using
.at(-1)can yieldnullon trailing boundary points and forcepercentto0even when prior data exists. Aligning with theCompactLegendBarfallback avoids this mismatch.Suggested refactor
- const valueStr = getPredictionDisplayValue( - choice.latestValue ?? choice.aggregationValues.at(-1), + const fallbackAggregationValue = + choice.aggregationValues.findLast((v) => v != null) ?? null; + const valueStr = getPredictionDisplayValue( + choice.latestValue ?? fallbackAggregationValue, { questionType: QuestionType.Binary, scaling: choice.scaling,🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@front_end/src/components/consumer_post_card/group_forecast_card/percentage_forecast_card.tsx` at line 64, Replace the trailing .at(-1) fallback so it returns the last non-null aggregation value instead of possibly-null boundary points: in the expression using choice.latestValue and choice.aggregationValues (e.g., the line with choice.latestValue ?? choice.aggregationValues.at(-1)), iterate or use a safe helper to locate the last element in choice.aggregationValues that is not null/undefined (similar to CompactLegendBar’s fallback) and use that value as the fallback; ensure the code references choice.latestValue and choice.aggregationValues and preserves existing semantics when no non-null value exists.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@front_end/src/components/consumer_post_card/group_forecast_card/forecast_card_wrapper.tsx`:
- Line 37: The transient gradient flash is caused by initializing canScrollDown
to true; change the useState initialization in ForecastCardWrapper from
useState(true) to useState(false) so the initial render matches the
non-overflowing expanded state until checkScroll() runs and updates
canScrollDown via setCanScrollDown.
In `@front_end/src/components/post_card/multiple_choice_tile/choice_option.tsx`:
- Around line 60-61: The row/icon dimming happens because hasValue still checks
values.at(-1) while valueAtCursor can come from latestValue; update the hasValue
computation to mirror valueAtCursor's source selection (use the same conditional
between latestValue and values[idx]) or simply set hasValue =
!isNil(valueAtCursor) (referencing valueAtCursor, latestValue, values and idx)
so the visual state aligns with what is displayed.
---
Nitpick comments:
In
`@front_end/src/components/consumer_post_card/group_forecast_card/percentage_forecast_card.tsx`:
- Line 64: Replace the trailing .at(-1) fallback so it returns the last non-null
aggregation value instead of possibly-null boundary points: in the expression
using choice.latestValue and choice.aggregationValues (e.g., the line with
choice.latestValue ?? choice.aggregationValues.at(-1)), iterate or use a safe
helper to locate the last element in choice.aggregationValues that is not
null/undefined (similar to CompactLegendBar’s fallback) and use that value as
the fallback; ensure the code references choice.latestValue and
choice.aggregationValues and preserves existing semantics when no non-null value
exists.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: ab3c51eb-abd0-4fd7-b514-09b4edd40e16
📒 Files selected for processing (9)
front_end/src/app/(main)/questions/[id]/components/multiple_choices_chart_view/compact_legend_bar/index.tsxfront_end/src/app/(main)/questions/[id]/components/question_view/consumer_question_view/consumer_list_chart_shell.tsxfront_end/src/components/consumer_post_card/group_forecast_card/forecast_card_wrapper.tsxfront_end/src/components/consumer_post_card/group_forecast_card/percentage_forecast_card.tsxfront_end/src/components/forecast_maker/forecast_choice_option.tsxfront_end/src/components/post_card/multiple_choice_tile/choice_option.tsxfront_end/src/components/post_card/multiple_choice_tile/multiple_choice_tile_legend.tsxfront_end/src/types/choices.tsfront_end/src/utils/questions/choices.ts
Contributor
🚀 Preview EnvironmentYour preview environment is ready!
Details
ℹ️ Preview Environment InfoIsolation:
Limitations:
Cleanup:
|
ncarazon
force-pushed
the
fix/ui-polish-and-stale-forecast
branch
from
e092a03 to
bbe0f7a
Compare
cemreinanc
requested changes
Jun 9, 2026
ncarazon
force-pushed
the
fix/ui-polish-and-stale-forecast
branch
from
bbe0f7a to
23bac9b
Compare
ncarazon
force-pushed
the
fix/ui-polish-and-stale-forecast
branch
from
23bac9b to
cb6f90d
Compare
cemreinanc
reviewed
Jun 9, 2026
cemreinanc
left a comment
cemreinanc
left a comment
Contributor
There was a problem hiding this comment.
Consumer View with HideCP on:
It may not be a huge number of users using both Consumer View and Hide CP options together but still seems broken to me as it hides for binary types and doesnt hide for groups etc.
| return raw.map((choice) => { | ||
| const valueStr = getPredictionDisplayValue( | ||
| choice.aggregationValues.at(-1), | ||
| choice.latestValue ?? choice.aggregationValues.at(-1), |
Contributor
There was a problem hiding this comment.
I think this still needs the hidden-CP guard as well. In the consumer feed/storefront card UI, a user with community predictions hidden can still land on this card through GroupForecastCard; the legend path now masks latestValue, but this card computes the displayed text and bar progress directly from choice.latestValue ?? choice.aggregationValues.at(-1). That means an open group/MC card can still show real percentages and filled bars even though the user has asked not to see CP. Could we either pass/read hideCP here and render the hidden state, or avoid using CP values when the provider says CP is hidden?
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
2 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.
Resolves #4836
Resolves #4837
Resolves #4842
Summary
Fix 1: Expand gradient fadeout in consumer group/MC views
The fadeout overlay stayed visible even when the list was fully expanded or had no overflow, causing a visual artifact at the bottom.
Implemented changes:
ConsumerListChartShell: hide the gradient when scroll is at the bottom or content does not overflow the container.Fix 2: Fan chart tooltip contained within its parent
The tooltip could overflow outside the chart container on questions with many options or near the edges.
Implemented changes:
FanChart: constrained tooltip position to stay within the chart bounding box.Fix 3: Sidebar forecast % not updating live
Group sub-question percentages in the similar questions sidebar showed stale values even after the community prediction had moved, persisting across refreshes.
Root cause:
generateChoiceItemsFromGroupQuestionsfiltersaggregationHistorybycloseTime, which excluded the most recent forecast for closed sub-questions. The display value was read from that filtered array instead oflatest. Standalone binary questions are unaffected – they read directly fromaggregations[method].latest.centers[0]and never touch the filtered history.Implemented changes:
choices.ts: populatelatestValuefromaggregations[method].latest.centers[0]on each choice item.percentage_forecast_card.tsx,choice_option.tsx,compact_legend_bar: preferlatestValueover the last history entry when rendering the current percentage.Demo videos
Before
sidebar-forecast-before.mp4
After
expand-gradient-fadeout.mp4
fan-chart-tooltip.mp4
sidebar-forecast.mp4
Summary by CodeRabbit
New Features
Style