Increase test to 100% Coverage for src/pages/admin&public queue page

Issue Summary

Increase Code Coverage for src/admin/pages to 100%

Description: The admin pages module had incomplete test coverage, with several uncovered lines and branches in AssignRolesPage, ManageMedicalCampsPage, and ManageMedicinesPage. This issue tracks the effort to achieve 100% statement and line coverage, and maximize branch coverage for all admin page components.

Problem Statement

Current State: Initial coverage report showed uncovered lines and branches: - AssignRolesPage.tsx: 90.66% lines, 67.3% branches - ManageMedicalCampsPage.tsx: 95.91% lines, 79.48% branches - ManageMedicinesPage.tsx: 90.41% lines, 76% branches

 - Impact: Untested code paths could contain bugs that go undetected, reducing confidence in the admin functionality for role management, medical camp management, and medicine
   inventory.

 - Affected Users: Admin users who manage roles, medical camps, and medicine inventory

Proposed Solution

Add targeted unit tests to cover all uncovered lines and branches: - Test error handling paths (onError callbacks) - Test conditional rendering branches (isPending states, null/undefined values) - Test user input handlers (onChange, onKeyDown) - Test filter logic branches (stock filters) - Test optimistic update scenarios

Test-Driven Development

Acceptance Criteria (Given-When-Then)

Test-Driven Development

Acceptance Criteria (Given-When-Then)

Scenario 1: AssignRolesPage Coverage

 1 Given the AssignRolesPage component is rendered
 2   And a user search has been performed
 3  When role assignment is initiated and mutation completes
 4  Then success alert should be shown
 5   And dialog should close
 6   And users list should be refetched

Scenario 2: AssignRolesPage Error Handling

 1 Given the AssignRolesPage component is rendered
 2   And a user search has been performed
 3  When role assignment fails with an error
 4  Then error alert should be shown with appropriate message
 5   And dialog should close

Scenario 3: ManageMedicalCampsPage Filter Logic

 1 Given the ManageMedicalCampsPage is loaded with camp data
 2  When the stock filter is changed to "Low Stock"
 3  Then only camps with quantity > 0 AND quantity < 10 should be displayed

Scenario 4: ManageMedicinesPage Mutation States

 1 Given the ManageMedicinesPage dialog is open
 2   And the user fills in all required fields
 3  When the submit button is clicked
 4  Then the button should show "Saving..." text while mutation is pending
 5   And the button should be disabled

Test Cases

Test Case ID	Test Description	Precondition	Test Steps	Expected Result	Priority
TC-01	Role assignment success	User searched and displayed	1. Click "Assign Role" button 2. Confirm in dialog	Success alert shown, dialog closes	High
TC-02	Role assignment error	User searched and displayed	1. Click "Assign Role" button 2. Confirm with mocked error	Error alert shown with message	High
TC-03	Role removal cancel (not pending)	Remove dialog open	1. Click cancel before confirming	Dialog closes	High
TC-04	Role removal cancel (pending)	Remove dialog open, mutation started	1. Click cancel while request is pending	Dialog stays open	High
TC-05	Search with Enter key	Search input focused	1. Type search query 2. Press Enter	Search executed	Medium
TC-06	Unknown role badge fallback	User with unknown role displayed	1. View user card	Fallback color applied	Medium
TC-07	Medical camp validation error	Create dialog open	1. Fill only date 2. Leave location empty 3. Click Submit	Error alert shown	High
TC-08	Medical camp update error	Edit dialog open	1. Modify field 2. Click Update with mocked error	Error alert shown	High
TC-09	Medicine Low Stock filter	Medicines with various stock levels loaded	1. Change filter to "Low Stock"	Only low stock medicines displayed	High
TC-10	Medicine type selection	Add medicine dialog open	1. Change type dropdown	Form data updated	Medium
TC-11	Medicine quantity NaN handling	Add medicine dialog open	1. Enter invalid quantity	Value defaults to 0	Medium
TC-12	Mutation pending state	Any form dialog open	1. Submit form	Button shows "Saving..."	High

Unit Test Requirements

