@beinformed/ui 1.29.0 → 1.30.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beinformed/ui",
-  "version": "1.29.0",
+  "version": "1.30.1",
   "description": "Toolbox for be informed javascript layouts",
   "license": "SEE LICENSE IN LICENSE.md",
   "bugs": "http://support.beinformed.com",
@@ -85,7 +85,7 @@
     "@babel/runtime-corejs3": "^7.21.0",
     "big.js": "^6.2.1",
     "date-fns": "^2.29.3",
-    "deepmerge": "^4.3.0",
+    "deepmerge": "^4.3.1",
     "dequal": "^2.0.3",
     "file-size": "^1.0.0",
     "format-message": "^6.2.4",
@@ -99,39 +99,39 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.21.0",
-    "@babel/core": "^7.21.0",
-    "@babel/eslint-parser": "^7.19.1",
+    "@babel/core": "^7.21.4",
+    "@babel/eslint-parser": "^7.21.3",
     "@babel/eslint-plugin": "^7.19.1",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.21.0",
-    "@babel/preset-env": "^7.20.2",
-    "@babel/preset-flow": "^7.18.6",
+    "@babel/plugin-transform-runtime": "^7.21.4",
+    "@babel/preset-env": "^7.21.4",
+    "@babel/preset-flow": "^7.21.4",
     "@babel/preset-react": "^7.18.6",
-    "@commitlint/cli": "^17.4.4",
+    "@commitlint/cli": "^17.5.1",
     "@commitlint/config-conventional": "^17.4.4",
     "@testing-library/react": "^14.0.0",
     "auditjs": "^4.0.39",
     "babel-jest": "^29.5.0",
     "babel-plugin-styled-components": "^2.0.7",
     "cherry-pick": "^0.5.0",
-    "commit-and-tag-version": "^11.1.0",
+    "commit-and-tag-version": "^11.2.0",
     "cross-env": "^7.0.3",
     "documentation": "^14.0.1",
-    "eslint": "^8.35.0",
-    "eslint-config-prettier": "^8.7.0",
+    "eslint": "^8.37.0",
+    "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-ft-flow": "^2.0.3",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jest": "^27.2.1",
-    "eslint-plugin-jsdoc": "^40.0.1",
+    "eslint-plugin-jsdoc": "^40.1.0",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.5.0",
     "eslint-plugin-you-dont-need-lodash-underscore": "^6.12.0",
     "flow-bin": "^0.200.1",
     "flow-copy-source": "^2.0.9",
     "flow-typed": "^3.8.0",
-    "glob": "^8.1.0",
+    "glob": "^9.3.2",
     "history": "^4.0.0",
     "husky": "^8.0.3",
     "jest": "^29.5.0",
@@ -139,9 +139,9 @@
     "jest-junit": "^15.0.0",
     "jest-sonar-reporter": "^2.0.0",
     "jscodeshift": "^0.14.0",
-    "lint-staged": "^13.1.2",
+    "lint-staged": "^13.2.0",
     "polished": "^4.0.0",
-    "prettier": "^2.8.4",
+    "prettier": "^2.8.7",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "react-helmet-async": "^1.0.0",
@@ -151,8 +151,8 @@
     "redux": "^4.2.1",
     "redux-mock-store": "^1.5.4",
     "redux-thunk": "^2.4.2",
