Client » PQS_Japan

Changes Overview

1. Contact Form Enhancements
   Description : Improved validation for the contact form in EnquireModal using stricter Zod schemas for fields (name, city, port, country, mobile, message). Added a loading spinner component for port loading feedback. Removed Viber contact option from header data.
   Testing Instructions:

• Open the EnquireModal (e.g., via a "Contact Us" or "Enquire" button).
• Test form validation by submitting with invalid inputs (e.g., empty name, invalid mobile number, or missing required fields). Verify error messages display clearly.
• Check that a loading spinner appears when selecting a port.
• Confirm the Viber contact option is no longer present in the header.

2. Filter Component Improvements
   Description : Enhanced filter functionality by disabling search/reset buttons and showing error messages when min values exceed max for price, mileage, or engine CC. Standardized font sizes (text-xs md:text-sm) for filter labels and inputs. Added a loading spinner for model loading in FilterOptions.tsx. Introduced showCount prop to FilterCombobox for flexible count display.
   Testing Instructions:

• Navigate to the filter section (e.g., vehicle search page).
• Test invalid filter inputs (e.g., set min price higher than max price) and verify error messages appear and buttons are disabled.
• Check that font sizes for filter labels and inputs are consistent across mobile and desktop views.
• Select a model in the filter and confirm a loading spinner appears during model loading.
• Verify the showCount prop in FilterCombobox displays or hides counts as expected.

3. Number Formatting with prettyNumber Utility
   Description : Updated the prettyNumber utility for robust number formatting and applied it to filter/model counts and all price displays across product components and filters for consistent thousand separators.
   Testing Instructions:

• Check price displays in product listings, filters, and sidebars to ensure consistent formatting with thousand separators (e.g., 1,000,000 instead of 1000000).
• Verify filter and model counts in the sidebar and filter components use the same formatting.

4. Header and Footer Updates
   Description : Added a staticPages array in header.ts and rendered these links in the header's top section. Refactored header links and submenu items for clarity. Hid the footer's TopSection component (commented out).
   Testing Instructions:

• Verify new static page links appear in the header's top section and navigate correctly.
• Check that header links and submenus are organized clearly and function as expected.
• Confirm the footer's TopSection is not visible on any page.

5. Download API and Button Enhancements
   Description : Updated the download API endpoint in DownloadButton.tsx and adjusted the download logic in the API route.
   Testing Instructions:

• Locate a DownloadButton (e.g., on a product or resource page).
• Click the button and verify the file downloads correctly via the updated API endpoint.
• Test edge cases (e.g., no file available) to ensure proper error handling.

6. UI/UX and Accessibility Improvements
   Description : Updated UI text (e.g., "Specification" to "SPECIFICATIONS"). Adjusted spacing, button sizes, and placeholder text in filter components. Added explicit elements to required fields in EnquireModal for better accessibility. Applied minor tweaks to car details and specifications components for font weight and layout consistency.
   Testing Instructions:

• Verify text changes (e.g., "SPECIFICATIONS" in car details or relevant sections).
• Check filter components for consistent spacing, button sizes, and placeholder text.
• Test EnquireModal with a screen reader to confirm required fields are properly marked and accessible.
• Inspect car details and specifications components for consistent font weights and layout.

7. Code Cleanup and Minor Tweaks
   Description : Performed minor code cleanup and UI/UX tweaks for improved maintainability and user experience.
   Testing Instructions:

• Review code changes in the commit for cleanliness and adherence to project standards.
• Test affected components (e.g., filters, modals) to ensure no regressions in functionality or UI.