fix: [DHIS2-18632] Sorting stage detail table on orgunit breaks the app

src/core_modules/capture-core/components/WidgetStagesAndEvents/Stages/Stage/StageDetail/StageDetail.component.js

@@ -19,7 +19,7 @@ import {
     Tooltip,
 } from '@dhis2/ui';
 import log from 'loglevel';
-import { sortDataFromEvent } from './hooks/sortFuntions';
+import { sortDataFromEvent } from './hooks/sortFunctions';
 import { StageCreateNewButton } from '../StageCreateNewButton';
 import { useComputeDataFromEvent, useComputeHeaderColumn, formatRowForView } from './hooks/useEventList';
 import { DEFAULT_NUMBER_OF_ROW, SORT_DIRECTION } from './hooks/constants';
@@ -115,7 +115,6 @@ const StageDetailPlain = (props: Props) => {
     const headerColumns = useComputeHeaderColumn(dataElements, hideDueDate, enableUserAssignment, stage?.stageForm);
     const { loading, value: dataSource, error } = useComputeDataFromEvent(dataElements, events);
 
-
     const [{ columnName, sortDirection }, setSortInstructions] = useState(defaultSortState);
     const [displayedRowNumber, setDisplayedRowNumber] = useState(DEFAULT_NUMBER_OF_ROW);
 

src/core_modules/capture-core/components/WidgetStagesAndEvents/Stages/Stage/StageDetail/hooks/helpers.js

@@ -9,7 +9,6 @@ import type { StageDataElement } from '../../../../types/common.types';
 import { Notes } from '../Notes.component';
 import type { QuerySingleResource } from '../../../../../../utils/api/api.types';
 import { isEventOverdue } from '../../../../../../utils/isEventOverdue';
-import { TooltipOrgUnit } from '../../../../../Tooltips/TooltipOrgUnit/TooltipOrgUnit.component';
 
 const getEventStatus = (event: ApiEnrollmentEvent) => {
     const today = moment().startOf('day');
@@ -63,7 +62,6 @@ const convertStatusForView = (event: ApiEnrollmentEvent) => {
     };
 };
 
-const convertOrgUnitForView = (event: ApiEnrollmentEvent) => <TooltipOrgUnit orgUnitId={event.orgUnit} />;
 
 const convertNoteForView = (event: ApiEnrollmentEvent) => <Notes event={event} />;
 
@@ -100,7 +98,6 @@ export {
     isEventOverdue,
     getEventStatus,
     convertStatusForView,
-    convertOrgUnitForView,
     convertNoteForView,
     getValueByKeyFromEvent,
     groupRecordsByType,

src/core_modules/capture-core/components/WidgetStagesAndEvents/Stages/Stage/StageDetail/hooks/sortFuntions.js → src/core_modules/capture-core/components/WidgetStagesAndEvents/Stages/Stage/StageDetail/hooks/sortFunctions.js

@@ -1,6 +1,7 @@
 // @flow
 import log from 'loglevel';
 import { errorCreator } from 'capture-core-utils';
+import { getCachedOrgUnitName } from 'capture-core/metadataRetrieval/orgUnitName';
 import moment from 'moment';
 import { dataElementTypes } from '../../../../../../metaData';
 import { SORT_DIRECTION } from './constants';
@@ -40,7 +41,7 @@ const sortText = (clientValueA: Object, clientValueB: Object, direction: string,
         if (!clientValueB) return -1;
 
         if (clientValueA !== clientValueB) {
-            return clientValueA.localeCompare(clientValueB);
+            return clientValueB.localeCompare(clientValueA);
         }
 
         return moment(eventDateB).unix() - moment(eventDateA).unix();
@@ -49,7 +50,7 @@ const sortText = (clientValueA: Object, clientValueB: Object, direction: string,
         if (!clientValueB) return 1;
 
         if (clientValueA !== clientValueB) {
-            return clientValueB.localeCompare(clientValueA);
+            return clientValueA.localeCompare(clientValueB);
         }
 
         return moment(eventDateB).unix() - moment(eventDateA).unix();
@@ -78,7 +79,12 @@ const sortTime = (clientValueA: Object, clientValueB: Object, direction: string,
     return 0;
 };
 
-const sortOrgUnit = (clientValueA: Object, clientValueB: Object, direction: string, options: Object) => sortText(clientValueA.name, clientValueB.name, direction, options);
+const sortOrgUnit = (clientValueA: string, clientValueB: string, direction: string, options: Object) => {
+    const orgUnitNameA = getCachedOrgUnitName(clientValueA);
+    const orgUnitNameB = getCachedOrgUnitName(clientValueB);
+
+    return sortText(orgUnitNameA, orgUnitNameB, direction, options);
+};
 
 // desc: Scheduled -> Active -> Completed -> Skipped
 const sortStatus = (clientValueA: Object, clientValueB: Object, direction: string, options: Object) => {
@@ -113,10 +119,11 @@ const sortStatus = (clientValueA: Object, clientValueB: Object, direction: strin
     return 0;
 };
 
-const sortDataFromEvent = ({ dataA, dataB, type, columnName, direction }: Object) => {
+export const sortDataFromEvent = ({ dataA, dataB, type, columnName, direction }: Object) => {
     if (!type) {
         log.error(errorCreator('Type is not defined')({ dataA, dataB }));
     }
+    console.log('direction', direction);
     const clientValueA = dataA[columnName];
     const clientValueB = dataB[columnName];
     const options = {
@@ -128,11 +135,6 @@ const sortDataFromEvent = ({ dataA, dataB, type, columnName, direction }: Object
     return sortForTypes[type](clientValueA, clientValueB, direction, options);
 };
 
-export {
-    sortDataFromEvent,
-};
-
-
 const sortForTypes = {
     [dataElementTypes.EMAIL]: sortText,
     [dataElementTypes.TEXT]: sortText,

src/core_modules/capture-core/components/WidgetStagesAndEvents/Stages/Stage/StageDetail/hooks/useEventList.js

@@ -11,7 +11,6 @@ import { convertValue as convertClientToList } from '../../../../../../converter
 import { convertValue as convertServerToClient } from '../../../../../../converters/serverToClient';
 import {
     convertStatusForView,
-    convertOrgUnitForView,
     convertNoteForView,
     getValueByKeyFromEvent,
     groupRecordsByType,
@@ -27,7 +26,7 @@ const basedFieldTypes = [
     { type: dataElementTypes.STATUS, resolveValue: convertStatusForView },
     { type: dataElementTypes.DATE },
     { type: 'ASSIGNEE' },
-    { type: dataElementTypes.TEXT, resolveValue: convertOrgUnitForView },
+    { type: dataElementTypes.ORGANISATION_UNIT },
     { type: dataElementTypes.DATE },
     { type: dataElementTypes.UNKNOWN, resolveValue: convertNoteForView },
 ];

src/core_modules/capture-core/metadataRetrieval/orgUnitName/index.js

@@ -3,4 +3,5 @@ export {
     useOrgUnitNameWithAncestors,
     useOrgUnitNames,
     getOrgUnitNames,
+    getCachedOrgUnitName,
 } from './orgUnitName';

src/core_modules/capture-core/metadataRetrieval/orgUnitName/orgUnitName.js

@@ -209,3 +209,5 @@ export const useOrgUnitNameWithAncestors = (orgUnitId: ?string): {
 
     return { error };
 };
+
+export const getCachedOrgUnitName = (orgUnitId: string): ?string => displayNameCache[orgUnitId]?.displayName;