- 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
- Replace hardcoded centerFrames array with CMS data from features.cards
- Update hero section to use CMS data for title, description, button text and link
- Migrate features section title and description from hardcoded text to CMS
- Replace hardcoded challenges section with dynamic CMS data for title, description and cards
- Update advantages section to use CMS data for title and cards
- Normalize CMS field names from PascalCase to snake_case (Title → title, ButtonLink → button_link, etc.)
- Replace Image component with ImageWithFallback for better error handling on dynamic images
- Add unoptimized prop to images to support dynamic CMS image URLs
- Remove 29 lines of hardcoded content, making the page fully data-driven from CMS
- 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
- Implemented CmsContext and CmsProvider for global state management of CMS data.
- Created a custom hook `useGetCms` to fetch CMS data using React Query.
- Defined TypeScript interfaces for CMS response and its related data structures.
- Added error handling for data fetching in both the service and context.
This commit introduces two UI enhancements to the marketing page to improve user experience and visual appeal.
- Adds a hover effect to the feature cards, causing them to scale up and change background color. This provides visual feedback and makes the section more interactive.
- Adjusts the main heading font size to be responsive, making it smaller on mobile devices (`text-4xl`) and larger on medium screens and up (`md:text-5xl`) for better readability and layout.
Refactors the styling across the main layout, homepage, and contact page to improve responsiveness and visual consistency.
Key changes include:
- Adjusted font sizes, spacing, and padding on the homepage for better scaling on different screen sizes.
- Simplified the hero section image and layout.
- Updated the footer design, removing the background image and changing text color from white to black for better readability.
- Replaced React fragments with `<main>` tags for improved semantic HTML on the contact page.
- Streamlined header and content padding in the main layout.
The previous `md` breakpoint (768px) caused the desktop layout to activate too early, resulting in a cramped appearance on tablet-sized screens.
This commit updates the responsive design by changing the primary breakpoint from `md` to `lg` (1024px) across the home page, contact page, and main layouts. This change ensures a more appropriate and visually balanced layout is maintained on medium-sized devices, improving the overall user experience.
This commit updates the page metadata (title and description) from the default Next.js placeholders to be descriptive of the Opp lens application, improving SEO.
Additionally, it refactors the HTML structure for better semantics and accessibility:
- Replaced generic `div` and fragment tags with appropriate semantic elements like `main`, `article`, `li`, and `small`.
- Corrected the heading hierarchy for better document structure.
- Fixed image source paths by making them absolute to prevent broken images.
This commit refactors the contact form for better reusability and moves it from the global footer to a dedicated section on the homepage. Additionally, it enhances the user experience on the 404 page.
Key changes:
- The `ContactUsForm` component is now configurable with props for grid layout (`columnsPerRow`) and button text, making it more versatile.
- The contact form has been removed from the shared footer in the main layout and is now explicitly included only on the homepage.
- The 404 "Not Found" page has been updated to include a direct link to the homepage for easier navigation.
- Minor style adjustments were made to the 404 page layout and input field padding for improved visual consistency.
AmirReza Jamali