feat: [DHIS2-16337] Org unit in view event page (#3882)

* feat: add field and label to view event page

* feat: add field and label to view event page

* feat: add orgunit id to redux

* feat: add validator

* fix: remove console log

* feat: label improvement

i18n/en.pot

@@ -1291,6 +1291,9 @@ msgstr "Warning"
 msgid "stage not found in rules execution"
 msgstr "stage not found in rules execution"
 
+msgid "Please provide an valid organisation unit"
+msgstr "Please provide an valid organisation unit"
+
 msgid "Delete event"
 msgstr "Delete event"
 
@@ -1678,15 +1681,6 @@ msgstr "Follow up"
 msgid "Choose a program stage to filter by {{label}}"
 msgstr "Choose a program stage to filter by {{label}}"
 
-msgid "Active enrollments"
-msgstr "Active enrollments"
-
-msgid "Completed enrollments"
-msgstr "Completed enrollments"
-
-msgid "Cancelled enrollments"
-msgstr "Cancelled enrollments"
-
 msgid ""
 "Some enrollments were completed successfully, but there was an error while "
 "completing the rest. Please see the details below."

src/core_modules/capture-core/components/WidgetEventEdit/DataEntry/fieldValidators/index.js

@@ -0,0 +1,5 @@
+// @flow
+export { getCategoryOptionsValidatorContainers } from './categoryOptions.validatorContainersGetter';
+export { getEventDateValidatorContainers } from './eventDate.validatorContainersGetter';
+export { getNoteValidatorContainers } from './note.validatorContainersGetter';
+export { getOrgUnitValidatorContainers } from './orgUnit.validatorContainersGetter';

src/core_modules/capture-core/components/WidgetEventEdit/DataEntry/fieldValidators/orgUnit.validatorContainersGetter.js

@@ -0,0 +1,15 @@
+// @flow
+import { isValidOrgUnit } from 'capture-core-utils/validators/form';
+import i18n from '@dhis2/d2-i18n';
+
+const validateOrgUnit = (value?: ?Object) => isValidOrgUnit(value);
+
+export const getOrgUnitValidatorContainers = () => {
+    const validatorContainers = [
+        {
+            validator: validateOrgUnit,
+            message: i18n.t('Please provide an valid organisation unit'),
+        },
+    ];
+    return validatorContainers;
+};

src/core_modules/capture-core/components/WidgetEventEdit/ViewEventDataEntry/ViewEventDataEntry.component.js

@@ -139,6 +139,27 @@ const buildReportDateSettingsFn = () => {
     return reportDateSettings;
 };
 
+const buildOrgUnitSettingsFn = () => {
+    const dataElement = new DataElement((o) => {
+        o.type = dataElementTypes.ORGANISATION_UNIT;
+    });
+
+    const orgUnitSettings = {
+        getComponent: () => viewModeComponent,
+        getComponentProps: (props: Object) => createComponentProps(props, {
+            label: i18n.t('Organisation unit'),
+            valueConverter: value => dataElement.convertValue(value, valueConvertFn),
+        }),
+        getPropName: () => 'orgUnitId',
+        getMeta: () => ({
+            placement: placements.TOP,
+            section: dataEntrySectionNames.BASICINFO,
+        }),
+    };
+
+    return orgUnitSettings;
+};
+
 const buildScheduleDateSettingsFn = () => {
     const dataElement = new DataElement((o) => {
         o.type = dataElementTypes.DATE;
@@ -245,7 +266,8 @@ const AOCFieldBuilderHOC = withAOCFieldBuilder({})(withDataEntryFields(getCatego
 const CleanUpHOC = withCleanUp()(AOCFieldBuilderHOC);
 const GeometryField = withDataEntryFieldIfApplicable(buildGeometrySettingsFn())(CleanUpHOC);
 const ScheduleDateField = withDataEntryField(buildScheduleDateSettingsFn())(GeometryField);
-const ReportDateField = withDataEntryField(buildReportDateSettingsFn())(ScheduleDateField);
+const OrgUnitField = withDataEntryField(buildOrgUnitSettingsFn())(ScheduleDateField);
+const ReportDateField = withDataEntryField(buildReportDateSettingsFn())(OrgUnitField);
 const CompletableDataEntry = withDataEntryField(buildCompleteFieldSettingsFn())(ReportDateField);
 const DataEntryWrapper = withBrowserBackWarning()(CompletableDataEntry);
 

src/core_modules/capture-core/components/WidgetEventEdit/ViewEventDataEntry/viewEventDataEntry.actions.js

@@ -23,7 +23,7 @@ import type {
     EnrollmentData,
     AttributeValue,
 } from '../../Pages/common/EnrollmentOverviewDomain/useCommonEnrollmentDomainData';
-import { getEventDateValidatorContainers } from '../DataEntry/fieldValidators/eventDate.validatorContainersGetter';
+import { getEventDateValidatorContainers, getOrgUnitValidatorContainers } from '../DataEntry/fieldValidators';
 import { getCachedSingleResourceFromKeyAsync } from '../../../metaDataMemoryStoreBuilders/baseBuilder/singleResourceFromKeyGetter';
 import { userStores } from '../../../storageControllers/stores';
 import { FEATURES, hasAPISupportForFeature } from '../../../../capture-core-utils';
@@ -67,6 +67,11 @@ export const loadViewEventDataEntry =
                 type: 'DATE',
                 validatorContainers: getEventDateValidatorContainers(),
             },
+            {
+                id: 'orgUnitId',
+                type: 'ORGANISATION_UNIT',
+                validatorContainers: getOrgUnitValidatorContainers(),
+            },
             {
                 id: 'scheduledAt',
                 type: 'DATE',

src/core_modules/capture-core/converters/clientToView.js

@@ -52,13 +52,11 @@ function convertImageForDisplay(clientValue: ImageClientValue) {
     return <PreviewImage url={clientValue.url} previewUrl={clientValue.previewUrl} alignLeft />;
 }
 
-function convertOrgUnitForDisplay(clientValue: { id: string }) {
-    return (
-        <TooltipOrgUnit orgUnitId={clientValue.id} />
-    );
+function convertOrgUnitForDisplay(clientValue: { id: string } | string) {
+    const orgUnitId = typeof clientValue === 'string' ? clientValue : clientValue.id;
+    return <TooltipOrgUnit orgUnitId={orgUnitId} />;
 }
 
-
 const valueConvertersForType = {
     [dataElementTypes.NUMBER]: stringifyNumber,
     [dataElementTypes.INTEGER]: stringifyNumber,