Module/Component	Function/Hook	Test Cases to Cover
src/pages/admin/AssignRolesPage.tsx	assignRoleMutation, removeRoleMutation	TC-001, TC-002, TC-003, TC-004
src/pages/admin/AssignRolesPage.tsx	cancelAssignRole, cancelRemoveRole	TC-003, TC-004
src/pages/admin/AssignRolesPage.tsx	handleSearch, onKeyDown	TC-005
src/pages/admin/AssignRolesPage.tsx	getRoleBadge	TC-006
src/pages/admin/ManageMedicalCampsPage.tsx	handleSubmit	TC-007
src/pages/admin/ManageMedicalCampsPage.tsx	updateMutation	TC-008
src/pages/admin/ManageMedicalCampsPage.tsx	attended_patients onChange	TC-007
src/pages/admin/ManageMedicinesPage.tsx	filteredAndSortedMedicines	TC-009
src/pages/admin/ManageMedicinesPage.tsx	medicine_type onChange	TC-010
src/pages/admin/ManageMedicinesPage.tsx	initial_quantity onChange	TC-011
src/pages/admin/ManageMedicinesPage.tsx	createMutation, updateMutation	TC-012

Test Assertions Required:

Renders correctly with initial state
Handles user input correctly
Validates input and shows errors
Calls API with correct payload
Handles loading state
Handles success response
Handles error response
Updates UI state appropriately

Implementation Details

Files to Change

┌─────────────────────────────────────────────┬────────┬───────────────────────┐
│ File Path                                   │ Action │ Purpose               │
├─────────────────────────────────────────────┼────────┼───────────────────────┤
│ tests/admin/AssignRolesPage.test.tsx        │ Modify │ Add 18 new test cases │
│ tests/admin/ManageMedicalCampsPage.test.tsx │ Modify │ Add 9 new test cases  │
│ tests/admin/ManageMedicinesPage.test.tsx    │ Modify │ Add 10 new test cases │
└─────────────────────────────────────────────┴────────┴───────────────────────┘

Technical Considerations

Use vi.mock() for API dependencies
- Use QueryClient for React Query state management
- Test optimistic updates by mocking setQueryData
- Test isPending state by returning unresolved Promises
- Use waitFor for async assertions

UI/UX Requirements

No UI changes required. Tests verify existing behavior: - Dialog states (open/close) - Button text changes (Create/Update, Add/Update, Saving...) - Loading spinners - Alert messages - Filter dropdown behavior

Mockups/Wireframes:

Testing Strategy

Manual Testing

Test Environment:
 - Browser: Chrome (latest)
 - Viewport: Desktop (1920x1080)
 - User Role: Admin

Manual Test Steps:
 1. Navigate to Admin > Assign Roles
 2. Search for a user
 3. Assign and remove roles
 4. Verify success/error messages
 5. Navigate to Admin > Medical Camps
 6. Create/Edit camps
 7. Navigate to Admin > Medicines
 8. Filter by stock status
 9. Add/Edit medicines

Automated Testing

Unit Tests:

Component render tests
User interaction tests
API integration tests
Error handling tests

Integration Tests (if applicable):

Multi-component interaction tests
Route navigation tests

Test Data Requirements

   const mockUsers = [
     {
       id: '1',
       user_name: 'John Doe',
       user_phone_no: '1234567890',
       user_email: '[email protected]',
       roles: ['volunteer'],
     },

Definition of Done

Additional Context

Related Issues

Related Issues

 - Blocks: None
 - Blocked by: None
 - Related to: Overall code coverage improvement initiative

References

 - Coverage report: npm run test:coverage

Notes

Branch Coverage Limitation: AssignRolesPage branch coverage (88.46%) is limited by v8's handling of optional chaining (oldUsers?.map()). These branches are inherently untestable because: 1. The mutation only runs after the query completes successfully 2. oldUsers will always have data when the mutation executes 3. The optional chaining is a defensive pattern for edge cases that cannot occur in normal operation

All functional paths and user-facing behavior are fully tested.

Edited Mar 21, 2026 by Suma Pullaiahgari