-    "rimraf": "^4.4.0",
-    "styled-components": "^5.3.8",
+    "rimraf": "^4.4.1",
+    "styled-components": "^5.3.9",
     "xhr-mock": "^2.5.1"
   },
   "scarfSettings": {

package/src/models/attributes/BooleanAttributeModel.js

@@ -253,7 +253,7 @@ export default class BooleanAttributeModel extends AttributeModel {
     } else if (typeof value === "string" && this.isMultiple) {
       values = value.split(",");
     } else {
-      values = [value];
+      values = [value.toString()];
     }
 
     values.forEach((val) => {

package/src/models/attributes/__tests__/BooleanAttributeModel.spec.js

@@ -61,6 +61,20 @@ describe("booleanAttributeModel", () => {
     expect(attribute.getFormData()).toStrictEqual({ boolean: false });
   });
 
+  it("handles update empty string", () => {
+    const data = { key: "boolean", value: null };
+    const contributions = { label: "Boolean", type: "boolean" };
+
+    const attribute = new BooleanAttributeModel(data, contributions);
+
+    attribute.update(false);
+    expect(attribute.value).toBe("false");
+    attribute.reset();
+    expect(attribute.value).toBe(null);
+
+    expect(attribute.getFormData()).toStrictEqual({ boolean: null });
+  });
+
   it("should return proper AttributeWidth for attribute with alternative label", () => {
     const attribute = new BooleanAttributeModel(
       {},

package/src/models/form/FormModel.js

@@ -27,6 +27,7 @@ import type { ModularUIResponse } from "../../modularui";
 import type ErrorResponse from "../error/ErrorResponse";
 import type LinkModel from "../links/LinkModel";
 import LayoutHintCollection from "../layouthint/LayoutHintCollection";
+import AttributeSetModel from "../attributes/AttributeSetModel";
 
 /**
  */
@@ -50,6 +51,7 @@ class FormModel extends ResourceModel {
   _commit: boolean;
   _isFinished: boolean;
   _isComplete: boolean;
+  _success: { redirect: string, data: Object } | null;
 
   _parameters: Array<Parameter>;
   _tokens: Array<string>;
@@ -71,6 +73,8 @@ class FormModel extends ResourceModel {
     if (this.data.errors) {
       this.handleRootErrors(this.data.errors);
     }
+
+    this.createSuccess();
   }
 
   /**
@@ -573,7 +577,7 @@ class FormModel extends ResourceModel {
    * Inidicates if form is finished: Form is completely entered and committed
    */
   get isFinished(): boolean {
-    return this._isFinished || "success" in this.data;
+    return this._isFinished || this.success != undefined;
   }
 
   /**
@@ -599,8 +603,8 @@ class FormModel extends ResourceModel {
    * Handle success redirects
    */
   get successRedirect(): Href | null {
-    return this.isFinished && this.data.success
-      ? new Href(this.data.success.redirect)
+    return this.isFinished && this.success
+      ? new Href(this.success.redirect)
       : null;
   }
 
@@ -611,9 +615,34 @@ class FormModel extends ResourceModel {
   }
 
   /**
+   * Get the result data as plain json object
    */
   getSuccessData(): ?Object {
-    return this.data.success?.data;
+    return this.success?.data;
+  }
+
+  /**
+   * Retrieve an object where each property is a result data attribute set
+   */
+  getResultData(): ?{
+    [key: string]: AttributeSetModel,
+  } {
+    const resultDataKeys = Object.keys(this.contributions.resultdata) ?? [];
+    const successData = this.getSuccessData() ?? {};
+
+    const resultdata: {
+      [key: string]: AttributeSetModel,
+    } = {};
+
+    for (const resultDataKey of resultDataKeys) {
+      resultdata[resultDataKey] = new AttributeSetModel(
+        resultDataKey,
+        successData[resultDataKey],
+        this.contributions.resultdata[resultDataKey]
+      );
+    }
+
+    return resultdata;
   }
 
   /**
@@ -862,6 +891,8 @@ class FormModel extends ResourceModel {
    */
   setPreviousObject() {
     this.isComplete = false;
+    this.isFinished = false;
+    this.success = null;
 
     const oldCurrentFormObject = this.currentFormObject;
 
@@ -959,6 +990,7 @@ class FormModel extends ResourceModel {
 
       this.isComplete = receivedForm.isComplete;
       this.isFinished = receivedForm.isFinished;
+      this.success = receivedForm.success;
 
       const receivedFormData = receivedForm.data ?? {};
       const hasMissing = has(receivedFormData, "missing");
@@ -990,6 +1022,28 @@ class FormModel extends ResourceModel {
     return this;
   }
 
+  /**
+   * Retrieve success information from response
+   * @returns {{redirect: string, data: object}}
+   */
+  get success(): { redirect: string, data: Object } | null {
+    return this._success;
+  }
+
+  /**
+   * Set success information, contains redirect and event data
+   * @param success
+   */
+  set success(success: { redirect: string, data: Object } | null) {
+    this._success = success;
+  }
+
+  /**
+   */
+  createSuccess() {
+    this._success = this.data.success;
+  }
+
   /**
    * Process finished form
    */

package/src/models/form/__tests__/FormModel.spec.js

@@ -458,11 +458,15 @@ describe("formModel", () => {
     expect(form.completedFormObjects).toHaveLength(2);
     expect(form.allObjects).toHaveLength(2);
     expect(form.currentFormObject).toBeNull();
+    expect(form.success).toStrictEqual({ redirect: "/endredirect" });
+    expect(form.isFinished).toBe(true);
 
     form.setPreviousObject();
     expect(form.completedFormObjects).toHaveLength(1);
     expect(form.currentFormObject).toBeInstanceOf(FormObjectModel);
     expect(form.hasNextStep).toBeFalsy();
+    expect(form.success).toBeNull();
+    expect(form.isFinished).toBe(false);
   });
 
   it("is able to get formdata for request", () => {

package/src/models/form/__tests__/FormResultData.spec.js

@@ -0,0 +1,86 @@
+import ModularUIResponse from "../../../modularui/ModularUIResponse";
+import FormModel from "../FormModel";
+
+describe("formModel with result data", () => {
+  it("should be able to create a FormModel with result data", () => {
+    const data = ModularUIResponse.create({
+      data: {
+        formresponse: {
+          _links: {
+            self: { href: "/rebuild-db/database-actions/rebuild-db-server" },
+            api_doc: {
+              href: "/api-docs/v3/rebuild-db/database-actions/rebuild-db-server",
+            },
+            contributions: {
+              href: "/contributions/rebuild-db/database-actions/rebuild-db-server",
+            },
+          },
+          success: { redirect: "/", data: { out: { money: 10 } } },
+        },
+      },
+      contributions: {
+        RebuildDBServer: {
+          label: "Rebuild DB server",
+          resourcetype: "Form",
+          actiontype: "form",
+          objects: {
+            AttributeSet: {
+              dynamicObject: false,
+              repeatable: false,
+              dynamicValidations: false,
+              label: "Rebuild DB",
+              mandatory: false,
+              attributes: [
+                {
+                  Dummy: {
+                    type: "string",
+                    label: "Dummy (not visible)",
+                    mandatory: false,
+                    readonly: true,
+                    layouthint: ["label"],
+                  },
+                },
+              ],
+            },
+          },
+          resultdata: {
+            out: {
+              repeatable: false,
+              label: "Result data",
+              introText: {
+                id: "out.Introtext",
+                message: "<p>uit</p>",
+              },
+              attributes: [
+                {
+                  money: {
+                    type: "number",
+                    label: "Money",
+                    mandatory: false,
+                    decimalSeparator: ",",
+                    layouthint: ["money"],
+                    format: "#,##0.00",
+                    groupingSeparator: ".",
+                    currencySymbol: "€",
+                  },
+                },
+              ],
+            },
+          },
+        },
+      },
+    });
+
+    const form = new FormModel(data);
+
+    const resultData = form.getResultData();
+    expect(resultData.out.key).toBe("out");
+    expect(resultData.out.label).toBe("Result data");
+    expect(resultData.out.attributeCollection.size).toBe(1);
+    expect(resultData.out.attributeCollection.first.label).toBe("Money");
+    expect(resultData.out.attributeCollection.first.readonlyvalue).toBe(
+      "10,00"
+    );
+    expect(resultData.out.attributeCollection.first.currencySymbol).toBe("€");
+  });
+});

package/types/constants/Constants.d.ts

@@ -1,145 +1,145 @@
-/**
- * path to content service
- */
-export const CONTENT_PATH: "/content";
-/**
- * Upload Path
- */
-export const UPLOAD_PATH: "/uploadFile";
-/**
- * Captcha Path
- */
-export const CAPTCHA_PATH: "/captchaServices";
-/**
- * Path to change password page / component
- */
-export const CHANGEPASSWORD_PATH: "/change-password";
-/**
- * Path to user profile page / component
- */
-export const USERPROFILE_PATH: "/user";
-/**
- * Path to resources in the Be Informed repository
- */
-export const RESOURCE_PATH: "/resource";
-/**
- * Separator for parameters of a list, makes it possible to render multiple lists on a page in a non-js environment
- */
-export const PARAMETER_SEPARATOR: "~";
-/**
- * Timeversion filter name
- */
-export const TIMEVERSION_FILTER_NAME: "entryDate";
-/**
- * Parameter name for the viewtype toggle
- */
-export const DEFAULT_UI_PARAMETERS: Array<string>;
-/**
- */
-export const ISO_DATE_FORMAT: "yyyy-MM-dd";
-/**
- */
-export const ISO_DATETIME_FORMAT: "yyyy-MM-dd'T'HH:mm:ss";
-/**
- */
-export const ISO_TIME_FORMAT: "HH:mm:ss";
-/**
- */
-export const ISO_TIMESTAMP_FORMAT: "yyyy-MM-dd'T'HH:mm:ss.SSS";
-/**
- * week starts on monday by default
- */
-export const DEFAULT_WEEK_STARTS_ON: 1;
-/**
- * first week indicated by the 1st of january
- */
-export const DEFAULT_FIRST_WEEK_CONTAINS_DATE: 1;
-/**
- * Key codes
- * @type {{SPACE: number, PAGE_DOWN: number, TAB: number, ARROW_RIGHT: number, ARROW_DOWN: number, ENTER: number, ARROW_UP: number, ARROW_LEFT: number, PAGE_UP: number, ESCAPE: number}}
- */
-export const KEYCODES: {
-    SPACE: number;
-    PAGE_DOWN: number;
-    TAB: number;
-    ARROW_RIGHT: number;
-    ARROW_DOWN: number;
-    ENTER: number;
-    ARROW_UP: number;
-    ARROW_LEFT: number;
-    PAGE_UP: number;
-    ESCAPE: number;
-};
-/**
- * @type {boolean}
- */
-export const IS_SYNC: boolean;
-/**
- * @type {boolean}
- */
-export const IS_SERVER: boolean;
-/**
- * @type {{SUCCESS: string, ERROR: string, INFO: string, WARNING: string}}
- */
-export const NOTIFICATION_TYPES: {
-    SUCCESS: string;
-    ERROR: string;
-    INFO: string;
-    WARNING: string;
-};
-/**
- * SUPPORTED HTTP METHODS
- * @type {{POST: string, GET: string}}
- */
-export const HTTP_METHODS: {
-    POST: string;
-    GET: string;
-};
-/**
- * POSSIBLE MODULARUI STATUSSES
- * @type {{LOADING: string, ERROR: string, FINISHED: string}}
- */
-export const MODULARUI_STATUS: {
-    LOADING: string;
-    ERROR: string;
-    FINISHED: string;
-};
-/**
- * POSSIBLE AUTOSAVE STATUSSES
- * @type {{START: string, FINISHED: string}}
- */
-export const AUTOSAVE_STATUS: {
-    START: string;
-    FINISHED: string;
-};
-/**
- * DEBOUNCE INPUT TIMEOUT
- */
-export const INPUT_DEBOUNCE_TIMEOUT: 100;
-/**
- * DEBOUNCE VALIDATION TIMEOUT
- */
-export const VALIDATE_DEBOUNCE_TIMEOUT: 500;
-export namespace ATTRIBUTE_WIDTH {
-    const EXTRA_SMALL: string;
-    const SMALL: string;
-    const MEDIUM: string;
-    const LARGE: string;
-    const EXTRA_LARGE: string;
-}
-export const ALL_CONTENT_IN_DATA_SETTING: "hasAllContentInData";
-export namespace INTERNAL_LOGIN_TYPE {
-    const JAAS: string;
-    const PAC4J_FORM: string;
-    const PAC4J_BASIC: string;
-}
-export const LOGIN_TYPE: "security.clients";
-export const LOGIN_PATH_SETTING: "FormClient.login_url";
-export const LOGIN_USERNAME_SETTING: "FormClient.username_field_name";
-export const LOGIN_PASSWORD_SETTING: "FormClient.password_field_name";
-export const LOGOUT_PATH_SETTING: "FormClient.logout_url";
-export namespace DEFAULT_AUTHENTICATION_TYPE {
-    const name: string;
-    const authentication: string;
-    const isPrimary: boolean;
-}
+/**
+ * path to content service
+ */
+export const CONTENT_PATH: "/content";
+/**
+ * Upload Path
+ */
+export const UPLOAD_PATH: "/uploadFile";
+/**
+ * Captcha Path
+ */
+export const CAPTCHA_PATH: "/captchaServices";
+/**
+ * Path to change password page / component
+ */
+export const CHANGEPASSWORD_PATH: "/change-password";
+/**
+ * Path to user profile page / component
+ */
+export const USERPROFILE_PATH: "/user";
+/**
+ * Path to resources in the Be Informed repository
+ */
+export const RESOURCE_PATH: "/resource";
+/**
+ * Separator for parameters of a list, makes it possible to render multiple lists on a page in a non-js environment
+ */
+export const PARAMETER_SEPARATOR: "~";
+/**
+ * Timeversion filter name
+ */
+export const TIMEVERSION_FILTER_NAME: "entryDate";
+/**
+ * Parameter name for the viewtype toggle
+ */
+export const DEFAULT_UI_PARAMETERS: Array<string>;
+/**
+ */
+export const ISO_DATE_FORMAT: "yyyy-MM-dd";
+/**
+ */
+export const ISO_DATETIME_FORMAT: "yyyy-MM-dd'T'HH:mm:ss";
+/**
+ */
+export const ISO_TIME_FORMAT: "HH:mm:ss";
+/**
+ */
+export const ISO_TIMESTAMP_FORMAT: "yyyy-MM-dd'T'HH:mm:ss.SSS";
+/**
+ * week starts on monday by default
+ */
+export const DEFAULT_WEEK_STARTS_ON: 1;
+/**
+ * first week indicated by the 1st of january
+ */
+export const DEFAULT_FIRST_WEEK_CONTAINS_DATE: 1;
+/**
+ * Key codes
+ * @type {{SPACE: number, PAGE_DOWN: number, TAB: number, ARROW_RIGHT: number, ARROW_DOWN: number, ENTER: number, ARROW_UP: number, ARROW_LEFT: number, PAGE_UP: number, ESCAPE: number}}
+ */
+export const KEYCODES: {
+    SPACE: number;
+    PAGE_DOWN: number;
+    TAB: number;
+    ARROW_RIGHT: number;
+    ARROW_DOWN: number;
+    ENTER: number;
+    ARROW_UP: number;
+    ARROW_LEFT: number;
+    PAGE_UP: number;
+    ESCAPE: number;
+};
+/**
+ * @type {boolean}
+ */
+export const IS_SYNC: boolean;
+/**
+ * @type {boolean}
+ */
+export const IS_SERVER: boolean;
+/**
+ * @type {{SUCCESS: string, ERROR: string, INFO: string, WARNING: string}}
+ */
+export const NOTIFICATION_TYPES: {
+    SUCCESS: string;
+    ERROR: string;
+    INFO: string;
+    WARNING: string;
+};
+/**
+ * SUPPORTED HTTP METHODS
+ * @type {{POST: string, GET: string}}
+ */
+export const HTTP_METHODS: {
+    POST: string;
+    GET: string;
+};
+/**
+ * POSSIBLE MODULARUI STATUSSES
+ * @type {{LOADING: string, ERROR: string, FINISHED: string}}
+ */
+export const MODULARUI_STATUS: {
+    LOADING: string;
+    ERROR: string;
+    FINISHED: string;
+};
+/**
+ * POSSIBLE AUTOSAVE STATUSSES
+ * @type {{START: string, FINISHED: string}}
+ */
+export const AUTOSAVE_STATUS: {
+    START: string;
+    FINISHED: string;
+};
+/**
+ * DEBOUNCE INPUT TIMEOUT
+ */
+export const INPUT_DEBOUNCE_TIMEOUT: 100;
+/**
+ * DEBOUNCE VALIDATION TIMEOUT
+ */
+export const VALIDATE_DEBOUNCE_TIMEOUT: 500;
+export namespace ATTRIBUTE_WIDTH {
+    const EXTRA_SMALL: string;
+    const SMALL: string;
+    const MEDIUM: string;
+    const LARGE: string;
+    const EXTRA_LARGE: string;
+}
+export const ALL_CONTENT_IN_DATA_SETTING: "hasAllContentInData";
+export namespace INTERNAL_LOGIN_TYPE {
+    const JAAS: string;
+    const PAC4J_FORM: string;
+    const PAC4J_BASIC: string;
+}
+export const LOGIN_TYPE: "security.clients";
+export const LOGIN_PATH_SETTING: "FormClient.login_url";
+export const LOGIN_USERNAME_SETTING: "FormClient.username_field_name";
+export const LOGIN_PASSWORD_SETTING: "FormClient.password_field_name";
+export const LOGOUT_PATH_SETTING: "FormClient.logout_url";
+export namespace DEFAULT_AUTHENTICATION_TYPE {
+    const name: string;
+    const authentication: string;
+    const isPrimary: boolean;
+}