VAGOV-TEAM-89918: Create Form Config object from normalized input (#3…

…1296)

* Create initial createFormConfig function

* Format chapters

* Add normalized form to mockFetchFormConfigByFormId

* Remove redundant eslint-disable

* Update id to cmsID

* Refactor formatChapters to use reduce

* Add comment explaining why we're using chapter IDs within pages

src/applications/form-renderer/_config/formConfig.js

@@ -181,3 +181,31 @@ export const formConfig2 = {
     },
   },
 };
+
+// This is a sample of the data structure produced by content-build.
+export const normalizedForm = {
+  cmsId: 71160,
+  formId: '2121212',
+  title: 'Form with Two Steps',
+  ombNumber: '1212-1212',
+  chapters: [
+    {
+      id: 158253,
+      chapterTitle: 'First Step',
+      type: 'digital_form_name_and_date_of_bi',
+      pageTitle: 'Name and Date of Birth',
+      additionalFields: {
+        includeDateOfBirth: true,
+      },
+    },
+    {
+      id: 158254,
+      chapterTitle: 'Second Step',
+      type: 'digital_form_name_and_date_of_bi',
+      pageTitle: 'Name and Date of Birth',
+      additionalFields: {
+        includeDateOfBirth: false,
+      },
+    },
+  ],
+};

src/applications/form-renderer/actions/form-load/index.js

@@ -2,7 +2,12 @@ export const FORM_LOADING_INITIATED = 'FORM_RENDERER/FORM_LOADING_INITIATED';
 export const FORM_LOADING_SUCCEEDED = 'FORM_RENDERER/FORM_LOADING_SUCCEEDED';
 export const FORM_LOADING_FAILED = 'FORM_RENDERER/FORM_LOADING_FAILED';
 
