- Add validation rules for form fields with XSS protection
- Create API error handler to parse and manage server validation errors
- Integrate validation rules into contact and inquiries forms
- Enhance error handling with user feedback for form submissions
- Introduce unit tests for validation and error handling functionalities
- Add sanitize.ts utility module with sanitizeText(), sanitizeUrl(), and sanitizeHtml() functions
- Implement server-side HTML entity escaping and client-side DOMPurify sanitization
- Add comprehensive test suite for sanitization functions in lib/__tests__/sanitize.test.ts
- Secure marketing pages by sanitizing all CMS data (hero, features, challenges, advantages, footer)
- Secure inquiries form by sanitizing field labels, placeholders, and button text
- Add SECURITY.md documentation outlining XSS protection measures and best practices
- Add USAGE_EXAMPLES.md with detailed examples of sanitization function usage
- Add XSS_PROTECTION_SUMMARY.md with implementation overview
- Update package.json to include dompurify (^3.3.0) dependency
- Protects against common XSS attack vectors including script injection, event handlers, and malicious URLs
- Update Title field reference to title in contact form heading
- Update Description field reference to description in contact form subtitle
- Align with existing snake_case naming convention established in CMS data types
- Ensure consistency across all configurable form fields
- Convert field property names from PascalCase to snake_case (Name → name, Label → label, Placeholder → placeholder, Required → required)
- Update contactData property access from PascalCase to snake_case (Fields → fields, SubmitButtonText → submit_button_text)
- Update all field references throughout the component to use new snake_case naming convention
- Maintain consistency with standardized CMS data types established in previous refactoring
- Add CmsContact type support to FooterForm, Inquires, and InquiresForm components
- Make form fields dynamic by accepting contactData prop with configurable Fields array
- Add placeholder prop to InputGroup component for enhanced field customization
- Replace hardcoded form fields with dynamic field mapping from CMS data
- Support dynamic form title and description from contactData
- Use CMS-provided submit button text with fallback to default "Submit"
- Implement field-level validation configuration including required field handling
- Auto-detect input type based on field name (email, phone, text)
- Pass contact data from marketing page to FooterForm component
- Maintain backward compatibility with default fields when contactData is not provided
This commit refactors the contact form into a more robust inquiries form, relocating it from `/contact-us` to a new `/inquires` route.
Key changes include:
- Renamed and moved the component from `ContactUs` to `Inquires`.
- Updated form fields: removed "Company Name", added "Message", and renamed "Work Email" and "Phone Number" for clarity.
- Implemented comprehensive client-side validation for all fields using `react-hook-form`.
- Added a loading state to the submit button to provide user feedback during submission.
- The form now automatically resets upon successful submission.
- Introduced new reusable `TextareaGroup` and `Loading` components to support the enhanced form functionality.
AmirReza Jamali