[Feature]: Add No Results Found Page for Unsuccessful Searches #450
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
fixed:#419
This PR introduces a No Results Found page to handle cases where a search yields no results. The new component provides a user-friendly message, actionable buttons to navigate back or reload, and aligns with the structure and styling of similar components within the project.
Related Issues
Changes Proposed
New Component:
Created a NoResultFound.jsx component that displays:
A sad face icon using react-icons.
User-friendly text for search failures.
Two action buttons: Go Back and Search Again.
Routing & Functionality:
Integrated Next.js useRouter to navigate back with the Go Back button.
Implemented window.location.reload() to reload the page via Search Again button.
Styling:
Used a flex layout for alignment and spacing consistency.
Added hover effects to buttons for better UX.
Checklist
Screenshots
notty.found.mp4
Note to reviewers