feature added minimum password strength validation to signup form

[YamiNo-Okami]

Description

Summary

Enhanced the signup form with password strength validation to improve account security for the medical diagnostic platform. Users are now required to create passwords that meet minimum security standards before registration can proceed.

closes : #20

Changes Made

• Minimum Password Length: Enforces 8-character minimum
• Numeric Digit Requirement: Requires at least one digit (0-9) in password
• Real-Time Validation: Live feedback as user types with useMemo optimization
• Visual Indicators:
  • Password field borders change color (gray → green when valid, red when invalid)
  • Background color changes (green-50 for valid, red-50 for invalid)
• Inline Requirement Display: Shows checkmarks/X marks for each requirement with current character count
• Form Submission Prevention: Sign Up button remains disabled until all requirements are met
• Error Feedback: Clear error message if user attempts submission with weak password

Files Modified

• page.tsx

Technical Details

• Added PasswordValidation TypeScript interface for type safety
• Implemented validation logic with regex for digit checking
• Used React useMemo hook to prevent unnecessary re-renders
• Maintained existing Tailwind CSS styling with conditional classes
• Preserved all accessibility attributes (aria-labels, proper form semantics)

Testing Instructions

1. Navigate to the signup page (/auth/signup)
2. Test password field validation:
   • Try password with <8 characters → invalid (red)
   • Try password with 8+ characters but no digits → invalid (red)
   • Enter "Password1" → valid (green), button enabled
   • Delete a character → invalid (red), button disabled
3. Verify form submission is blocked with invalid password
4. Verify successful signup with valid password meeting all requirements

Related video

Screen.Recording.2026-06-02.005705.mp4

[vercel]

@YamiNo-Okami is attempting to deploy a commit to the Pushkarini 's projects Team on Vercel.

A member of the Team first needs to authorize it.