feat: [DHIS2-17192] show related stages widget on registration page

i18n/en.pot

@@ -774,6 +774,9 @@ msgstr "Save {{trackedEntityTypeName}}"
 msgid "Save {{trackedEntityName}}"
 msgstr "Save {{trackedEntityName}}"
 
+msgid "Enter details now is not available when creating a relationship"
+msgstr "Enter details now is not available when creating a relationship"
+
 msgid "Save new {{trackedEntityTypeName}} and link"
 msgstr "Save new {{trackedEntityTypeName}} and link"
 
@@ -1376,8 +1379,8 @@ msgstr "{{trackedEntityTypeName}} profile"
 msgid "tracked entity instance"
 msgstr "tracked entity instance"
 
-msgid "Link to an existing {{linkableStageLabel}}"
-msgstr "Link to an existing {{linkableStageLabel}}"
+msgid "Choose a {{linkableStageLabel}} event"
+msgstr "Choose a {{linkableStageLabel}} event"
 
 msgid "Choose a {{linkableStageLabel}}"
 msgstr "Choose a {{linkableStageLabel}}"
@@ -1388,14 +1391,17 @@ msgstr "{{ linkableStageLabel }} is not repeatable"
 msgid "{{ linkableStageLabel }} has no linkable events"
 msgstr "{{ linkableStageLabel }} has no linkable events"
 
+msgid "Actions - {{relationshipName}}"
+msgstr "Actions - {{relationshipName}}"
+
 msgid "Ambiguous relationships, contact system administrator"
 msgstr "Ambiguous relationships, contact system administrator"
 
 msgid "Enter details now"
 msgstr "Enter details now"
 
-msgid "Link to an existing"
-msgstr "Link to an existing"
+msgid "Link to an existing event"
+msgstr "Link to an existing event"
 
 msgid "Scheduled date"
 msgstr "Scheduled date"

src/core_modules/capture-core/components/DataEntries/Enrollment/EnrollmentDataEntry.component.js

@@ -42,6 +42,7 @@ import {
     withAOCFieldBuilder,
     withDataEntryFields,
 } from '../../DataEntryDhis2Helpers';
+import type { RelatedStageRefPayload } from '../../WidgetRelatedStages';
 
 const overrideMessagePropNames = {
     errorMessage: 'validationError',
@@ -333,6 +334,7 @@ type FinalTeiDataEntryProps = {
     onUpdateFormFieldAsync: Function,
     onUpdateFormField: Function,
     firstStageMetaData?: ?{ stage: ProgramStage },
+    relatedStageRef?: { current: ?RelatedStageRefPayload },
     formFoundation: RenderFoundation,
 };
 // final step before the generic dataEntry is inserted

src/core_modules/capture-core/components/DataEntries/Enrollment/EnrollmentWithFirstStageDataEntry/EnrollmentWithFirstStageDataEntry.container.js

@@ -4,12 +4,13 @@ import type { Props } from './EnrollmentWithFirstStageDataEntry.types';
 import { FirstStageDataEntry } from './EnrollmentWithFirstStageDataEntry.component';
 import { useDataEntrySections } from './hooks';
 import { Section } from '../../../../metaData';
+import { WidgetRelatedStages } from '../../../WidgetRelatedStages';
 
 const getSectionId = sectionId =>
     (sectionId === Section.MAIN_SECTION_ID ? `${Section.MAIN_SECTION_ID}-stage` : sectionId);
 
 export const EnrollmentWithFirstStageDataEntry = (props: Props) => {
-    const { firstStageMetaData, ...passOnProps } = props;
+    const { firstStageMetaData, relatedStageRef, relatedStageActionsOptions, ...passOnProps } = props;
     const {
         stage: { stageForm: firstStageFormFoundation, name: stageName },
     } = firstStageMetaData;
@@ -19,10 +20,18 @@ export const EnrollmentWithFirstStageDataEntry = (props: Props) => {
     const dataEntrySections = useDataEntrySections(stageName, beforeSectionId);
 
     return (
-        <FirstStageDataEntry
-            {...passOnProps}
-            firstStageMetaData={firstStageMetaData}
-            dataEntrySections={dataEntrySections}
-        />
+        <>
+            <FirstStageDataEntry
+                {...passOnProps}
+                firstStageMetaData={firstStageMetaData}
+                dataEntrySections={dataEntrySections}
+            />
+            <WidgetRelatedStages
+                ref={relatedStageRef}
+                programId={passOnProps.programId}
+                programStageId={firstStageMetaData.stage?.id}
+                actionsOptions={relatedStageActionsOptions}
+            />
+        </>
     );
 };

src/core_modules/capture-core/components/DataEntries/Enrollment/EnrollmentWithFirstStageDataEntry/EnrollmentWithFirstStageDataEntry.types.js

@@ -1,9 +1,20 @@
 // @flow
 import type { ProgramStage, RenderFoundation } from '../../../../metaData';
+import type { RelatedStageRefPayload } from '../../../WidgetRelatedStages';
+import { relatedStageActions } from '../../../WidgetRelatedStages';
 
 export type Props = {
     firstStageMetaData: {
         stage: ProgramStage,
     },
     formFoundation: RenderFoundation,
+    programId: string,
+    relatedStageRef?: { current: ?RelatedStageRefPayload },
+    relatedStageActionsOptions?: {
+        [key: $Keys<typeof relatedStageActions>]: {
+            hidden?: boolean,
+            disabled?: boolean,
+            disabledMessage?: string
+        },
+    },
 };

src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/EnrollmentRegistrationEntry.container.js

@@ -1,5 +1,5 @@
 // @flow
-import React from 'react';
+import React, { useRef } from 'react';
 import type { ComponentType } from 'react';
 import { useSelector } from 'react-redux';
 import { EnrollmentRegistrationEntryComponent } from './EnrollmentRegistrationEntry.component';
@@ -10,6 +10,7 @@ import { dataEntryHasChanges } from '../../DataEntry/common/dataEntryHasChanges'
 import {
     useBuildEnrollmentPayload,
 } from './hooks/useBuildEnrollmentPayload';
+import type { RelatedStageRefPayload } from '../../WidgetRelatedStages';
 
 export const EnrollmentRegistrationEntry: ComponentType<OwnProps> = ({
     selectedScopeId,
@@ -22,6 +23,7 @@ export const EnrollmentRegistrationEntry: ComponentType<OwnProps> = ({
     onCancel,
     ...passOnProps
 }) => {
+    const relatedStageRef = useRef<?RelatedStageRefPayload>(null);
     const { orgUnit, error } = useCoreOrgUnit(orgUnitId);
     const {
         ready,
@@ -57,13 +59,15 @@ export const EnrollmentRegistrationEntry: ComponentType<OwnProps> = ({
     }
 
     const onSaveWithEnrollment = () => {
-        const teiWithEnrollment = buildTeiWithEnrollment();
-        onSave(teiWithEnrollment);
+        const { teiWithEnrollment, formHasError, relatedStageLinkedEvent } =
+            buildTeiWithEnrollment(relatedStageRef);
+        !formHasError && onSave(teiWithEnrollment, relatedStageLinkedEvent);
     };
 
     return (
         <EnrollmentRegistrationEntryComponent
             {...passOnProps}
+            relatedStageRef={relatedStageRef}
             firstStageMetaData={firstStageMetaData}
             selectedScopeId={selectedScopeId}
             formId={formId}

src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/EnrollmentRegistrationEntry.types.js

@@ -7,6 +7,8 @@ import type { SaveForDuplicateCheck } from '../common/TEIAndEnrollment/Duplicate
 import type { ExistingUniqueValueDialogActionsComponent } from '../withErrorMessagePostProcessor';
 import type { InputAttribute } from './hooks/useFormValues';
 import { RenderFoundation, ProgramStage } from '../../../metaData';
+import type { RelatedStageRefPayload } from '../../WidgetRelatedStages';
+import { relatedStageActions } from '../../WidgetRelatedStages';
 
 type TrackedEntityAttributes = Array<{
     attribute: string,
@@ -32,6 +34,21 @@ export type EnrollmentPayload = {|
             attributes: TrackedEntityAttributes,
             geometry: any,
         |}
+    ],
+    relationships?: [
+        {
+            relationshipType: string,
+            from: {
+                event: {
+                    event: string,
+                },
+            },
+            to: {
+                event: {
+                    event: string,
+                },
+            },
+        }
     ]
 |}
 
@@ -51,6 +68,14 @@ export type OwnProps = $ReadOnly<{|
     trackedEntityInstanceAttributes?: Array<InputAttribute>,
     saveButtonText: (trackedEntityName: string) => string,
     firstStageMetaData?: ?{ stage: ?ProgramStage },
+    relatedStageRef?: { current: ?RelatedStageRefPayload },
+    relatedStageActionsOptions?: {
+        [key: $Keys<typeof relatedStageActions>]: {
+            hidden?: boolean,
+            disabled?: boolean,
+            disabledMessage?: string
+        },
+    },
 |}>;
 
 type ContainerProps = {|

src/core_modules/capture-core/components/Pages/New/RegistrationDataEntry/helpers/deriveAutoGenerateEvents.js → src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/helpers/deriveAutoGenerateEvents.js

@@ -1,19 +1,22 @@
 // @flow
 import moment from 'moment';
-import { dataElementTypes, ProgramStage } from '../../../../../metaData';
-import { convertClientToServer } from '../../../../../converters';
-import { convertCategoryOptionsToServer } from '../../../../../converters/clientToServer';
+import { dataElementTypes, ProgramStage } from '../../../../metaData';
+import { convertClientToServer } from '../../../../converters';
+import { convertCategoryOptionsToServer } from '../../../../converters/clientToServer';
+import type { RequestEvent, LinkedRequestEvent } from '../../../DataEntries';
+import { generateUID } from '../../../../utils/uid/generateUID';
 
-const ignoreAutoGenerateIfApplicable = (stage, firstStageDuringRegistrationEvent) =>
-    !firstStageDuringRegistrationEvent || firstStageDuringRegistrationEvent.id !== stage.id;
+const ignoreAutoGenerateIfApplicable = (stage, stageToSkip) =>
+    !stageToSkip || stageToSkip.programStage !== stage.id;
 
 export const deriveAutoGenerateEvents = ({
     stages,
     enrolledAt,
     occurredAt,
     programId,
     orgUnitId,
-    firstStageMetadata,
+    firstStageDuringRegistrationEvent,
+    relatedStageLinkedEvent,
     attributeCategoryOptions,
     serverMinorVersion,
 }: {
@@ -22,7 +25,8 @@ export const deriveAutoGenerateEvents = ({
     occurredAt: string,
     programId: string,
     orgUnitId: string,
-    firstStageMetadata: ?ProgramStage,
+    firstStageDuringRegistrationEvent: ?RequestEvent,
+    relatedStageLinkedEvent: ?LinkedRequestEvent,
     attributeCategoryOptions: { [categoryId: string]: string } | string,
     serverMinorVersion: number,
 }) => {
@@ -33,7 +37,8 @@ export const deriveAutoGenerateEvents = ({
     // $FlowFixMe[missing-annot]
     return [...stages.values()]
         .filter(({ autoGenerateEvent }) => autoGenerateEvent)
-        .filter(stage => ignoreAutoGenerateIfApplicable(stage, firstStageMetadata))
+        .filter(stage => ignoreAutoGenerateIfApplicable(stage, firstStageDuringRegistrationEvent))
+        .filter(stage => ignoreAutoGenerateIfApplicable(stage, relatedStageLinkedEvent))
         .map(
             ({
                 id: programStage,
@@ -71,6 +76,7 @@ export const deriveAutoGenerateEvents = ({
                 return {
                     ...eventInfo,
                     ...eventAttributeCategoryOptions,
+                    event: generateUID(),
                     programStage,
                     program: programId,
                     orgUnit: orgUnitId,

src/core_modules/capture-core/components/Pages/New/RegistrationDataEntry/helpers/deriveFirstStageDuringRegistrationEvent.js → src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/helpers/deriveFirstStageDuringRegistrationEvent.js

@@ -1,9 +1,10 @@
 // @flow
 import { pipe } from 'capture-core-utils';
-import { dataElementTypes, ProgramStage } from '../../../../../metaData';
-import { convertFormToClient, convertClientToServer } from '../../../../../converters';
-import { convertCategoryOptionsToServer } from '../../../../../converters/clientToServer';
-import { convertStatusOut } from '../../../../DataEntries';
+import { generateUID } from '../../../../utils/uid/generateUID';
+import { dataElementTypes, ProgramStage } from '../../../../metaData';
+import { convertFormToClient, convertClientToServer } from '../../../../converters';
+import { convertCategoryOptionsToServer } from '../../../../converters/clientToServer';
+import { convertStatusOut } from '../../../DataEntries';
 import { standardGeoJson } from './standardGeoJson';
 
 const convertFn = pipe(convertFormToClient, convertClientToServer);
@@ -37,6 +38,7 @@ export const deriveFirstStageDuringRegistrationEvent = ({
         : {};
 
     const event: any = {
+        event: generateUID(),
         status: convertStatusOut(stageComplete),
         geometry: standardGeoJson(stageGeometry),
         occurredAt: convertFn(stageOccurredAt, dataElementTypes.DATE),

src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/helpers/deriveRelatedStageEvent.js

@@ -0,0 +1,72 @@
+// @flow
+import { ProgramStage } from '../../../../metaData';
+import { getConvertedRelatedStageEvent } from '../../../DataEntries';
+import type { RequestEvent } from '../../../DataEntries';
+import type { RelatedStageRefPayload } from '../../../WidgetRelatedStages';
+
+export const deriveRelatedStageEvent = ({
+    serverRequestEvent,
+    relatedStageRef,
+    firstStageMetaData,
+    programId,
+    teiId,
+}: {
+    serverRequestEvent: ?RequestEvent,
+    relatedStageRef?: { current: ?RelatedStageRefPayload},
+    firstStageMetaData: ?{ stage: ?ProgramStage},
+    programId: string,
+    teiId?: ?string,
+}) => {
+    if (relatedStageRef?.current && relatedStageRef.current.eventHasLinkableStageRelationship()) {
+        const isValid = relatedStageRef.current.formIsValidOnSave();
+        const currentProgramStageId = firstStageMetaData?.stage?.id;
+        if (
+            !isValid ||
+            !relatedStageRef.current?.getLinkedStageValues ||
+            !currentProgramStageId ||
+            !serverRequestEvent
+        ) {
+            return {
+                formHasError: true,
+                linkedEvent: null,
+                relationship: null,
+                linkMode: null,
+            };
+        }
+
+        const { selectedRelationshipType, relatedStageDataValues, linkMode } =
+            relatedStageRef.current.getLinkedStageValues();
+
+        if (!linkMode) {
+            return {
+                formHasError: false,
+                linkedEvent: null,
+                relationship: null,
+                linkMode: null,
+            };
+        }
+
+        const { linkedEvent, relationship } = getConvertedRelatedStageEvent({
+            linkMode,
+            relatedStageDataValues,
+            serverRequestEvent,
+            relatedStageType: selectedRelationshipType,
+            programId,
+            currentProgramStageId,
+            teiId,
+        });
+
+        return {
+            formHasError: false,
+            linkedEvent,
+            relationship,
+            linkMode,
+        };
+    }
+    return {
+        formHasError: false,
+        linkedEvent: null,
+        relationship: null,
+        linkMode: null,
+    };
+};

src/core_modules/capture-core/components/DataEntries/EnrollmentRegistrationEntry/helpers/index.js

@@ -0,0 +1,5 @@
+// @flow
+export { deriveFirstStageDuringRegistrationEvent } from './deriveFirstStageDuringRegistrationEvent';
+export { deriveRelatedStageEvent } from './deriveRelatedStageEvent';
+export { deriveAutoGenerateEvents } from './deriveAutoGenerateEvents';
+export { standardGeoJson } from './standardGeoJson';