BN-70 | Add. Custom Logic For Date Distance Calc And Disabling Existing Conditions Being Selected

[rahu1ramesh]

Card BN-69

JIRA → BN-69

Description

This PR introduces several enhancements and fixes across the Conditions and Diagnoses forms and date utilities. Key updates include improved validation for condition duration, better handling of existing diagnoses when adding them as conditions, and significant refactoring of the Conditions display tables for better maintainability and accessibility.

---

Key Features

• Enhanced Diagnosis to Condition Conversion: The "Add as condition" link in SelectedDiagnosisItem now dynamically updates its text and disabled state based on whether the diagnosis already exists as a condition (either in the current form or in the patient's existing conditions).
• Condition Duration Input Validation: The duration input in SelectedConditionItem is now limited to a maximum value of 999, preventing invalid entries.
• Accessible Tables: ExpandableDataTable now includes an aria-label for its expand/collapse column, improving screen reader support.
• Refined Date Formatting: The formatDateDistance utility now provides more precise formatting for durations in years and months (e.g., "1.6 years") and improved rounding for longer durations.
• Comprehensive Testing: Updated and expanded unit and integration tests for SelectedDiagnosisItem, AllergiesTable, and ConditionsTable to ensure robustness, cover new features, and verify accessibility compliance.

---

Implementation Details

• UI Components

  • src/components/clinical/forms/conditionsAndDiagnoses/ConditionsAndDiagnoses.tsx:
    • Integrated useConditions hook to fetch existing patient conditions.
    • Implemented logic to check if a diagnosis is already an existing condition.
    • Dynamically updated "Add as condition" link text and disabled state based on existence check.
  • src/components/clinical/forms/conditionsAndDiagnoses/SelectedConditionItem.tsx:
    • Added numValue <= 999 validation to the duration input.
    • Simplified itemToString logic for duration unit dropdown.
  • src/components/common/expandableDataTable/ExpandableDataTable.tsx: Added aria-label to TableExpandHeader for accessibility.
  • src/displayControls/allergies/AllergiesTable.tsx and src/displayControls/conditions/ConditionsTable.tsx:
    • Removed renderExpandedContent prop and associated logic, simplifying the table structure.
    • Set isOpen={true} prop to ensure tables are expanded by default.

• Custom Hooks

  • useConditions: Utilized in SelectedDiagnosisItem to check for existing conditions.

• API Integration

  • No direct API changes

• Performance & Optimization

  • Memoization of formatted conditions in ConditionsTable and AllergiesTable is implicitly handled by ExpandableDataTable and React's rendering lifecycle.
  • The removal of renderExpandedContent simplifies rendering logic.

• Internationalisation

  • public/locales/locale_en.json and public/locales/locale_es.json:
    • Updated CONDITIONS_ADD_AS_CONDITION text.
    • Added DIAGNOSES_ALREADY_ADDED_AS_CONDITION for disabled link text.
    • Added TABLE_EXPAND_COLUMN_ARIA_LABEL for table accessibility.

• Accessibility

  • SelectedDiagnosisItem: aria-disabled attribute added to the "Add as condition" link.
  • ExpandableDataTable: aria-label added to the expand/collapse column header.
  • Comprehensive jest-axe tests added to SelectedDiagnosisItem.test.tsx, AllergiesTable.test.tsx, and ConditionsTable.test.tsx to ensure WCAG compliance for various states (loading, error, empty, data-filled).

• Limitations

  • None explicitly introduced by these changes.

---

Testing & Type Definitions

• Unit Tests

  • src/components/clinical/forms/conditionsAndDiagnoses/__tests__/SelectedDiagnosisItem.test.tsx:
    • Added tests for loading state (DataTableSkeleton).
    • Extensive tests for the "Add as condition" link's dynamic text and disabled state based on doesConditionExist prop and useConditions hook.
    • Tests for onMarkAsCondition being called only when the link is enabled.
    • Updated snapshots to reflect new UI states.
  • src/components/clinical/forms/conditionsAndDiagnoses/__tests__/SelectedConditionItem.test.tsx:
    • Updated duration input validation tests to reflect the numValue <= 999 limit.
    • Removed redundant positive number test.
  • src/displayControls/allergies/__tests__/AllergiesTable.test.tsx and src/displayControls/conditions/__tests__/ConditionsTable.test.tsx:
    • Refactored and expanded tests to cover loading, error, and empty states.
    • Added tests for severity-based sorting in AllergiesTable.
    • Added tests for onsetDate formatting in ConditionsTable.
    • Ensured proper rendering of table headers and cell content.
    • Removed reliance on mocked ExpandableDataTable for more integrated testing.

• Type Definitions

  • No new or updated explicit type definitions in the diff, but the changes adhere to existing TypeScript types.
  • Confirmed type safety and strict mode adherence throughout the modified components and utilities.

---

Important

Checklist

• Code adheres to project linting and formatting standards.
• New components added to Storybook.
• Tests written and passing (unit + integration).
• Labels and text support i18n.
• Follows accessibility and responsive design guidelines.
• PR reviewed by at least one other developer.

---

Reviewer(s)

@bahnew/developers
Kindly review the proposed changes when convenient. Your feedback is appreciated.