[OSDEV-2273] Update copy on Claims Intro screen and Free Emissions Estimate section#905
Open
TylerHeath1 wants to merge 4 commits intomainfrom
Open
[OSDEV-2273] Update copy on Claims Intro screen and Free Emissions Estimate section#905TylerHeath1 wants to merge 4 commits intomainfrom
TylerHeath1 wants to merge 4 commits intomainfrom
Conversation
…timate section Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
|
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
React App | Jest test suite - Code coverage reportTotal: 41.93%Your code coverage diff: 0.00% ▴ ✅ All code changes are covered |
📝 WalkthroughWalkthroughThis PR updates user-facing copy and documentation across the claims flow components and FreeEmissionsEstimate section, including eligibility messages, step headings, descriptions, and hyperlinks. Corresponding test assertions are updated to validate the new text. No functional or control-flow changes are introduced. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Tip Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs). 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@src/react/src/components/InitialClaimFlow/ClaimForm/Steps/ContactInfoStep/ContactInfoStep.jsx`:
- Around line 381-382: The rendered copy in the ContactInfoStep component uses
reversed curly quote escapes (\u201D and \u201C) around Yes; update the string
in ContactInfoStep.jsx (inside the ContactInfoStep component where the label
reads "Toggle … Yes …") to use straight double quotes (") around Yes instead of
the curly-quote escape sequences so the UI shows "Yes" exactly as required.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 95372708-ba4d-4258-a6f9-f37e022fb351
📒 Files selected for processing (7)
doc/release/RELEASE-NOTES.mdsrc/react/src/__tests__/components/ClaimInfoSection.test.jssrc/react/src/__tests__/components/ClaimIntro.test.jssrc/react/src/components/FreeEmissionsEstimate/constants.jsxsrc/react/src/components/InitialClaimFlow/ClaimForm/Steps/ContactInfoStep/ContactInfoStep.jsxsrc/react/src/components/InitialClaimFlow/ClaimIntro/ClaimInfoSection.jsxsrc/react/src/components/InitialClaimFlow/ClaimIntro/ClaimIntro.jsx
Comment on lines
+381
to
382
| Toggle {'\u201D'}Yes{'\u201C'} to add public contact | ||
| details. When enabled, contact info will be visible |
There was a problem hiding this comment.
Use straight quotes around "Yes" per the copy requirement.
Line 381 still renders reversed curly quotes (\u201D / \u201C) instead of straight quotes, so this copy update does not match the PR objective.
✏️ Proposed fix
- Toggle {'\u201D'}Yes{'\u201C'} to add public contact
+ Toggle "Yes" to add public contact📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| Toggle {'\u201D'}Yes{'\u201C'} to add public contact | |
| details. When enabled, contact info will be visible | |
| Toggle "Yes" to add public contact | |
| details. When enabled, contact info will be visible |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In
`@src/react/src/components/InitialClaimFlow/ClaimForm/Steps/ContactInfoStep/ContactInfoStep.jsx`
around lines 381 - 382, The rendered copy in the ContactInfoStep component uses
reversed curly quote escapes (\u201D and \u201C) around Yes; update the string
in ContactInfoStep.jsx (inside the ContactInfoStep component where the label
reads "Toggle … Yes …") to use straight double quotes (") around Yes instead of
the curly-quote escape sequences so the UI shows "Yes" exactly as required.
Contributor
Author
There was a problem hiding this comment.
Tested visually — the app's font renders these Unicode quotes inverted from their standard definitions. \u201D before and \u201C after is the only combination that displays correctly as curly quotes. Straight quotes trigger ESLint's react/no-unescaped-entities rule, and HTML entities (“/”) also render backward in this font. This was verified through 4 different approaches during development.
There was a problem hiding this comment.
@TylerHeath1, thanks for the thorough explanation. That's a notable font rendering quirk — the reversed order (\u201D before, \u201C after) being the only combination that visually displays correct curly quotes makes sense given the font's inverted rendering of those code points. My original comment was incorrect; the current code is right. I'll note this for future reviews.
✏️ Learnings added
Learnt from: TylerHeath1
Repo: opensupplyhub/open-supply-hub PR: 905
File: src/react/src/components/InitialClaimFlow/ClaimForm/Steps/ContactInfoStep/ContactInfoStep.jsx:381-382
Timestamp: 2026-03-05T19:56:04.032Z
Learning: In `src/react/src/components/InitialClaimFlow/ClaimForm/Steps/ContactInfoStep/ContactInfoStep.jsx` (opensupplyhub/open-supply-hub), the Unicode escape sequence `{'\u201D'}Yes{'\u201C'}` (right-then-left curly quote order) around the word "Yes" is intentional. The app's font renders these Unicode code points inverted from their standard definitions, so this reversed order is the only combination that displays correctly as curly quotes. Straight double quotes (`"`) trigger ESLint's `react/no-unescaped-entities` rule, and HTML entities (`“`/`”`) also render backward in this font. This was verified through 4 different approaches during development. Do not flag this as a bug in future reviews.
Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.
🧠 Learnings used
Learnt from: vlad-shapik
Repo: opensupplyhub/open-supply-hub PR: 775
File: src/react/src/components/InitialClaimFlow/ClaimForm/Steps/EligibilityStep.jsx:88-109
Timestamp: 2025-10-24T13:01:46.869Z
Learning: In the InitialClaimFlow ClaimForm steps (src/react/src/components/InitialClaimFlow/ClaimForm/Steps/), optional TextField components intentionally do not include the onBlur={handleBlur} handler, while required fields do include it. This is expected behavior for the claim form validation UX.
Learnt from: vlad-shapik
Repo: opensupplyhub/open-supply-hub PR: 775
File: src/react/src/components/InitialClaimFlow/ClaimForm/Stepper/Stepper.jsx:43-45
Timestamp: 2025-10-24T12:42:48.908Z
Learning: In the InitialClaimFlow ClaimForm Stepper component (src/react/src/components/InitialClaimFlow/ClaimForm/Stepper/Stepper.jsx), the stepper intentionally uses `index < currentStep` for the `isClickable` check rather than `completedSteps.includes(index)` to prevent users from jumping forward to completed future steps when navigating back, enforcing a linear backward-only navigation pattern.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 781
File: src/react/src/components/InitialClaimFlow/ClaimForm/validationSchemas.js:23-52
Timestamp: 2025-10-31T08:29:48.108Z
Learning: In src/react/src/components/InitialClaimFlow/ClaimForm/validationSchemas.js, the Redux state field `claimantEmploymentVerificationMethod` stores the label (full sentence, e.g., "Company website showing your name and title (e.g., About Us, Team page)") from EMPLOYMENT_VERIFICATION_OPTIONS, not the option value (e.g., "company-website-address"). The validation schema correctly compares against labels.
Learnt from: Innavin369
Repo: opensupplyhub/open-supply-hub PR: 415
File: src/react/src/components/ContributeForm.jsx:175-206
Timestamp: 2024-11-20T23:08:05.475Z
Learning: In the `ContributeForm.jsx` React component, it's acceptable to include an empty `onClick={() => {}}` handler on a disabled `<Button>` to prevent console warnings.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 890
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContent/ProductionLocationDetailsContent.jsx:107-110
Timestamp: 2026-02-26T11:22:38.593Z
Learning: In ProductionLocationDetailsContent.jsx and FacilityDetailsContent.jsx (opensupplyhub/open-supply-hub), the isClaimed boolean should be true for any facility that has claim_info, regardless of status (APPROVED, DENIED, or REVOKED). The UI intentionally does not distinguish between DENIED/REVOKED and APPROVED claims—all are displayed with the same "claimed" styling including green banner and contributor information. Only PENDING claims are treated differently (isPending check).
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 839
File: src/react/src/components/ClaimedFacilitiesDetails/ClaimedFacilitiesDetails.jsx:633-638
Timestamp: 2025-12-18T12:50:17.910Z
Learning: In projects using Material-UI v3 (as in opensupplyhub/open-supply-hub), Typography variant names such as 'headline' and 'title' are valid and not deprecated. When reviewing components, ensure Typography components use v3-compatible variants (e.g., variant='headline' or 'title') and avoid assuming v4+ renamed variants. This guidance applies to all JSX files in the codebase that render Typography from material-ui/core.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 884
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContent.jsx:85-92
Timestamp: 2026-02-24T06:14:01.478Z
Learning: Guideline: For Material-UI Grid usage, avoid horizontal scroll caused by Grid containers with spacing. Use xs (and other breakpoint props) on Grid items, not on Grid containers. Ensure containers maintain spacing for layout, but children that represent columns are Grid items with an appropriate xs (and possibly sm/md) prop. This prevents negative margins from spacing prop causing overflow. Apply this rule to all JSX components under src/react/src/components (not just ProductionLocationDetailsContent.jsx).
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 884
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContainer/ProductionLocationDetailsContainer.jsx:15-15
Timestamp: 2026-02-24T08:14:07.737Z
Learning: In React components that use Material-UI Grid, when a Grid container with spacing causes horizontal scroll, apply style={{ margin: 0, width: '100%' }} to the container instead of adding grid breakpoint props (xs, md, lg) to the container. Use xs/md/lg only on Grid items. This guidance applies to ProductionLocationDetailsContainer and similar components in the repository.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 884
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContainer/ProductionLocationDetailsContainer.jsx:15-15
Timestamp: 2026-02-24T09:10:51.640Z
Learning: Guideline: In React components using Material-UI (MUI) Grid within the opensupplyhub/open-supply-hub repository, when a Grid container with spacing produces horizontal overflow, apply one of these fixes:
1) Add style={{ margin: 0, width: '100%' }} to the Grid container (preferred in existing learnings).
2) Make the Grid container act as a full-width Grid item by adding xs={12} to the container (as recommended by Stack Overflow). In both cases, using xs/md/lg on Grid items for layout control is encouraged to prevent overflow caused by the spacing prop.
Scope: Applicable to all JSX files using MUI Grid containers where spacing causes horizontal scroll, not limited to a single file. Prefer the style-based fix or adding a full-width item (xs={12}) depending on the surrounding Grid layout. Ensure responsive breakpoints (xs/md/lg) are used for consistent behavior.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 884
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContent/ProductionLocationDetailsContent.jsx:75-82
Timestamp: 2026-02-24T09:12:24.425Z
Learning: In React components using Material-UI (MUI) Grid within the opensupplyhub/open-supply-hub repository, when applying the Stack Overflow solution (answer 65420448) to prevent horizontal scroll caused by Grid spacing, use a combined Grid element with both container and item props, e.g. <Grid container item xs={12}>. The item prop is required for xs={12} to take effect on a container. Child Grid items should still define their own xs breakpoints for proper responsive behavior. This guidance applies to similar ProductionLocationDetailsContent-like components and other files using MUI Grid in this codebase.
Learnt from: VadimKovalenkoSNF
Repo: opensupplyhub/open-supply-hub PR: 888
File: src/react/src/components/ProductionLocation/ProductionLocationDetailsContent/ProductionLocationDetailsContent.jsx:58-58
Timestamp: 2026-02-25T08:07:48.360Z
Learning: In React components using Redux connect, when a useEffect is solely for cleanup and relies on stable dispatch functions from mapDispatchToProps, it is acceptable to use an empty dependency array and suppress the exhaustive-deps lint rule with a comment explaining the intent (e.g., "Run cleanup only on unmount; clearFacility from connect is stable for this use."). Include the suppression comment directly above the useEffect call. This guidance applies to any JSX files in the codebase that follow the same pattern.
Dedupe Hub App | Unittest test suite - Code coverage reportTotal: 55.73%Your code coverage diff: 0.00% ▴ ✅ All code changes are covered |
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
Contricleaner App | Unittest test suite - Code coverage reportTotal: 98.75%Your code coverage diff: 0.00% ▴ ✅ All code changes are covered |
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
Countries App | Unittest test suite - Code coverage reportTotal: 100%Your code coverage diff: 0.00% ▴ ✅ All code changes are covered |
TylerHeath1
temporarily deployed
to
Quality Environment
GitHub Actions
Inactive
Django App | Unittest test suite - Code coverage reportTotal: 81.97%Your code coverage diff: 0.00% ▴ ✅ All code changes are covered |
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.
What
Updated copy across the Claims Intro screen and Free Emissions Estimate section per product requirements:
How to test
/claim/{osID}for any facility — verify updated subtitle, Step 1 bullets, Step 2 and Step 3 headingsJira
https://opensupplyhub.atlassian.net/browse/OSDEV-2273
🤖 Generated with Claude Code