Is your feature request related to a problem? Please describe.
Currently, on the landing page, users have a list of their "Recent Searches" displayed as pill buttons. However, if a user wants to remove an item from their history, their only option is to click the global "Clear" button, which wipes the entire search history. It would be a much better user experience to allow users to remove individual recent searches without losing all of them.
Current Behavior
Recent searches are stored in localStorage and managed by the useRecentSearches hook.
The UI in app/page.tsx only offers a "Clear" button that resets the entire array to [].
Describe the solution you'd like
Each recent search pill should have a small 'x' (or similar delete icon) next to it.
Clicking this icon should remove only that specific username from the history and update localStorage accordingly.
The "Clear" button should remain for bulk deletion.
Proposed Solution
Update the Hook (hooks/useRecentSearches.ts): Add a new function removeSearch(query: string) that filters out the specified query from the searches state array and updates the localStorage.
Update the UI (app/page.tsx): Modify the recent search buttons (around line 283) to include a delete icon (e.g., using lucide-react's X icon). Hook this button up to the new removeSearch function.
Describe alternatives you've considered
No response
Is your feature request related to a problem? Please describe.
Currently, on the landing page, users have a list of their "Recent Searches" displayed as pill buttons. However, if a user wants to remove an item from their history, their only option is to click the global "Clear" button, which wipes the entire search history. It would be a much better user experience to allow users to remove individual recent searches without losing all of them.
Current Behavior
Recent searches are stored in localStorage and managed by the useRecentSearches hook.
The UI in app/page.tsx only offers a "Clear" button that resets the entire array to [].
Describe the solution you'd like
Each recent search pill should have a small 'x' (or similar delete icon) next to it.
Clicking this icon should remove only that specific username from the history and update localStorage accordingly.
The "Clear" button should remain for bulk deletion.
Proposed Solution
Update the Hook (hooks/useRecentSearches.ts): Add a new function removeSearch(query: string) that filters out the specified query from the searches state array and updates the localStorage.
Update the UI (app/page.tsx): Modify the recent search buttons (around line 283) to include a delete icon (e.g., using lucide-react's X icon). Hook this button up to the new removeSearch function.
Describe alternatives you've considered
No response