Skip to content

MPDX-9577 Move form-type chip to its own line in PDS goal card#1777

Merged
wjames111 merged 1 commit into
mainfrom
MPDX-9577
May 15, 2026
Merged

MPDX-9577 Move form-type chip to its own line in PDS goal card#1777
wjames111 merged 1 commit into
mainfrom
MPDX-9577

Conversation

@wjames111
Copy link
Copy Markdown
Contributor

Description

  • Stack the Simple/Default form-type chip below the goal name in the shared GoalCard so it occupies its own line instead of sharing the header row.
  • Restores full width to the goal name when a badge is present, keeping long names readable.
  • Related ticket: MPDX-9577

Testing

  • Go to the PDS Goal Calculator goals list (/accountLists/[id]/hrTools/pdsGoalCalculator).
  • Verify each goal card shows the goal name on one line and the "Simple" or "Default" chip centered on the line below.
  • Verify the MPD Goal Calculator goal cards (no badge) are unchanged.

Checklist:

  • I have given my PR a title with the format "MPDX-(JIRA#) (summary sentence max 80 chars)"
  • I have applied the appropriate labels (Add the label "Preview" to automatically create a preview environment)
  • I have run the Claude Code /pr-review command locally and fixed any relevant suggestions
  • I have requested a review from another person on the project
  • I have tested my changes in preview or in staging
  • I have cleaned up my commit history

🤖 Generated with Claude Code

Stack the Simple/Default badge below the goal name so long names
have full width and the chip is consistently positioned.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@github-actions
Copy link
Copy Markdown
Contributor

Bundle sizes [mpdx-react]

Compared against f8f8712

No significant changes found

Copy link
Copy Markdown
Contributor Author

@wjames111 wjames111 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Multi-Agent Code Review — CLEAN

Verdict: CLEAN — No significant issues found. Ship it.

Risk: LOW (1/10) · 1 file · +4/-5 lines · pure CSS/layout change in GoalCard header.

Verdict Summary

  • Critical Blockers (9.0–10.0): 0
  • High Priority (8.0–8.9): 0
  • Important (7.0–7.9): 0
  • Medium (5.0–6.9): 0
  • Suggestions (<5.0): 2 (informational — see below)

Agent Coverage

Agent Critical High Important Suggestions Confidence
Architecture 0 0 0 1 (sev 2.5) High (9.0)
Testing & Quality 0 0 0 1 (sev 2.0) High (9.0)
Standards 0 0 0 0 High (9.5)
UX 0 0 0 0 High (9.5)
Financial Reporting 0 0 0 0 High (N/A — false-positive trigger)
Total 0 0 0 2

Dependency Impact

GoalCard is consumed by two callers, and exactly one of them (the PDS card) supplies a badge prop and therefore exercises the new column layout:

  • src/components/HrTools/PdsGoalCalculator/GoalCard/PdsGoalCard.tsx — passes a formTypeBadge Chip (the target of this PR)
  • src/components/HrTools/GoalCalculator/GoalCard/MpdGoalCard.tsx — does not pass badge, so the row-layout branch (no flexDirection: 'column') is unaffected

No breaking changes. The minWidth: 0 removal is safe because the width: '100%' fallback now applies in both branches and the column-direction parent gives the truncating Typography its own full-width row.

Standards Checklist

  • Named exports only: PASS
  • File naming PascalCase: PASS
  • i18n / no new hardcoded strings: PASS (diff is styling-only)
  • TypeScript (no any / @ts-ignore / !): PASS
  • MUI theme tokens (no raw hex / pixel values): PASS (gap: 1 resolves via theme.spacing(1))
  • No console.* / debugger / new Date() / unused imports introduced: PASS
  • Pages Router conventions: N/A (component file)
  • GraphQL / Apollo / Forms / Tests: N/A (not touched)

Informational Suggestions (do not block, no /dismiss needed)

  1. Architecture (sev 2.5/10): Consider encoding the stacked layout as a prop on StyledHeaderBox rather than a sx override — keeps layout decisions in the styled component. Optional polish; the inline sx form is consistent with other patterns under src/components/Reports/Shared/. See the inline comment on the changed sx for a sketch.
  2. Testing (sev 2.0/10): The CSS-only change is uncovered by an explicit layout assertion in GoalCard.test.tsx, but peer cards in the repo also don't assert layout, so this is consistent with project norms. If you want a guard against regression, you could add expect(header).toHaveStyle({ flexDirection: 'column' }) to the existing 'renders the badge when provided' test — but toHaveStyle on MUI sx can be flaky in jsdom. Not required for merge.

Pre-existing notes (informational, not blocking)

One pre-existing accessibility note (out of PR scope): the truncated Typography inside the Tooltip is not keyboard-focusable, so keyboard users can't reveal the full goal name. This predates this PR — consider a separate ticket if product cares.


Reviewed by 5 agents (Architecture, Testing & Quality, Standards, UX, Financial Reporting) in Standard mode. Debate and gap review were skipped — all findings were below the debate threshold (sev < 7) and the single changed file received coverage from all 5 agents.

Comment thread src/components/Reports/Shared/GoalCard/GoalCard.tsx
Copy link
Copy Markdown
Contributor

@github-actions github-actions Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

AI Review Auto-Approval

Risk Level: LOW (1/10)
Verdict: CLEAN (no issues found)

This PR was auto-approved because:

  • The multi-agent AI review determined it is low risk
  • No blocking issues were found

If you believe this PR needs human review, dismiss this approval and request a review manually.

@wjames111 wjames111 merged commit 7a8f99f into main May 15, 2026
23 checks passed
@wjames111 wjames111 deleted the MPDX-9577 branch May 15, 2026 16:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant