feat: [DHIS2-14775][DHIS2-14729] Render data entry plugins

i18n/en.pot

@@ -65,6 +65,15 @@ msgstr "Date of enrollment"
 msgid "Last updated"
 msgstr "Last updated"
 
+msgid "error encountered during field validation"
+msgstr "error encountered during field validation"
+
+msgid "error"
+msgstr "error"
+
+msgid "Plugins are not yet available - Please contact your system administrator"
+msgstr "Plugins are not yet available - Please contact your system administrator"
+
 msgid "This value is validating"
 msgstr "This value is validating"
 
@@ -986,11 +995,6 @@ msgstr "You can also choose a program from the top bar and search in that progra
 msgid "Choose a type to start searching"
 msgstr "Choose a type to start searching"
 
-msgid "Fill in at least {{count}} attribute to search"
-msgid_plural "Fill in at least {{count}} attribute to search"
-msgstr[0] "Fill in at least {{count}} attribute to search"
-msgstr[1] "Fill in at least {{count}} attributes to search"
-
 msgid "Search {{name}}"
 msgstr "Search {{name}}"
 
@@ -1244,22 +1248,12 @@ msgstr "Scheduled automatically for {{suggestedScheduleDate}}"
 msgid "The scheduled date matches the suggested date, but can be changed if needed."
 msgstr "The scheduled date matches the suggested date, but can be changed if needed."
 
-msgid "The scheduled date is {{count}} days {{position}} the suggested date."
-msgid_plural "The scheduled date is {{count}} days {{position}} the suggested date."
-msgstr[0] "The scheduled date is {{count}} day {{position}} the suggested date."
-msgstr[1] "The scheduled date is {{count}} days {{position}} the suggested date."
-
 msgid "after"
 msgstr "after"
 
 msgid "before"
 msgstr "before"
 
-msgid "There are {{count}} scheduled event in {{orgUnitName}} on this day."
-msgid_plural "There are {{count}} scheduled event in {{orgUnitName}} on this day."
-msgstr[0] "There are {{count}} scheduled event in {{orgUnitName}} on this day."
-msgstr[1] "There are {{count}} scheduled events in {{orgUnitName}} on this day."
-
 msgid "Scheduling an event in {{stageName}} for {{programName}} in {{orgUnitName}}"
 msgstr "Scheduling an event in {{stageName}} for {{programName}} in {{orgUnitName}}"
 
@@ -1530,12 +1524,6 @@ msgstr "To date"
 msgid "To time"
 msgstr "To time"
 
-msgid "error encountered during field validation"
-msgstr "error encountered during field validation"
-
-msgid "error"
-msgstr "error"
-
 msgid "Delete polygon"
 msgstr "Delete polygon"
 

package.json

@@ -130,7 +130,8 @@
         "wait-on": "^6.0.1"
     },
     "resolutions": {
-        "@babel/preset-react": "7.16.7"
+        "@babel/preset-react": "7.16.7",
+        "core-js": "2.5.7"
     },
     "browserslist": {
         "production": [

src/core_modules/capture-core/components/D2Form/D2CustomForm/D2CustomForm.component.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import log from 'loglevel';
 import { walk, kinds } from 'react-transform-tree';
 import { errorCreator } from 'capture-core-utils';
-import type { FieldConfig } from 'capture-ui/FormBuilder/FormBuilder.component';
+import type { FieldConfig } from '../FormBuilder';
 import { CustomForm } from '../../../metaData';
 
 type Props = {

src/core_modules/capture-core/components/D2Form/D2SectionFields.component.js

@@ -2,17 +2,19 @@
 import React, { Component } from 'react';
 import log from 'loglevel';
 import { errorCreator } from 'capture-core-utils';
-import type { FormBuilder, FieldConfig } from 'capture-ui/FormBuilder/FormBuilder.component';
-import { FormBuilderContainer } from './FormBuilder.container';
+import type { FieldConfig, FormBuilder } from './FormBuilder/FormBuilder.component';
+import { FormBuilderContainer } from './FormBuilder/FormBuilder.container';
 import { withDivider } from './FieldDivider/withDivider';
 import { withAlternateBackgroundColors } from './FieldAlternateBackgroundColors/withAlternateBackgroundColors';
 import { withCustomForm } from './D2CustomForm/withCustomForm';
 import { buildField } from './field/buildField';
 import { validationStrategies } from '../../metaData/RenderFoundation/renderFoundation.const';
-import type { DataElement, CustomForm } from '../../metaData';
+import type { CustomForm, DataElement } from '../../metaData';
 import { messageStateKeys } from '../../reducers/descriptions/rulesEffects.reducerDescription';
 import { validatorTypes } from './field/validators/constants';
 import type { QuerySingleResource } from '../../utils/api/api.types';
+import { FormFieldPlugin } from './FormFieldPlugin';
+import { FormFieldPluginConfig } from '../../metaData/FormFieldPluginConfig';
 
 const CustomFormHOC = withCustomForm()(withDivider()(withAlternateBackgroundColors()(FormBuilderContainer)));
 type FormsValues = {
@@ -38,7 +40,7 @@ type RulesMessages = {
 };
 
 type Props = {
-    fieldsMetaData: Map<string, DataElement>,
+    fieldsMetaData: Map<string, DataElement | FormFieldPluginConfig>,
     values: FormsValues,
     rulesMessages: RulesMessages,
     rulesHiddenFields: RulesHiddenFields,
@@ -64,17 +66,33 @@ export class D2SectionFieldsComponent extends Component<Props> {
         return Array.from(fieldsMetaData.entries())
             .map(entry => entry[1])
             // $FlowFixMe[incompatible-return] automated comment
-            .map(metaDataElement => buildField(
-                metaDataElement,
-                {
-                    formHorizontal: props.formHorizontal,
-                    formId: props.formId,
-                    viewMode: props.viewMode,
-                    ...fieldOptions,
-                },
-                !!customForm,
-                querySingleResource,
-            ))
+            .map((metaDataElement) => {
+                if (metaDataElement instanceof FormFieldPluginConfig) {
+                    return ({
+                        id: metaDataElement.id,
+                        component: FormFieldPlugin,
+                        plugin: true,
+                        props: {
+                            pluginSource: metaDataElement.pluginSource,
+                            fieldsMetadata: metaDataElement.fields,
+                            formId: props.formId,
+                        },
+                    });
+                }
+
+                // $FlowFixMe - filter removes undefined values
+                return buildField(
+                    metaDataElement,
+                    {
+                        formHorizontal: props.formHorizontal,
+                        formId: props.formId,
+                        viewMode: props.viewMode,
+                        ...fieldOptions,
+                    },
+                    !!customForm,
+                    querySingleResource,
+                );
+            })
             .filter(field => field);
     }
 
@@ -239,7 +257,6 @@ export class D2SectionFieldsComponent extends Component<Props> {
             values,
             onUpdateField,
             formId,
-            formBuilderId,
             rulesCompulsoryFields,
             rulesDisabledFields,
             rulesHiddenFields,
@@ -256,8 +273,9 @@ export class D2SectionFieldsComponent extends Component<Props> {
             // $FlowFixMe[cannot-spread-inexact] automated comment
             <CustomFormHOC
                 formBuilderRef={(instance) => { this.formBuilderInstance = instance; }}
-                id={formBuilderId}
+                id={formId}
                 fields={this.getFieldConfigWithRulesEffects()}
+                dataElements={this.formFields}
                 values={values}
                 onUpdateField={this.handleUpdateField}
                 onUpdateFieldAsync={this.handleUpdateFieldAsync}