Project

General

Profile

Actions
Copy link

ClientProject #3269

open

[FE] Not found and 404 page

Added by Nazmul Hossain Shovon 7 months ago. Updated 7 months ago.

Status:
Complete
Priority:
High
Assignee:
Nazmul Hossain Shovon
Target version:
Revamp.v1.1: sprint 04
Start date:
09/17/2025
Due date:
09/17/2025 (about 7 months late)
% Done:

100%

Estimated time:
2:00 h
Spent time:
5:00 h

Description

This PR improves the user experience for "not found" and empty product list scenarios across the app:
404 Page Redesign:

  • Replaces the default Next.js error page with a custom 404 page (Page404) featuring updated font sizes and styles.
  • Adds a breadcrumb and clear navigation options ("Go to homepage" and "Contact us").
  • Font adjustments for better readability on different screen sizes.

Unified NotFound Component:

  • Introduces a reusable NotFound component (with icon) for empty product lists.
  • Replaces previous inline "No products found" messages in all product section components (all-stock, home, korean-stock, stock-list, truck-stock) with the new NotFound component.
  • Ensures consistent design and messaging when no products are available.

How to Test

404 Page:

  • Visit any non-existent route (e.g., /random-url).
  • Confirm the custom 404 page appears with correct fonts, breadcrumb, and navigation buttons.

Empty Product Lists:

  • Use filters or search parameters that yield no results in any product section (e.g., All Stock, Home, Korean Stock, Stock List, Truck Stock).
  • Confirm the new NotFound component displays with the icon, message, and "Go to homepage" button.

Responsiveness:

  • Check both the 404 page and NotFound component on different screen sizes to verify font adjustments and layout.

Navigation:

  • Test the "Go to homepage" and "Contact us" buttons to ensure they route correctly.

Note:
No business logic was changed—only UI/UX for not found states. All previous error handling should remain functional.

Actions
Copy link

Also available in: Atom PDF