Page MenuHomePhabricator

Recent Search UI Display
Closed, ResolvedPublic

Description

Title: Display Recent Searches on Frontend

Description: Fetch and display stored recent searches in a clean, scrollable UI component.

Domain: Design (UI)

Difficulty: Intermediate

Steps:

  1. Build a UI for displaying recent searches.
  2. Connect to the backend recent-search API.
  3. Add a clear button to remove entries.
  4. Test the display on mobile and desktop.

Expected Outcome:
Users see a list of their recent searches and can click to revisit them.

Event Timeline

Sunkanmi12 renamed this task from SCC About Us Page Frontend to Recent Search UI Display.Dec 12 2025, 7:00 PM
Sunkanmi12 updated the task description. (Show Details)
Sunkanmi12 updated the task description. (Show Details)

i have started working on this task.

Mentor note:
This task is currently claimed and in progress by @Maxicov.

To avoid duplicate or overlapping implementations, no additional contributors should work on this task unless explicitly reassigned by a mentor.

Progress and review will be handled under @Maxicov’s implementation

WhatsApp Image 2025-12-15 at 18.29.03_9997bd42.jpg (536×1 px, 83 KB)

for this task, this the desktop view for pulling recent search with a button to clear the entire search and also to remove individual search.

WhatsApp Image 2025-12-15 at 18.30.34_9a294c5f.jpg (747×356 px, 45 KB)

here is the mobile view for pulling recent search

image.png (953×1 px, 427 KB)

  1. this the updated ui for the recent search ui, the recent search appears whhen a user starts typing in the search bar,
  2. each recent search item has a clear button that appears when it is hovered on.
  3. when a recent search is clicked the search functionality is triggered and it searches for that case.

i have completed this task, below is the pull request link, please review the task and approve so i can fill the task completion form

https://github.com/Sunkanmi1/SCC-WEBAPP/pull/22

Mentor final note:
Task reviewed, PR verified, and UI behavior matches requirements.
Approved and resolved.