Skip to content

Add client-side validation to the member profile summary edit form #238

Description

@Lakes41

Difficulty: Intermediate | Type: Bug / Feature

Background: The member dashboard includes a "profile summary," implying some editable profile fields exist alongside the read-only membership/tier data.

Problem: Without documented client-side validation, malformed input (e.g. overly long bio text, invalid URL in a social link field) could be submitted and only rejected server-side with an unclear error, or worse, accepted without any length/format constraints.

Expected Outcome: The profile edit form validates field formats/lengths client-side before submission, showing inline errors, while still gracefully surfacing any server-side validation errors that slip through.

Suggested Implementation: Add a schema (e.g. zod) describing the profile fields' constraints, wire it into the edit form with inline error rendering, and map any server-returned validation errors onto the same fields.

Acceptance Criteria:

  • Invalid input is caught client-side with a clear inline message before any network request.
  • Server-side validation errors (if any) still render correctly, not just client ones.
  • Covered by a test for at least one invalid and one valid submission.

Likely Affected Files/Directories: app/(member)/*, lib/api/live.ts, components/

Labels: feature, bug, GrantFox OSS, Maybe Rewarded, Official Campaign | FWC26

Metadata

Metadata

Assignees

Labels

GrantFox OSSGrantFox Open Source Sponsorship program tagMaybe RewardedIssue may qualify for a reward upon successful completion per campaign rulesOfficial Campaign | FWC26Official FWC26 campaign issue — eligible for campaign scoring and rewardsbugConfirmed defect or incorrect behavior that needs to be fixedfeatureNew feature, enhancement, or functional addition

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions