Repository navigation
Replace ErrorText with StatusText for form validation states #244
Description
Problem
FormInput has validateStatus with 4 states but only ErrorText component:
type ValidateStatus = "default" | "error" | "success" | "warning"
// Current implementation (line 69-76):
validateStatus === "error" ? (
<ErrorText showIcon>{helpText}</ErrorText>
) : (
<ExtraText>{helpText}</ExtraText> // Used for success, warning, default
)Issues:
- Success/warning messages use ExtraText (no icon, wrong styling)
- ErrorText name doesn't fit success/warning semantics
- Inconsistent UX across validation states
Proposal: StatusText
<StatusText
status={validateStatus} // error | success | warning | default
showIcon={validateStatus !== "default"}
>
{helpText}
</StatusText>Benefits:
- Icons for all validation states (✓ success, ⚠ warning, ✗ error)
- Proper colors per status
- Single component for all form validation
- Consistent with validateStatus naming
@BleedingDev Should we implement this?
---Files: libs/ui/src/molecules/form-input.tsx (line 69-76)
Reacted by coderabbitai
Activity
coderabbitai commentedon Dec 23, 2025
📝 CodeRabbit Plan Mode
Generate an implementation plan and prompts that you can use with your favorite coding agent.
Examples
🔗 Similar Issues
Related Issues
👤 Suggested Assignees
🧪 Issue enrichment is currently in open beta.
You can configure auto-planning by selecting labels in the issue_enrichment configuration.
To disable automatic issue enrichment, add the following to your
.coderabbit.yaml:💬 Have feedback or questions? Drop into our discord or schedule a call!
BleedingDev commentedon Dec 25, 2025
I like it, let's do it. :)