The colors for the accessibility comparison tab can now be changed in the preferences#1797
Conversation
WalkthroughAdded new localization keys in English and French for accessibility comparison labels and color names. Introduced six new color preference fields for transit accessibility maps in default preferences. Replaced hard-coded color constants with state-backed color fields in AccessibilityComparisonForm and passed colors into AccessibilityComparisonStatsComponent; refactored alpha handling via a new helper. Added two small UI components (ScenarioModeColorInfo, LocationModeColorInfo) and a PreferencesSectionAccessibilityComparison component, then rendered that section in PreferencesEdit. Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Tip Issue Planner is now in beta. Read the docs and try it out! Share your feedback on Discord. 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 |
There was a problem hiding this comment.
Actionable comments posted: 2
📜 Review details
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
📒 Files selected for processing (8)
locales/en/transit.jsonlocales/fr/transit.jsonpackages/chaire-lib-common/src/config/defaultPreferences.config.tspackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.tspackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
💤 Files with no reviewable changes (1)
- packages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.ts
🧰 Additional context used
📓 Path-based instructions (4)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
**/*.{ts,tsx}: Use UUIDs as primary keys for most entities in the database
Use the Status/Result pattern from chaire-lib-common for service functions and handlers
Indent using 4 spaces
Do not use trailing spaces, even in comments or documentation; replace lines with only spaces with blank lines
Use parentheses for arrow function parameters
Document non-trivial functions and attributes using JSDoc or inline comments when short
Use Geographic data in GeoJSON format with coordinates as [longitude, latitude]
Use i18next and thet()function for all user-facing strings to support internationalization
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/chaire-lib-common/src/config/defaultPreferences.config.ts
packages/transition-frontend/src/components/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
React components should use Redux for state management, i18next for translations, and SCSS for styling
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
locales/en/transit.jsonlocales/fr/transit.json
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Use TypeScript strictly and avoid
anytypes - maintain type safety throughout the application
Files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
🧠 Learnings (7)
📚 Learning: 2026-02-06T19:06:19.438Z
Learnt from: GabrielBruno24
Repo: chairemobilite/transition PR: 1767
File: packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx:177-178
Timestamp: 2026-02-06T19:06:19.438Z
Learning: In the transition accessibility map API responses (packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx), the populationData property is always present as an object with the structure { population: number | null; dataSourceAreaRatio: number }. Even when population calculation is disabled or the data source is missing, populationData is returned with population set to null rather than populationData being undefined. Therefore, accessing properties1.populationData.population without optional chaining is safe.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-01-21T14:59:52.530Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1592
File: packages/transition-frontend/src/components/map/CircleSpinnerExtension.tsx:37-44
Timestamp: 2026-01-21T14:59:52.530Z
Learning: In TSX files under packages/transition-frontend/src that currently rely on deck.gl's this.context.animationProps.time for animation timing, prefer window.performance.now() (or performance.now()) to measure elapsed time. Replace time-based calculations tied to deck.gl with direct high-resolution timestamps to improve accuracy and decouple from the rendering library. Ensure animations use delta = now - lastTime, and update lastTime accordingly for smooth, frame-rate-independent timing.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.json : Translation files in `locales/` directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Applied to files:
locales/en/transit.jsonlocales/fr/transit.json
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-01-28T18:01:07.845Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1736
File: packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts:54-63
Timestamp: 2026-01-28T18:01:07.845Z
Learning: In packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts, the headway thresholds in getHeadwayThresholdSeconds() are intentionally hard-coded constants rather than configurable parameters. These values should be based on international consensus to allow consistent comparison of transit service quality across different cities. The TODO comments indicate that these values need more research and community discussion before being finalized.
Applied to files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
🧬 Code graph analysis (2)
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
packages/transition-frontend/src/components/forms/preferences/PreferencesColorComponent.tsx (1)
PreferencesColorComponent(19-35)
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (2)
packages/transition-common/src/services/accessibilityMap/TransitBatchAccessibilityMap.ts (1)
routingEngine(74-76)packages/transition-frontend/src/services/routing/RoutingUtils.ts (1)
calculateAccessibilityMapComparison(96-118)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: test-sequential (24.x)
- GitHub Check: build-and-test (24.x)
- GitHub Check: code-lint
- GitHub Check: build-and-run-UI-tests (24.x)
- GitHub Check: pr-build-check
🔇 Additional comments (12)
packages/chaire-lib-common/src/config/defaultPreferences.config.ts (1)
393-400: LGTM: new comparison color defaults are wired in.packages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsx (2)
26-26: LGTM: new section import is clean.
174-179: LGTM: accessibility comparison section is correctly wired into the form.locales/en/transit.json (1)
776-793: LGTM: new comparison labels and Colors section added.packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx (1)
13-20: LGTM: color props cleanly replace hard-coded constants.Also applies to: 252-275
locales/fr/transit.json (1)
776-793: LGTM: French translations mirror the new comparison and preference labels.Also applies to: 1042-1048
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
1-52: LGTM: new section is consistent with the existing preferences UI pattern.packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (5)
92-152: LGTM: color prefs are stored in state and applied on init.
197-208: LGTM: comparison colors are passed into the map comparison call.
560-612: LGTM: Colors legend now reflects mode-specific colors.
1008-1009: LGTM: stats component receives fully opaque comparison colors.
1027-1043: LGTM: point colors update correctly when switching modes.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@locales/en/transit.json`:
- Around line 1042-1048: The JSON labels for keys inside
transitAccessibilityMapComparison are inconsistent: ComparisonPolygon1Color and
ComparisonPolygon2Color currently read "Intersection polygon 1 default color"
and "Intersection polygon 2 default color" but should refer to "Comparison
polygon" to match the key names and French translations; update the values for
"ComparisonPolygon1Color" and "ComparisonPolygon2Color" to use "Comparison
polygon 1 default color" and "Comparison polygon 2 default color" respectively
so labels align with "ComparisonLocation1Color"/"ComparisonLocation2Color" and
the surrounding context.
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx`:
- Around line 520-528: The helper function changeAlphaValue currently lacks
documentation; add a concise JSDoc block above changeAlphaValue describing its
purpose (updates the alpha channel of an "rgba(...)" string), the parameters
(rgbaValue: string — expected "rgba(r,g,b,a)" format, alpha: number — new alpha
0–1), the return value (string with the updated alpha or original value on parse
failure), and note its behavior on malformed input (logs an error and returns
the original rgbaValue); include a short example of expected input/output and
any assumptions about formatting to make maintenance easier.
997d1f2 to
4ea29b0
Compare
4ea29b0 to
d85db5e
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
📒 Files selected for processing (8)
locales/en/transit.jsonlocales/fr/transit.jsonpackages/chaire-lib-common/src/config/defaultPreferences.config.tspackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.tspackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
💤 Files with no reviewable changes (1)
- packages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.ts
🧰 Additional context used
📓 Path-based instructions (4)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
**/*.{ts,tsx}: Use UUIDs as primary keys for most entities in the database
Use the Status/Result pattern from chaire-lib-common for service functions and handlers
Indent using 4 spaces
Do not use trailing spaces, even in comments or documentation; replace lines with only spaces with blank lines
Use parentheses for arrow function parameters
Document non-trivial functions and attributes using JSDoc or inline comments when short
Use Geographic data in GeoJSON format with coordinates as [longitude, latitude]
Use i18next and thet()function for all user-facing strings to support internationalization
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/chaire-lib-common/src/config/defaultPreferences.config.tspackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
packages/transition-frontend/src/components/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
React components should use Redux for state management, i18next for translations, and SCSS for styling
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
locales/en/transit.jsonlocales/fr/transit.json
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Use TypeScript strictly and avoid
anytypes - maintain type safety throughout the application
Files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
🧠 Learnings (9)
📚 Learning: 2026-02-06T19:06:19.438Z
Learnt from: GabrielBruno24
Repo: chairemobilite/transition PR: 1767
File: packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx:177-178
Timestamp: 2026-02-06T19:06:19.438Z
Learning: In the transition accessibility map API responses (packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx), the populationData property is always present as an object with the structure { population: number | null; dataSourceAreaRatio: number }. Even when population calculation is disabled or the data source is missing, populationData is returned with population set to null rather than populationData being undefined. Therefore, accessing properties1.populationData.population without optional chaining is safe.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-01-21T14:59:52.530Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1592
File: packages/transition-frontend/src/components/map/CircleSpinnerExtension.tsx:37-44
Timestamp: 2026-01-21T14:59:52.530Z
Learning: In TSX files under packages/transition-frontend/src that currently rely on deck.gl's this.context.animationProps.time for animation timing, prefer window.performance.now() (or performance.now()) to measure elapsed time. Replace time-based calculations tied to deck.gl with direct high-resolution timestamps to improve accuracy and decouple from the rendering library. Ensure animations use delta = now - lastTime, and update lastTime accordingly for smooth, frame-rate-independent timing.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.json : Translation files in `locales/` directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Applied to files:
locales/en/transit.jsonlocales/fr/transit.json
📚 Learning: 2026-01-28T18:01:07.845Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1736
File: packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts:54-63
Timestamp: 2026-01-28T18:01:07.845Z
Learning: In packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts, the headway thresholds in getHeadwayThresholdSeconds() are intentionally hard-coded constants rather than configurable parameters. These values should be based on international consensus to allow consistent comparison of transit service quality across different cities. The TODO comments indicate that these values need more research and community discussion before being finalized.
Applied to files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/chaire-lib-common/src/config/defaultPreferences.config.tspackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2025-11-18T19:37:07.564Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1588
File: packages/transition-backend/src/services/transitRouting/TrRoutingBatchManager.ts:11-23
Timestamp: 2025-11-18T19:37:07.564Z
Learning: In the chairemobilite/transition repository TypeScript code, greenscientist prefers that reviews highlight when interfaces could be replaced with type aliases for stylistic consistency, especially when the structure is just a data shape.
Applied to files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Document non-trivial functions and attributes using JSDoc or inline comments when short
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
🧬 Code graph analysis (2)
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
packages/transition-frontend/src/components/forms/preferences/PreferencesColorComponent.tsx (1)
PreferencesColorComponent(19-35)
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (2)
packages/transition-common/src/services/accessibilityMap/TransitBatchAccessibilityMap.ts (1)
routingEngine(74-76)packages/transition-frontend/src/services/routing/RoutingUtils.ts (1)
calculateAccessibilityMapComparison(96-118)
🔇 Additional comments (8)
packages/chaire-lib-common/src/config/defaultPreferences.config.ts (1)
393-400: Looks good.locales/fr/transit.json (2)
776-792: Looks good.
1041-1048: Looks good.packages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsx (1)
26-26: Looks good.Also applies to: 174-179
locales/en/transit.json (1)
776-792: Looks good.packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx (1)
19-20: Looks good.Also applies to: 252-258, 268-275
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
13-47: Looks good.packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (1)
92-152: Nice wiring of preference-driven colors.Also applies to: 197-207, 560-612, 1008-1009, 1027-1043
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx`:
- Around line 520-528: changeAlphaValue currently assumes an "rgba(...)" input
and logs an error for other formats (causing noise when InputColor returns hex);
update the changeAlphaValue function to first detect format: if the value
matches an rgba(a)?(...) pattern, replace the alpha component and return the
corrected rgba string; if the value is a hex color (starts with '#' and length 4
or 7) convert that hex to an rgb triplet and return an rgba(...) string with the
given alpha; otherwise silently return the original rgbaValue (no console.error)
so non-RGBA inputs are handled gracefully.
---
Duplicate comments:
In `@locales/en/transit.json`:
- Around line 1042-1048: Update the mislabeled JSON values for
ComparisonPolygon1Color and ComparisonPolygon2Color in the
transitAccessibilityMapComparison block: change the value for
"ComparisonPolygon1Color" from "Intersection polygon 1 default color" to
"Comparison polygon 1 default color" and change "ComparisonPolygon2Color" from
"Intersection polygon 2 default color" to "Comparison polygon 2 default color"
so the labels correctly reference comparison polygons rather than intersections.
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx`:
- Around line 520-528: Add a short JSDoc comment above the changeAlphaValue
method describing its purpose (updates the alpha channel of an "rgba(...)" color
string), the parameters (rgbaValue: string - expected "rgba(r,g,b,a)" format,
alpha: number - new alpha value 0–1), and the return value (string - the updated
rgba string or the original input if malformed); mention behavior for malformed
input (logs error and returns original value) and any assumptions about input
format to help future readers and maintainers.
...sition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
Show resolved
Hide resolved
d85db5e to
aae6460
Compare
...tend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
Outdated
Show resolved
Hide resolved
...sition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
Show resolved
Hide resolved
… the preferences This includes the colors of the polygons for the intersection and location/scenario 1 and 2, as well as the origin point in scenario mode and the two origin points in location mode. Fix: chairemobilite#1795
aae6460 to
6c48712
Compare
There was a problem hiding this comment.
Actionable comments posted: 3
📜 Review details
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
📒 Files selected for processing (10)
locales/en/transit.jsonlocales/fr/transit.jsonpackages/chaire-lib-common/src/config/defaultPreferences.config.tspackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.tspackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
💤 Files with no reviewable changes (1)
- packages/transition-frontend/src/components/forms/accessibilityComparison/accessibilityComparisonConstants.ts
🧰 Additional context used
📓 Path-based instructions (4)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
**/*.{ts,tsx}: Use UUIDs as primary keys for most entities in the database
Use the Status/Result pattern from chaire-lib-common for service functions and handlers
Indent using 4 spaces
Do not use trailing spaces, even in comments or documentation; replace lines with only spaces with blank lines
Use parentheses for arrow function parameters
Document non-trivial functions and attributes using JSDoc or inline comments when short
Use Geographic data in GeoJSON format with coordinates as [longitude, latitude]
Use i18next and thet()function for all user-facing strings to support internationalization
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsxpackages/chaire-lib-common/src/config/defaultPreferences.config.ts
packages/transition-frontend/src/components/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
React components should use Redux for state management, i18next for translations, and SCSS for styling
Files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
locales/en/transit.jsonlocales/fr/transit.json
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Use TypeScript strictly and avoid
anytypes - maintain type safety throughout the application
Files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
🧠 Learnings (8)
📚 Learning: 2026-02-06T19:06:19.438Z
Learnt from: GabrielBruno24
Repo: chairemobilite/transition PR: 1767
File: packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx:177-178
Timestamp: 2026-02-06T19:06:19.438Z
Learning: In the transition accessibility map API responses (packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx), the populationData property is always present as an object with the structure { population: number | null; dataSourceAreaRatio: number }. Even when population calculation is disabled or the data source is missing, populationData is returned with population set to null rather than populationData being undefined. Therefore, accessing properties1.populationData.population without optional chaining is safe.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
📚 Learning: 2026-01-21T14:59:52.530Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1592
File: packages/transition-frontend/src/components/map/CircleSpinnerExtension.tsx:37-44
Timestamp: 2026-01-21T14:59:52.530Z
Learning: In TSX files under packages/transition-frontend/src that currently rely on deck.gl's this.context.animationProps.time for animation timing, prefer window.performance.now() (or performance.now()) to measure elapsed time. Replace time-based calculations tied to deck.gl with direct high-resolution timestamps to improve accuracy and decouple from the rendering library. Ensure animations use delta = now - lastTime, and update lastTime accordingly for smooth, frame-rate-independent timing.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsxpackages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsxpackages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.json : Translation files in `locales/` directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Applied to files:
locales/en/transit.jsonlocales/fr/transit.json
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsxpackages/chaire-lib-common/src/config/defaultPreferences.config.ts
📚 Learning: 2025-11-06T23:09:02.166Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1550
File: packages/transition-backend/src/services/transitRouting/batchRouteCalculation/BatchRouteFileResultVisitor.ts:30-34
Timestamp: 2025-11-06T23:09:02.166Z
Learning: In PathCollection.loadFromCollection (packages/transition-common/src/services/path/PathCollection.ts), despite the parameter being named `collection`, it actually expects an array of GeoJSON.Feature objects, not a FeatureCollection. The method delegates to CollectionLoadable.loadGeojsonFromCollection which expects features array directly. When calling loadFromCollection with results from pathDbQueries.geojsonCollection(), pass `pathGeojson.features` (the array) rather than `pathGeojson` (the full FeatureCollection object).
Applied to files:
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx
📚 Learning: 2026-01-28T18:01:07.845Z
Learnt from: kaligrafy
Repo: chairemobilite/transition PR: 1736
File: packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts:54-63
Timestamp: 2026-01-28T18:01:07.845Z
Learning: In packages/transition-backend/src/services/generalizedCostFunction/GeneralizedCostFunction.ts, the headway thresholds in getHeadwayThresholdSeconds() are intentionally hard-coded constants rather than configurable parameters. These values should be based on international consensus to allow consistent comparison of transit service quality across different cities. The TODO comments indicate that these values need more research and community discussion before being finalized.
Applied to files:
packages/chaire-lib-common/src/config/defaultPreferences.config.ts
🧬 Code graph analysis (2)
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (3)
packages/transition-frontend/src/services/routing/RoutingUtils.ts (1)
calculateAccessibilityMapComparison(96-118)packages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsx (1)
ScenarioModeColorInfo(17-46)packages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsx (1)
LocationModeColorInfo(18-51)
packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
packages/transition-frontend/src/components/forms/preferences/PreferencesColorComponent.tsx (1)
PreferencesColorComponent(19-35)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: pr-build-check
- GitHub Check: build-and-run-UI-tests (24.x)
- GitHub Check: code-lint
- GitHub Check: build-and-test (24.x)
- GitHub Check: test-sequential (24.x)
🔇 Additional comments (10)
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonStatsComponent.tsx (1)
19-20: LGTM — clean prop-driven color refactor.Replacing hard-coded constants with
color1/color2props is a good approach. The typing and usage are consistent.Also applies to: 252-257
locales/en/transit.json (2)
776-793: LGTM — new translation keys are well-structured.Keys follow the existing namespace organization and use consistent interpolation variables.
1042-1047: LGTM — preference labels are correct.The previous review concern about "Intersection polygon" vs "Comparison polygon" wording has been addressed.
[approve_code_changes, duplicate_comment]
packages/chaire-lib-common/src/config/defaultPreferences.config.ts (1)
393-400: LGTM — well-organized default color values.The new colors are logically grouped under
transitAccessibilityMapwith consistent alpha conventions (1 for points, 0.6 for polygons).packages/transition-frontend/src/components/forms/preferences/sections/PreferencesSectionAccessibilityComparison.tsx (1)
13-61: LGTM — follows the established pattern for preference sections.The component is well-structured, prefPaths match the default config keys, and labels reference the correct translation keys.
packages/transition-frontend/src/components/forms/preferences/PreferencesEdit.tsx (1)
26-26: LGTM — clean integration of the new preferences section.Placement after the accessibility map section is logical, and the props follow the established pattern.
Also applies to: 174-179
locales/fr/transit.json (1)
776-793: LGTM — French translations are consistent with the English file.Keys, structure, and interpolation variables all match.
Also applies to: 1042-1047
packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx (3)
202-212: LGTM —polygonColorscorrectly wired tocalculateAccessibilityMapComparison.
1000-1017: LGTM — point colors correctly differentiated between scenario and location modes.
97-102: No safeguards needed for color preferences—defaults are already defined.All six color fields have defaults in
defaultPreferences.config.tsand are merged into the Preferences object during initialization, soPreferences.get()will return the defined RGBA values rather thanundefined. ThechangeAlphaValuefunction also safely returns the original value if the format is unexpected (line 529–530), preventing crashes even if passed an unexpected input.No action required.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx`:
- Around line 137-150: The component reads color prefs once in the constructor
via Preferences.get(...) and keeps stale values; update calculateRouting to
re-read the needed preference keys (use Preferences.get for
intersectionLocationColor, intersectionPolygonColor, comparisonLocation1Color,
comparisonPolygon1Color, comparisonLocation2Color, comparisonPolygon2Color)
immediately before building polygonColors and before passing color1/color2 to
the map/stats so the latest preference edits are used; locate references to
polygonColors, color1, color2 and the calculateRouting method and replace uses
of stored constructor state with freshly read Preferences.get(...) values.
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsx`:
- Around line 31-36: The JSX renders an unwanted space before the colon because
the JSX expression for the translation and the literal ": " are on separate
lines; in the LocationModeColorInfo component, keep the colon adjacent to the
translation output (e.g., move the ":" into the same JSX line/expression or
render it as a string literal without breaking the expression) for the row using
t('transit:accessibilityComparison:LocationNPolygon', { locationNumber: '1' })
and apply the identical change to the location 2 polygon row (the JSX that uses
comparisonPolygon2Color) so no extra whitespace is introduced.
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsx`:
- Around line 30-35: The JSX inserts a stray space before the colon by rendering
": " on a new line after the translation call in ScenarioModeColorInfo;
update the JSX for both scenario rows so the colon is part of the same
expression as the translation (remove the separate ": " line and append
the ":" directly after the t('transit:accessibilityComparison:ScenarioNPolygon',
{ scenarioNumber: '1' }) and similarly for scenarioNumber '2'), ensuring the
span with props.comparisonPolygon1Color (and the scenario 2 equivalent) remains
unchanged.
---
Duplicate comments:
In
`@packages/transition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx`:
- Around line 527-534: The function changeAlphaValue silently returns the
original input for non-RGBA values which is intentional because callers always
pass alpha=1 and hex inputs are already opaque; add an explicit comment inside
changeAlphaValue documenting this behavior and the alpha=1 precondition so
future readers/reviewers understand why no error is logged, and optionally add a
runtime assertion or guard (e.g., if (alpha !== 1) throw or console.warn) to
make the precondition explicit without changing current behavior.
...sition-frontend/src/components/forms/accessibilityComparison/AccessibilityComparisonForm.tsx
Show resolved
Hide resolved
...s/transition-frontend/src/components/forms/accessibilityComparison/LocationModeColorInfo.tsx
Show resolved
Hide resolved
...s/transition-frontend/src/components/forms/accessibilityComparison/ScenarioModeColorInfo.tsx
Show resolved
Hide resolved
| travelTime?: number; | ||
| }; | ||
|
|
||
| interface TransitRoutingFormState extends ChangeEventsState<TransitAccessibilityMapRouting> { |
There was a problem hiding this comment.
Tiens donc, le nom de cet interface laisse un peu à désirer... Si jamais ça adonne, tu pourrais le renommer!
There was a problem hiding this comment.
Je le fais dans la PR de la data source!
This includes the colors of the polygons for the intersection and location/scenario 1 and 2, as well as the origin point in scenario mode and the two origin points in location mode. Fix: #1795
Summary by CodeRabbit
New Features
Localization
UI