61 lines
1.5 KiB
Markdown
61 lines
1.5 KiB
Markdown
# 25. Implement 8-Character Code Validation Flow
|
|
|
|
meta:
|
|
id: podcast-tui-app-25
|
|
feature: podcast-tui-app
|
|
priority: P2
|
|
depends_on: [24]
|
|
tags: [code-validation, auth, sync, solidjs]
|
|
|
|
objective:
|
|
- Create 8-character code input component
|
|
- Implement code validation logic
|
|
- Handle code submission
|
|
- Show validation results
|
|
|
|
deliverables:
|
|
- `src/components/CodeInput.tsx` with code field
|
|
- `src/utils/code-validator.ts` with validation logic
|
|
- `src/components/CodeValidationResult.tsx` with result display
|
|
|
|
steps:
|
|
- Create `src/utils/code-validator.ts`:
|
|
- `validateCode(code: string): boolean`
|
|
- Check length (8 characters)
|
|
- Check format (alphanumeric)
|
|
- Validate against stored codes
|
|
- Create `src/components/CodeInput.tsx`:
|
|
- 8-character code input
|
|
- Auto-formatting
|
|
- Clear button
|
|
- Validation error display
|
|
- Create `src/components/CodeValidationResult.tsx`:
|
|
- Success message
|
|
- Error message
|
|
- Retry button
|
|
- Link to alternative auth
|
|
|
|
tests:
|
|
- Unit: Test code validation logic
|
|
- Unit: Test code input formatting
|
|
- Unit: Test validation result display
|
|
|
|
acceptance_criteria:
|
|
- Code input accepts 8 characters
|
|
- Validation checks length and format
|
|
- Validation results display correctly
|
|
- Error handling works
|
|
|
|
validation:
|
|
- Run application and test code validation
|
|
- Enter valid 8-character code
|
|
- Enter invalid code
|
|
- Test validation error display
|
|
|
|
notes:
|
|
- Code format: alphanumeric (A-Z, 0-9)
|
|
- No real backend validation
|
|
- Store codes in localStorage for testing
|
|
- Link to OAuth placeholder
|
|
- Link to email/password login
|