-import { formConfig1, formConfig2 } from '../../_config/formConfig';
+import {
+  formConfig1,
+  formConfig2,
+  normalizedForm,
+} from '../../_config/formConfig';
+import { createFormConfig } from '../../utils/formConfig';
 
 export const formLoadingInitiated = formId => {
   return {
@@ -38,6 +43,7 @@ export const fetchFormConfig = formId => {
         const formConfig = {
           '123-abc': formConfig1,
           '456-xyz': formConfig2,
+          '2121212': createFormConfig(normalizedForm),
         }?.[formId];
 
         if (formConfig) {

src/applications/form-renderer/tests/unit/utils/formConfig.unit.spec.js

@@ -0,0 +1,65 @@
+/* eslint-disable prefer-destructuring */
+
+import { expect } from 'chai';
+import { normalizedForm } from '../../../_config/formConfig';
+import { createFormConfig } from '../../../utils/formConfig';
+import manifest from '../../../manifest.json';
+
+describe('createFormConfig', () => {
+  let formConfig;
+
+  beforeEach(() => {
+    formConfig = createFormConfig(normalizedForm);
+  });
+
+  it('returns a properly formatted Form Config object', () => {
+    expect(formConfig.rootUrl).to.eq(`${manifest.rootUrl}/2121212`);
+    expect(formConfig.urlPrefix).to.eq(`/2121212/`);
+    expect(formConfig.trackingPrefix).to.eq('2121212-');
+    expect(formConfig.title).to.eq('Form with Two Steps');
+    expect(formConfig.formId).to.eq('2121212');
+    expect(formConfig.subTitle).to.eq('VA Form 2121212');
+    expect(Object.keys(formConfig.chapters).length).to.eq(2);
+  });
+
+  it('properly formats each chapter', () => {
+    const testChapter = formConfig.chapters[158253];
+    const page = testChapter.pages[158253];
+
+    expect(testChapter.title).to.eq('First Step');
+    expect(Object.keys(testChapter.pages).length).to.eq(1);
+    expect(page.path).to.eq('158253');
+    expect(page.title).to.eq('Name and Date of Birth');
+    expect(page.schema).not.to.eq(undefined);
+    expect(page.uiSchema['ui:title']).not.to.eq(undefined);
+  });
+
+  context('with Name and Date of Birth pattern', () => {
+    let dobIncluded;
+    let nameOnly;
+
+    beforeEach(() => {
+      dobIncluded = formConfig.chapters[158253].pages[158253];
+      nameOnly = formConfig.chapters[158254].pages[158254];
+    });
+
+    it('contains fullName', () => {
+      expect(dobIncluded.schema.properties.fullName).to.not.eq(undefined);
+      expect(dobIncluded.uiSchema.fullName).to.not.eq(undefined);
+    });
+
+    context('when includeDateOfBirth is true', () => {
+      it('contains dateOfBirth', () => {
+        expect(dobIncluded.schema.properties.dateOfBirth).to.not.eq(undefined);
+        expect(dobIncluded.uiSchema.dateOfBirth).to.not.eq(undefined);
+      });
+    });
+
+    context('when includeDateOfBirth is false', () => {
+      it('does not contain dateOfBirth', () => {
+        expect(nameOnly.schema.properties.dateOfBirth).to.eq(undefined);
+        expect(nameOnly.uiSchema.dateOfBirth).to.eq(undefined);
+      });
+    });
+  });
+});

src/applications/form-renderer/utils/formConfig.js

@@ -0,0 +1,80 @@
+import {
+  dateOfBirthSchema,
+  dateOfBirthUI,
+  fullNameSchema,
+  fullNameUI,
+  titleUI,
+} from 'platform/forms-system/src/js/web-component-patterns';
+import manifest from '../manifest.json';
+import IntroductionPage from '../containers/IntroductionPage';
+import ConfirmationPage from '../containers/ConfirmationPage';
+
+const selectSchemas = ({ pageTitle, additionalFields }) => {
+  const schemas = {
+    schema: {
+      type: 'object',
+      properties: {
+        fullName: fullNameSchema,
+      },
+    },
+    uiSchema: {
+      ...titleUI(pageTitle),
+      fullName: fullNameUI(),
+    },
+  };
+
+  if (additionalFields.includeDateOfBirth) {
+    schemas.schema.properties.dateOfBirth = dateOfBirthSchema;
+    schemas.uiSchema.dateOfBirth = dateOfBirthUI();
+  }
+
+  return schemas;
+};
+
+const formatChapters = chapters =>
+  chapters.reduce((formattedChapters, chapter) => {
+    const pages = {
+      // For now, all chapters contain only one page, and there are no
+      // separate IDs for pages. This will probably change at some point.
+      [chapter.id]: {
+        path: chapter.id.toString(),
+        title: chapter.pageTitle,
+        ...selectSchemas(chapter),
+      },
+    };
+
+    const formattedChapter = {
+      [chapter.id]: {
+        title: chapter.chapterTitle,
+        pages,
+      },
+    };
+
+    return { ...formattedChapters, ...formattedChapter };
+  }, {});
+
+export const createFormConfig = ({ chapters, formId, title }) => {
+  const subTitle = `VA Form ${formId}`;
+
+  return {
+    rootUrl: `${manifest.rootUrl}/${formId}`,
+    urlPrefix: `/${formId}/`,
+    trackingPrefix: `${formId}-`,
+    // eslint-disable-next-line no-console
+    submit: () => console.log(`Submitted ${subTitle}`),
+    introduction: IntroductionPage,
+    confirmation: ConfirmationPage,
+    formId,
+    saveInProgress: {},
+    version: 0,
+    prefillEnabled: true,
+    savedFormMessages: {
+      notFound: `${subTitle} NOT FOUND`,
+      noAuth: `Please sign in again to continue ${subTitle}.`,
+    },
+    title,
+    defaultDefinitions: {},
+    subTitle,
+    chapters: formatChapters(chapters),
+  };
+};