Skip to content

Search Input State Not Reset After Submission

srilatha bandari requested to merge feat/search-input-reset into develop

Overview

This MR fixes the volunteer search flow so that when a user enters a volunteer search value, moves forward in the flow, and then navigates back to the volunteer search screen, the previous volunteer search state does not persist.

A volunteer-specific reset handler was added following the same pattern as resetToBookSearch, ensuring the volunteer flow returns to a clean search state and avoids showing stale input, selected data, errors, or previous result/detail state.

What does this MR do and why?

  • Adds a volunteer search reset handler to clear volunteer-specific search state when navigating back.
  • Previously, volunteer search state could remain populated after moving forward and returning, causing stale input, selection, errors, or previous results to appear.
  • The new reset handler keeps the behavior consistent with the existing resetToBookSearch flow for patients/books.
  • Implementation is minimal, scoped only to volunteer-related files, aligned with existing code style and UI state handling patterns.

Changes Made

  • Modified volunteer-related page/search flow files only.
  • Added volunteer reset handler similar in style to resetToBookSearch.
  • Clears:
    • Volunteer search input value
    • Selected volunteer/search result state
    • Volunteer search error state
    • Volunteer dropdown/results/detail visibility state
  • Returns the volunteer UI to the initial search view state.

Technical Details

Root Cause: Volunteer flow did not reset local search-related state when navigating back, leaving previous input and selection in memory.

Related Issues / References

Related issue: Search Input State Not Reset After Submission Branch: fix/search-input-reset #224 (closed)

Screenshots

image image image

Before After
Search input retained the previously entered book number after submission Search input automatically clears after submission
Users had to manually delete the previous value Users can directly enter a new book number
Slower workflow during patient lookup Faster and smoother patient lookup process

Install dependencies:

npm install

Run the development server:

npm run dev

Verify: -Navigate to the patient search / book number lookup section -Enter a book number in the search input -Click Check / Submit -Confirm that the patient lookup works correctly -Verify that the search input field is cleared automatically after submission

Testing Done Manual testing completed Unit tests added/updated

Scenario Expected Result Status
Enter book number and submit Patient lookup works correctly
Submit input Input field resets automatically
Enter new book number No need to manually clear previous value

Code Quality Checklist

Code Quality Checklist

  • Code follows conventions
  • No console.log/debugger statements
  • No unused imports/variables/functions
  • No duplicate code
  • i18n check passed
  • TypeScript types properly defined
  • ESLint/Prettier checks pass:

React Best Practices

-Components are properly split and single-responsibility -Hooks follow rules -State management is appropriate -No unnecessary re-renders -Event handlers are properly cleaned up

Component Patterns Tailwind classes follow utility-first approach Responsive design considered Accessibility attributes included

API & Data Fetching Existing functionality unchanged

Error Handling No new errors introduced

Documentation

README.md updated .env.example updated CHANGELOG.md updated

Edited by srilatha bandari

Merge request reports

Loading