Form Builder - Move backend to HCMS #3645

neatbyte-vnobis · 2023-10-27T08:46:06Z

Changes

Form Methods moved to HCMS:

Submission Methods moved to HCMS:

listSubmissions
createSubmission
updateSubmission

Skipped Submission Methods: deleteSubmission, getSubmission. They were skipped because they are not used anywhere.

How Has This Been Tested?

Manually.

Documentation

Form Builder - Move backend to HCMS

packages/api-form-builder/src/cmsFormBuilderStorage/CmsFormBuilderStorage.ts

packages/api-form-builder/src/plugins/crud/index.ts

packages/api-headless-cms/src/crud/contentEntry.crud.ts

…ema for forms

neatbyte-ivelychko · 2023-11-08T15:25:38Z

@adrians5j, @SvenAlHamad what should we do about these bugs?

While working on this feature we have found bug that exists for a long time.

When we have a form that has ONLY one revision and after deleting that revision we would see that the form that should have been deleted still being displayed in UI in the list of the forms. But after reloading the page it would not be rendered in the list of forms. I think that happens becuase of caching. Furthemore this bug doesn not appear if we delete a form instead of revision.

2023-11-08.16.36.41.mov

When have created a form submission, opened Submissions tab in Form Builder and clicked on reload submissions we would see that the list of submissions has been updated.
But Overview stats on the Submissions tab are still the same, so they has not been updated. To see a most recent data for Overview we would need to reload the page.

When we choose a form revision that we had chosen previously then that revision won't be re-rendered in the Page Builder Editor Form and it would render the latest chosen revision.

2023-11-08.17.19.49.mov

leopuleo

Thanks @neatbyte-vnobis and @neatbyte-ivelychko for this Pull Request.

You will find many comments below; most are repetitive, and many others address tiny issues.

There are a couple of issues we need to address before merging:

we want to keep the original imported method createFormBuilder. TLDR: we don't want to upgrade some part of user projects.
we want to keep the GraphQL schema unchanged: some field types have been changed, some of them are not required anymore and vice-versa. Use the API playground in the admin app to confront the newly generated schema with the previous one.

apps/api/graphql/src/index.ts

packages/api-form-builder/src/cmsFormBuilderStorage/creteModelField.ts

packages/app-form-builder/src/components/Form/FormRender.tsx

packages/api-form-builder/src/cmsFormBuilderStorage/CmsFormsStorage.ts

packages/api-form-builder/src/types.ts

packages/api-headless-cms/src/crud/contentEntry.crud.ts

packages/api-form-builder/src/cmsFormBuilderStorage/models/form.model.ts

packages/api-form-builder/src/cmsFormBuilderStorage/models/submission.model.ts

neatbyte-vnobis · 2023-12-13T09:09:31Z

@adrians5j While updating tests following the recent status updates, I noticed that this test fails. The test involves publishing a form revision and then incrementing its views. However, with our current use of published HCMS entries, we cannot update them. This is because the current implementation of HCMS includes a check to see if an entry is locked before updating, and it is set to true when an entry is published. So we cannot update already published form - which is a breaking change compared to old API and FB logic.

What should our approach be in this case? Could we consider making some changes to HCMS to address this issue? (option to override the locked status or something like this)

@adrians5j @Pavel910 Any thoughts on this?

adrians5j · 2023-12-13T09:18:31Z

We're still discussing this internally. We'll get back to you re this soon.

leopuleo

@neatbyte-vnobis, we are almost there 💪.

I highlighted some minor changes, plus while testing the admin app, I noticed a couple of bugs:

App Form Builder: While trying to create a new version from a previous one, it always keeps the configuration from the latest version instead of the selected one.
App Page Builder: The application crashes while trying to insert a form on a page. It looks like an error on the getPublishedForm query. See the video here below:

CleanShot.2023-12-14.at.07.44.54.mp4

leopuleo · 2023-12-13T18:18:26Z

packages/api-form-builder/src/plugins/crud/forms.crud.ts

