VaibhavArora314 / StyleShare

A simple web based platform where users can easily create, explore, and share Tailwind CSS components and designs with fellow users.
https://style-share.vercel.app
MIT License
40 stars 68 forks source link

Feat: Added post search suggestion when search on searchbar successfully issue 586 #591

Closed MeetDOD closed 3 months ago

MeetDOD commented 3 months ago

Pull Request Resolves [ #586 ]

Title: Added post search suggestion when search on searchbar successfully.

Description

  1. In backend, I created the route and controller for getting searchQuery and suggest to user.
  2. In frontend, I am fetching the api in the usePosts and then calling the function in the Posts component.
  3. While writing on the search bar with the help of ul the user can see the dropdown and click on any it will see that posts.
  4. The design is responive and work in both light/dark mode respectively.

Related Issues

Fixes #586

Changes Made

New feature: Added post search suggestion when search on searchbar.

Screenshots

image

Video

https://github.com/user-attachments/assets/efa1c7d5-b06f-419d-90c0-44acb37dbcd7

I certify that I have carried out the relevant code of conduct and provided the requisite screenshot for validation by submitting this pull request.

Thank You for this contribution.

vercel[bot] commented 3 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
style-share ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 10, 2024 9:36am
github-actions[bot] commented 3 months ago

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

MeetDOD commented 3 months ago

@VaibhavArora314 Please give level 3 if possibe after evaluation due to frontend + backend integration 👍

VaibhavArora314 commented 3 months ago

If it's too much then tell me here, I will merge it under level 2.

MeetDOD commented 3 months ago

Currently, a request is sent for every letter typed or removed from the search input. Maybe you can use a setTimeout to call the API after like 300ms and if the user changes something in the search query within those 300ms, then you can clear the previous timeout and set a new timeout for the API call after 300ms. This process of clearing timeout will keep on going on until the user stops changing the search query and then results will be shown.

Nice optimal solution, I am doing it @VaibhavArora314 👍

MeetDOD commented 3 months ago

@VaibhavArora314 Done with the changes as requested 💯

MeetDOD commented 3 months ago

Looks Good, just one minor change when no suggestions available don't show this empty box image

Noted 👍

MeetDOD commented 3 months ago

@VaibhavArora314 Done 💯

VaibhavArora314 commented 3 months ago

Comment axios default baseurl logic

MeetDOD commented 3 months ago

Opps, In hurry I totally forgot about that, my bad :

MeetDOD commented 3 months ago

@VaibhavArora314 please merge my PRS only 2 hours is remaining Thank YOU 👍

VaibhavArora314 commented 3 months ago

@akbatra567 kindly review and merge this as soon as possible

github-actions[bot] commented 3 months ago

🎉 Your pull request has been successfully merged! 🎉 Thank you for your valuable contribution to our project. Your efforts are greatly appreciated. Feel free to reach out if you have any more contributions or if there's anything else we can assist you with. Keep up the fantastic work! 🚀