personal-projects/personal-portfolio
Template
1
1
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

[Sprint 10] feat: Add contact form validation and UX polish #94

New Issue
Open
opened 2026-02-01 18:18:24 +00:00 by lmiranda · 0 comments
lmiranda commented 2026-02-01 18:18:24 +00:00
Owner
Copy Link

Overview

Add client-side validation, required field indicators, and form clearing after successful submission.

Files to Modify

  • portfolio_app/pages/contact.py
  • portfolio_app/callbacks/contact.py

Acceptance Criteria

  • Required fields marked with asterisk (Name, Email, Message)
  • Email field validates format before submission
  • Error feedback shown for validation failures
  • Form fields clear after successful submission
  • Submit button disabled while loading
  • End-to-end test: form submits successfully to Formspree

Technical Notes

  • Use DMC's required=True and error props for validation feedback
  • Email validation: basic regex or use email-validator library
  • Reset form by returning empty strings to component values
  • Test with real Formspree endpoint to verify integration

Labels

type/enhancement scope/frontend priority/medium size/S

Dependencies

Depends on Issue #93 (callback must exist first)

## Overview Add client-side validation, required field indicators, and form clearing after successful submission. ## Files to Modify - `portfolio_app/pages/contact.py` - `portfolio_app/callbacks/contact.py` ## Acceptance Criteria - [ ] Required fields marked with asterisk (Name, Email, Message) - [ ] Email field validates format before submission - [ ] Error feedback shown for validation failures - [ ] Form fields clear after successful submission - [ ] Submit button disabled while loading - [ ] End-to-end test: form submits successfully to Formspree ## Technical Notes - Use DMC's `required=True` and `error` props for validation feedback - Email validation: basic regex or use email-validator library - Reset form by returning empty strings to component values - Test with real Formspree endpoint to verify integration ## Labels `type/enhancement` `scope/frontend` `priority/medium` `size/S` ## Dependencies Depends on Issue #93 (callback must exist first)
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
Complexity/Complex
High uncertainty or many dependencies
 Complexity/Medium
Some unknowns or dependencies
 Complexity/Simple
Straightforward, well-understood
 Effort/L
3-5 days
 Effort/M
1-2 days
 Effort/S
2-4 hours
 Effort/XL
> 1 week
 Effort/XS
< 2 hours
 Priority/Critical
Immediate attention required
 Priority/High
Important, needs attention soon
 Priority/Low
Nice to have, can wait
 Priority/Medium
Normal priority
 Type/Bug
Something isn't working
 Type/Chore
Maintenance tasks
 Type/Documentation
Documentation improvements
 Type/Feature
New feature or request
 Type/Refactor
Code refactoring without changing behavior
 Type/Test
Testing related
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
lmiranda
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: personal-projects/personal-portfolio#94
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?