@@ -341,7 +336,7 @@ export const createFormsCrud = (params: CreateFormsCrudParams): FormsCRUD => {

            if (!original) {
                throw new NotFoundError(`Form "${id}" was not found!`);
-            } else if (original.locked) {
+            } else if (original.status === "unpublished") {


Let's create a FORM_STATUS enum: you can import this enum from api-headless-cms package and re-export it.

i.e.

if (original.status === CONTENT_ENTRY_STATUS.UNPUBLISHED) { ... }

leopuleo · 2023-12-13T18:39:28Z

packages/api-form-builder/src/plugins/graphql/submissionsSchema.ts

@@ -69,7 +69,7 @@ export const createSubmissionsSchema = (params: CreateSubmissionsTypeDefsParams)
                         * Get all revisions of the form.
                         */
                        const revisions = await formBuilder.getFormRevisions(form);
-                        const publishedRevisions = revisions.filter(r => r.published);
+                        const publishedRevisions = revisions.filter(r => r.status === "published");


Let's create a FORM_STATUS enum: you can import this enum from api-headless-cms package and re-export it.

leopuleo · 2023-12-13T18:42:58Z

packages/app-form-builder/src/admin/plugins/editor/defaultBar/Name/Name.tsx

@@ -92,7 +92,7 @@ export const Name = () => {
        <NameWrapper>
            <FormMeta>
                <Typography use={"overline"}>{`status: ${
-                    state.data.published ? t`published` : t`draft`
+                    state.data.status === "published" ? t`published` : t`draft`


Let's create an enum with the possible status.

leopuleo · 2023-12-13T18:43:21Z

packages/app-form-builder/src/admin/plugins/formDetails/formRevisions/Revision.tsx

@@ -37,7 +37,7 @@ const revisionsMenu = css({

 const getIcon = (revision: Pick<FbFormModel, "status">) => {
    switch (revision.status) {
-        case "locked":
+        case "unpublished":


Same here, let's use an enum with the possible status.

leopuleo · 2023-12-13T18:45:40Z

packages/app-form-builder/src/admin/views/Forms/FormsDataList.tsx

@@ -138,7 +138,7 @@ const FormsDataList = (props: FormsDataListProps) => {
        const handlerKey = form.id + form.status;
        if (!editHandlers.current[handlerKey]) {
            editHandlers.current[handlerKey] = async () => {
-                if (!form.published) {
+                if (form.status !== "published") {


Same here, let's use an enum with the possible status.

# Conflicts: # packages/api-headless-cms/src/graphqlFields/json.ts

# Conflicts: # packages/api-form-builder-so-ddb-es/src/index.ts # packages/api-form-builder-so-ddb-es/src/types.ts

leopuleo · 2024-10-18T08:23:39Z

At the moment, this PR is on hold because of an issue with using HCMS storage operation for the submission entity.

When there is a large number of submissions stored in the database (10,000 submissions), attempting to list even a small subset (20 submissions) results in a 504 Gateway Timeout error.

This is an example of submission record:

{
 "PK": "T#root#L#en-US#CMS#CME#CME#65c668267f15950008b1cb98",
 "SK": "L",
 "createdOn": "2024-02-09T18:00:06.537Z",
 "entryId": "65c668267f15950008b1cb98",
 "GSI1_PK": "T#root#L#en-US#CMS#CME#M#fbSubmission#L",
 "GSI1_SK": "65c668267f15950008b1cb98#0001",
 "id": "65c668267f15950008b1cb98",
 "locale": "en-US",
 "location": {
  "folderId": "root"
 },
 "locked": false,
 "modelId": "fbSubmission",
 "status": "draft",
 "tenant": "root",
 "TYPE": "cms.entry.l",
 "values": {
  "json@data": {
   "demoField": "Submission from Angie Hyatt"
  },
  "json@logs": [
  ],
  "object@form": {
   "object@fields": [
    {
     "json@settings": {
      "defaultValue": null
     },
     "object@options": [
     ],
     "object@validation": [
     ],
     "text@fieldId": "demoField",
     "text@helpText": null,
     "text@label": "Demo field",
     "text@name": "text",
     "text@placeholderText": null,
     "text@type": "text",
     "text@_id": "Ef86jNVJIZ"
    }
   ],
   "object@steps": [
    {
     "json@layout": [
      [
       "Ef86jNVJIZ"
      ]
     ],
     "text@title": "Step 1"
    }
   ],
   "text@id": "65c650d188458c00081fea0f#0001",
   "text@name": "Form 2",
   "text@parent": "65c650d188458c00081fea0f",
   "text@version": 1
  },
  "object@meta": {
   "datetime@submittedOn": "Sun Apr 16 2023 09:22:22 GMT+0200 (Central European Summer Time)",
   "object@url": {
    "json@query": {},
    "text@location": "https://d8t7yvqn5xojf.cloudfront.net/untitled-lseu8t15"
   },
   "text@ip": "200.22.178.28"
  }
 },
 "version": 1,
 "webinyVersion": "5.39.0",
 "_ct": "2024-02-10T15:10:40.797Z",
 "_et": "CmsEntries",
 "_md": "2024-02-10T15:10:40.797Z"
}

Link to private Slack conversation

neatbyte-ivelychko reviewed Oct 27, 2023

View reviewed changes

packages/api-form-builder/src/cmsFormBuilderStorage/CmsFormBuilderStorage.ts Outdated Show resolved Hide resolved

neatbyte-ivelychko reviewed Oct 27, 2023

View reviewed changes

packages/api-form-builder/src/plugins/crud/index.ts Show resolved Hide resolved

neatbyte-ivelychko reviewed Oct 27, 2023

View reviewed changes

packages/api-headless-cms/src/crud/contentEntry.crud.ts Outdated Show resolved Hide resolved

neatbyte-vnobis changed the title ~~Form Builder - Move backend to HCMS [WIP]~~ Form Builder - Move backend to HCMS Nov 8, 2023

neatbyte-vnobis added 14 commits November 8, 2023 14:45

feat: moved createForm, listForms into HCMS

c08f095

feat: moved submission methods, revision methods, deleteForm into HCMS

02af88f

fix: fixed build errors

be28245

feat: added locked form model field

8144935

feat: moved deleteFormRevision into HCMS

44f7f10

fix: removed unused form builder context methods

9eba393

feat: add updateForm, dynamic schema for submissions

63714c9

feat: moved publishRevision, unpublishRevision into HCMS, dynamic sch…

cb042fb

…ema for forms

fix: imports/exports, refactor cms storages

9c04f9b

fix: fix ddb packages types

1d4a590

fix: fix dependencies

96f0783

fix: fixed api-form-builder tests

59d07f6

fix: fixed api-audit-logs tests

37603f3

fix: add interface implementation to CmsSubmissionsStorage class

6e6360c

neatbyte-vnobis force-pushed the neatbyte/form-builder-hcms branch from 6b5be13 to 6e6360c Compare November 8, 2023 12:45

neatbyte-vnobis force-pushed the neatbyte/form-builder-hcms branch from f20f406 to 6e6360c Compare November 8, 2023 15:33

feat: moved deleteSubmission and getSubmission into HCMS

eb371aa

leopuleo requested changes Nov 15, 2023

View reviewed changes

neatbyte-vnobis force-pushed the neatbyte/form-builder-hcms branch 4 times, most recently from 824dfdf to eb371aa Compare November 23, 2023 09:58

neatbyte-vnobis and others added 3 commits November 23, 2023 12:04

Merge branch 'next' into neatbyte/form-builder-hcms

9b203f2

fix: implemented requested changes

f8747c1

fix: fixed issue with packages

dd4e2b2

leopuleo requested changes Dec 14, 2023

View reviewed changes

fix: requested changes and add test

f3da9b1

m0nikaza added this to the 5.39.0 milestone Jan 9, 2024

leopuleo added 2 commits January 9, 2024 20:22

fix: remove reCaptcha settings fields from form entry

6c5da6f

fix: change Recaptcha error message field type

cca3b82

adrians5j modified the milestones: 5.39.0, 5.40.0 Jan 12, 2024

leopuleo and others added 16 commits January 24, 2024 08:17

Merge branch 'next' into neatbyte/form-builder-hcms

03ad21f

# Conflicts: # packages/api-headless-cms/src/graphqlFields/json.ts

chore: merge next

2d51809

test: fix ownedBy

5f45544

Merge branch 'next' into neatbyte/form-builder-hcms

ce03eef

chore: merge next

be376e2

chore: update deps

32f071f

fix: re-introduce getPublishedFormRevisionById crud operation

91e745c

fix: re-introduce form parent and revision in form renderer

1c24102

fix: fetch id instead of formId

cd35575

fix: remove version from getPublishedFormRevisionById

0064543

refactor(api-form-builder): form statistics (#3780)

929b9fe

fix: remove ownedBy where param

6c92b20

fix: revisions tests

2ea2052

Merge branch 'next' into neatbyte/form-builder-hcms

3c3ef69

# Conflicts: # packages/api-form-builder-so-ddb-es/src/index.ts # packages/api-form-builder-so-ddb-es/src/types.ts

chore: merge next

01bccb0

Merge branch 'next' into neatbyte/form-builder-hcms

e5e2160

Pavel910 added the postponed label May 5, 2024

leopuleo modified the milestones: 5.40.0, 5.41.0 Jun 10, 2024

m0nikaza removed this from the 5.41.0 milestone Oct 4, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Form Builder - Move backend to HCMS #3645

Form Builder - Move backend to HCMS #3645

neatbyte-vnobis commented Oct 27, 2023 •

edited

Loading

neatbyte-ivelychko commented Nov 8, 2023

leopuleo left a comment

neatbyte-vnobis commented Dec 13, 2023

adrians5j commented Dec 13, 2023

leopuleo left a comment

leopuleo Dec 13, 2023

leopuleo Dec 13, 2023

leopuleo Dec 13, 2023

leopuleo Dec 13, 2023

leopuleo Dec 13, 2023

leopuleo commented Oct 18, 2024

Form Builder - Move backend to HCMS #3645

Are you sure you want to change the base?

Form Builder - Move backend to HCMS #3645

Conversation

neatbyte-vnobis commented Oct 27, 2023 • edited Loading

Changes

How Has This Been Tested?

Documentation

neatbyte-ivelychko commented Nov 8, 2023

leopuleo left a comment

Choose a reason for hiding this comment

neatbyte-vnobis commented Dec 13, 2023

adrians5j commented Dec 13, 2023

leopuleo left a comment

Choose a reason for hiding this comment

leopuleo Dec 13, 2023

Choose a reason for hiding this comment

leopuleo Dec 13, 2023

Choose a reason for hiding this comment

leopuleo Dec 13, 2023

Choose a reason for hiding this comment

leopuleo Dec 13, 2023

Choose a reason for hiding this comment

leopuleo Dec 13, 2023

Choose a reason for hiding this comment

leopuleo commented Oct 18, 2024

neatbyte-vnobis commented Oct 27, 2023 •

edited

Loading