Add admin-only color override for group subquestions and MC options - #5017
Open
aseckin wants to merge 2 commits into
Open
Add admin-only color override for group subquestions and MC options#5017aseckin wants to merge 2 commits into
aseckin wants to merge 2 commits into
Conversation
Admins (is_superuser) can now set an explicit color per group subquestion and per multiple-choice option in the Create/Edit Question forms, via a small palette swatch picker next to the Subquestion Label field and at the end of each Choices row. - New nullable Question fields: label_color (palette key for group subquestions) and options_colors (dict of option label -> palette key for MC), exposed in read/write serializers with light validation. - Colors are stored as keys of METAC_COLORS["mc-option"] so light/dark theme variants keep working. - Override applied at the choices.ts choke point with fallback to the existing index-based color scale, so all timelines, legends and cards inherit it; unset/unknown keys behave exactly as before. - Option colors keyed by label survive reorders; renames via the admin update-options handler carry the color along. - MC colors stay editable even when options are locked by forecasts. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Contributor
📝 WalkthroughWalkthroughThe change adds configurable colors for multiple-choice options and group subquestion labels. Color values use frontend palette keys, persist through question APIs and drafts, remain aligned with option edits, and override default index-based rendering colors. ChangesQuestion color configuration
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant Superuser
participant QuestionForm
participant QuestionWriteSerializer
participant QuestionModel
participant ChoiceGeneration
Superuser->>QuestionForm: select option or label color
QuestionForm->>QuestionWriteSerializer: submit color mappings
QuestionWriteSerializer->>QuestionModel: validate and save color fields
QuestionModel-->>QuestionForm: return question color data
QuestionForm->>ChoiceGeneration: provide configured colors
ChoiceGeneration-->>QuestionForm: render colored choices
Possibly related PRs
Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✨ 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 |
Contributor
🚀 Preview EnvironmentYour preview environment is ready!
Details
ℹ️ Preview Environment InfoIsolation:
Limitations:
Cleanup:
|
![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: 1
🧹 Nitpick comments (1)
front_end/src/app/(main)/questions/components/group_form.tsx (1)
821-826: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueAvoid directly mutating the state object.
React state should be treated as immutable. While mutating the object directly and returning it in a new array will trigger a re-render in this component, it can lead to subtle bugs in memoized child components or hooks that rely on referential equality.
Consider returning a cloned object instead.
♻️ Proposed refactor
subQuestions.map((subQuestion, iter_index) => { if (index === iter_index) { - subQuestion["label_color"] = key; + return { ...subQuestion, label_color: key }; } return subQuestion; })🤖 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/app/`(main)/questions/components/group_form.tsx around lines 821 - 826, Update the subQuestions mapping in the group form so the item matching iter_index is replaced with a cloned object containing the new label_color, rather than mutating subQuestion directly. Return unchanged subQuestion objects for all other entries and preserve the existing array update behavior.
🤖 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/app/`(main)/questions/components/color_picker.tsx:
- Around line 51-66: Add an accessible name to each color swatch button in the
color-picker rendering by deriving a descriptive label from the color/key, and
apply that value to both aria-label and title. Keep the existing selection,
styling, and click behavior unchanged.
---
Nitpick comments:
In `@front_end/src/app/`(main)/questions/components/group_form.tsx:
- Around line 821-826: Update the subQuestions mapping in the group form so the
item matching iter_index is replaced with a cloned object containing the new
label_color, rather than mutating subQuestion directly. Return unchanged
subQuestion objects for all other entries and preserve the existing array update
behavior.
🪄 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: ae2a469d-ac8c-4840-a350-6d5bf50f4d94
📒 Files selected for processing (16)
front_end/messages/cs.jsonfront_end/messages/en.jsonfront_end/messages/es.jsonfront_end/messages/pt.jsonfront_end/messages/zh-TW.jsonfront_end/messages/zh.jsonfront_end/src/app/(main)/questions/components/color_picker.tsxfront_end/src/app/(main)/questions/components/group_form.tsxfront_end/src/app/(main)/questions/components/question_form.tsxfront_end/src/constants/colors.tsfront_end/src/types/question.tsfront_end/src/utils/questions/choices.tsquestions/migrations/0038_question_label_color_question_options_colors.pyquestions/models.pyquestions/serializers/common.pyquestions/services/multiple_choice_handlers.py
…olors # Conflicts: # front_end/src/app/(main)/questions/components/group_form.tsx # front_end/src/app/(main)/questions/components/question_form.tsx
Contributor
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
front_end/messages/zh.json (1)
616-616: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winUse Simplified Chinese in
zh.json.This locale uses Simplified Chinese elsewhere, but this value contains Traditional characters (
鏈,評論). Replace it with the approved Simplified Chinese translation, such as链接的评论, to avoid mixed scripts.🤖 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/messages/zh.json` at line 616, Update the linkedComment translation in zh.json to use Simplified Chinese characters, replacing the Traditional translation with the approved equivalent “链接的评论” while leaving other locale entries unchanged.
🤖 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.
Outside diff comments:
In `@front_end/messages/zh.json`:
- Line 616: Update the linkedComment translation in zh.json to use Simplified
Chinese characters, replacing the Traditional translation with the approved
equivalent “链接的评论” while leaving other locale entries unchanged.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 58281728-ef25-4c0b-9bfe-85954683d62d
📒 Files selected for processing (8)
front_end/messages/cs.jsonfront_end/messages/en.jsonfront_end/messages/es.jsonfront_end/messages/pt.jsonfront_end/messages/zh-TW.jsonfront_end/messages/zh.jsonfront_end/src/app/(main)/questions/components/group_form.tsxfront_end/src/app/(main)/questions/components/question_form.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
- front_end/messages/es.json
- front_end/messages/zh-TW.json
- front_end/messages/pt.json
- front_end/src/app/(main)/questions/components/question_form.tsx
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
1 participant
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.
Adds an admin-only (
is_superuser) color picker to the Create/Edit Question forms, letting admins override the default index-based colors for question group subquestions and multiple choice options.colorpicker.mp4
UI
mc-optionpalette colors + a reset-to-default cell.Backend
Questionfields + migration:label_color(palette key, group subquestions) andoptions_colors(dict of option label → palette key, MC), exposed in read/write serializers with light shape validation.multiple_choice_rename_option) carry the color along; dict keyed by label is unaffected by reorders.Rendering
METAC_COLORS["mc-option"]palette keys, so light/dark theme variants keep working.generateChoiceItemsFromMultipleChoiceForecast/generateChoiceItemsFromGroupQuestionsinchoices.ts) with fallback to the existing index-based scale — all timelines, legends, and feed/consumer cards inherit it. Unset or unknown keys behave exactly as before.Notes
🤖 Generated with Claude Code
Summary by CodeRabbit