Skip to content

Admin/object errors

DALIBOINA SATISH requested to merge admin/object-errors into develop

Overview

This MR fixes multiple incorrect i18n key usages across the application where translation keys were returning objects instead of strings. These issues caused broken UI labels and incorrect text rendering.

The change ensures that all translation keys resolve to proper string values, improving UI consistency and user experience.

What does this MR do and why?

Several components were using incorrect or incomplete i18n keys (e.g., t('common.type'), t('common.all')), which map to nested objects in the translation files instead of string values.

Motivation:

  • Fix broken UI labels caused by incorrect translations
  • Ensure consistent and correct usage of i18n keys
  • Improve maintainability of translation structure

Approach:

  • Replaced incorrect keys with proper nested keys that return strings
  • Avoided accessing object-level keys directly
  • Used a literal fallback ("All") where necessary

Trade-offs:

  • Temporary hardcoded fallback used for "All" (can be externalized later if needed)

Changes Made

  • Fixed incorrect translation keys across multiple components
  • Updated nested i18n key references
  • Replaced object-returning keys with string-returning keys

Files Modified:

  • QueueDisplay.tsx
  • ManageMedicinesPage.tsx
  • VerifyMedicinesPage.tsx
  • ManageMedicalCampsPage.tsx

Technical Details

Root Cause:

  • i18n keys like common.type, common.all, common.expected, etc., point to objects in translation JSON instead of strings.

Fix:

  • Updated keys to specific nested paths:

    • common.all.specializations → common.allSpecializations
    • common.type → common.medicine.type
    • common.expected → common.expected.patients
    • common.attended → common.attended.patients

  • Replaced common.all with "All" as fallback

This ensures t() always returns a string.

Type of Change

  • 🐛 Bug fix (non-breaking change that fixes an issue)
  • ✨ New feature (non-breaking change that adds functionality)
  • 💥 Breaking change
  • 📝 Documentation update
  • 🎨 UI/UX improvement
  • ♻️ Refactor
  • ⚡ Performance improvement
  • 🧪 Test update
  • 🔧 Configuration change
  • 🚨 Security fix

Related Issues / References

  • Fixes i18n key issues causing UI rendering problems

Screenshots or Screen Recordings

Before After
Incorrect / undefined labels Proper translated strings displayed

How to Set Up and Validate Locally

  1. Checkout this branch

  2. Install dependencies:

    npm install

  3. Run the app:

    npm run dev

  4. Navigate to:

    • Queue Display page
    • Manage Medicines page
    • Verify Medicines page
    • Manage Medical Camps page

  5. Verify:

    • Labels display correct text
    • No object values rendered
    • No console errors

Testing Done

  • Manual testing completed
  • Unit tests added/updated

Test Cases Covered:

Scenario Expected Result Status
Queue specialization label Correct string displayed ✅
Medicine type label Correct string displayed ✅
Verify medicine type Correct string displayed ✅
"All" filter label Displays "All" ✅
Expected/Attended labels Correct strings displayed ✅

Code Quality Checklist

Code Standards

  • Code follows project conventions
  • No console logs
  • No unused code
  • No duplicate code
  • i18n check passed (except temporary fallback)
  • Proper TypeScript usage
  • ESLint/Prettier passed

React Best Practices

  • Components follow single responsibility
  • Hooks used correctly
  • No unnecessary re-renders

Component Patterns

  • Tailwind used correctly
  • Responsive behavior maintained
  • Accessibility unaffected

API & Data Fetching

  • No API changes involved

Error Handling

  • No new errors introduced
  • UI renders safely

Documentation

  • No documentation changes required

Known Limitations / Technical Debt

  • "All" is currently hardcoded instead of using i18n
  • Can be improved by adding a proper translation key later

Additional Notes

  • This fix standardizes i18n usage across components
  • Prevents similar issues in future by encouraging correct key usage
  • No backend changes required

MR Acceptance Checklist

  • Changes are minimal and focused
  • No risk to existing functionality
  • Improves UI consistency
  • Ready for review

Merge request reports