Skip to content

feat(StateTaxesList): display setup_status, default_rates_applied, and ready_to_run_payroll#1620

Merged
serikjensen merged 7 commits intomainfrom
sdk-774-employee-doc-signer-hook
Apr 30, 2026
Merged

feat(StateTaxesList): display setup_status, default_rates_applied, and ready_to_run_payroll#1620
serikjensen merged 7 commits intomainfrom
sdk-774-employee-doc-signer-hook

Conversation

@serikjensen
Copy link
Copy Markdown
Member

@serikjensen serikjensen commented Apr 28, 2026

Summary

Implements the Phase 2 UI updates for the Company State Taxes list, surfacing three new API fields from TaxRequirementStatesList:

  • 3-state badge: not_started → "Not started" (info), in_progress → "In progress" (warning), complete → "Complete" (success). Falls back to setup_complete boolean for backward compatibility.
  • "Default tax rates applied" subtext: shown in the state name column when default_rates_applied: true.
  • "Ready to run payroll" secondary badge: shown alongside the Complete badge when ready_to_run_payroll: true.
  • 3-state CTA label: "Start setup" / "Continue setup" / "Edit" driven by setup_status.

Changes

  • src/i18n/en/Company.StateTaxes.json — 5 new keys: notStartedBadge, inProgressBadge, startStateTaxSetupCta, defaultRatesAppliedText, readyToRunPayrollBadge
  • src/types/i18next.d.ts — regenerated types
  • src/components/Company/StateTaxes/StateTaxesList/List.tsx — updated badge/CTA logic with as const satisfies maps for type-safe t() calls
  • src/test/mocks/apis/company_state_taxes.ts — added getAllStateTaxRequirementsWithStatus fixture covering all four design states
  • src/components/Company/StateTaxes/StateTaxesList/StateTaxesList.test.tsx — refactored to isolated single-state renders per describe block with negative assertions for exclusivity

Test plan

  • All 14 unit tests pass: npm run test -- --run src/components/Company/StateTaxes/StateTaxesList/StateTaxesList.test.tsx
  • Verified all four scenarios live against demo environment (not_started, in_progress, complete + ready_to_run_payroll)
  • Verified complete + default_rates_applied scenario via Storybook with mock data
Screenshot 2026-04-27 at 4 04 14 PM Screenshot_2026-04-27_at_5 52 02_PM-376d636f-f3da-

Made with Cursor

<>
<Components.Badge status={requirement.setupComplete ? 'success' : 'warning'}>
{requirement.setupComplete ? t('completeBadge') : t('incompleteBadge')}
<div style={{ display: 'flex', gap: '8px', alignItems: 'center', flexWrap: 'wrap' }}>
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Just calling this out since i've seen it across a few PRs.... looks like Flex isn't doing it for us anymore? Maybe?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

i think it's hallucinating it, i'll have it revise

},
render: requirement => (
<Flex flexDirection="column" gap={4}>
<span>{statesHash(requirement.state as (typeof STATES_ABBR)[number])}</span>
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

should this be Text as span?

@serikjensen serikjensen force-pushed the sdk-774-employee-doc-signer-hook branch from 8afa1ee to 1280f42 Compare April 28, 2026 23:13
…mit-callback guidance

Completes the useSignEmployeeForm migration per the migrate-sdk-component-to-hooks skill
and integrates the "Submit Callbacks vs. Return Value" guidance into the hooks docs:

- SignatureForm and I9SignatureForm now render through BaseLayout for loading and error
  states, wrap fields in SDKFormProvider, and consume the hook's typed Fields API (no
  direct UI-primitive imports). Head/Preview/Form/Actions subcomponents are inlined.
- useSignEmployeeForm now types Fields explicitly via SignEmployeeFormFieldComponents,
  so Fields.Signature, Fields.ConfirmSignature, Fields.UsedPreparer, and Preparer1-4
  have proper component types in consumers.
- SelectHookField gains a placeholder prop so preparer state selects can be translated.
- docs/hooks/hooks.md adds a Submit Callbacks vs. Return Value subsection: single-
  mutation hooks should rely on HookSubmitResult rather than exposing callback args,
  which matches how SignatureForm/I9SignatureForm now consume actions.onSubmit.
- Revert incidental docs/reference reordering and remove obsolete SignatureForm
  subcomponents.

SDK-774

Made-with: Cursor
… REQUIRED code

Align the Employee DocumentSigner hook's validation surface with useSignCompanyForm:
the confirmation checkbox no longer has a separate CONFIRMATION_REQUIRED error code —
it emits REQUIRED directly when unchecked via z.boolean().refine(val => val, ...).

- signEmployeeFormSchema: drop CONFIRMATION_REQUIRED, use a shared agreeValidator
  (.refine truthiness) for confirmSignature and every preparer agree field, and
  remove the superRefine that only existed to emit the now-redundant code.
- fields: remove ConfirmationValidation; ConfirmSignatureFieldProps and
  PreparerCheckboxFieldProps now use RequiredValidation like the text/select fields.
- Stop re-exporting SignEmployeeFormConfirmationValidation from the hook index and
  the SDK entry point (safe to break — 0.40.0 has not shipped yet).
- SignatureForm / I9SignatureForm: pass only REQUIRED in validationMessages.
- useSignEmployeeForm docs: updated error-code table, fields reference, and every
  usage example to the single-code shape.

SDK-774

Made-with: Cursor
- Revert docs/hooks/hooks.md to main; the "Submit Callbacks vs. Return Value"
  guidance is internal-only and already lives in the migration skill.
- Move migrate-sdk-component-to-hooks skill from .cursor/skills to
  .claude/skills so it lives alongside the other Claude skills.

Made-with: Cursor
The /UNSTABLE_Hooks entry point was removed in 0.40.0; hooks now ship
from the top-level @gusto/embedded-react-sdk. Update all import examples
in the useSignEmployeeForm guide to match.

Made-with: Cursor
…d ready_to_run_payroll

- Add 3-state badge (not_started/in_progress/complete) driven by setup_status with
  fallback to setup_complete for backward compat
- Show "Default tax rates applied" subtext when default_rates_applied is true
- Show secondary "Ready to run payroll" badge when ready_to_run_payroll is true
- Drive CTA label (Start setup / Continue setup / Edit) from setup_status
- Add i18n keys: notStartedBadge, inProgressBadge, startStateTaxSetupCta,
  defaultRatesAppliedText, readyToRunPayrollBadge
- Refactor tests to isolated single-state renders per describe block

Made-with: Cursor
- Add flexWrap prop to Flex component (threaded through responsive custom
  properties) so consumers don't need raw div styles for wrapping layouts
- Replace raw <span> with <Components.Text as="span"> for state name
- Use <Flex flexWrap="wrap"> in status column instead of inline div style

Made-with: Cursor
@serikjensen serikjensen force-pushed the sdk-774-employee-doc-signer-hook branch from 1280f42 to dbc415d Compare April 29, 2026 22:10
@serikjensen serikjensen enabled auto-merge (squash) April 30, 2026 21:37
@serikjensen serikjensen merged commit 9088c95 into main Apr 30, 2026
12 checks passed
@serikjensen serikjensen deleted the sdk-774-employee-doc-signer-hook branch April 30, 2026 21:39
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.

3 participants