@beinformed/ui 1.17.4 → 1.18.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beinformed/ui",
-  "version": "1.17.4",
+  "version": "1.18.3",
   "description": "Toolbox for be informed javascript layouts",
   "license": "SEE LICENSE IN LICENSE.md",
   "bugs": "http://support.beinformed.com",
@@ -95,45 +95,46 @@
     "setimmediate": "^1.0.5"
   },
   "devDependencies": {
-    "@babel/cli": "^7.17.3",
-    "@babel/core": "^7.17.9",
+    "@babel/cli": "^7.17.10",
+    "@babel/core": "^7.17.10",
     "@babel/eslint-parser": "^7.17.0",
     "@babel/eslint-plugin": "^7.16.5",
     "@babel/plugin-proposal-class-properties": "^7.16.7",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.17.0",
-    "@babel/preset-env": "^7.16.11",
+    "@babel/plugin-transform-runtime": "^7.17.10",
+    "@babel/preset-env": "^7.17.10",
     "@babel/preset-flow": "^7.16.7",
     "@babel/preset-react": "^7.16.7",
-    "@commitlint/cli": "^16.2.3",
-    "@commitlint/config-conventional": "^16.2.1",
+    "@commitlint/cli": "^16.2.4",
+    "@commitlint/config-conventional": "^16.2.4",
     "@testing-library/react-hooks": "^8.0.0",
     "auditjs": "^4.0.37",
-    "babel-jest": "^27.5.1",
+    "babel-jest": "^28.0.3",
     "babel-plugin-styled-components": "^2.0.7",
     "cherry-pick": "^0.5.0",
     "cross-env": "^7.0.3",
     "documentation": "^13.2.5",
-    "eslint": "^8.13.0",
+    "eslint": "^8.14.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-ft-flow": "^2.0.1",
     "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jest": "^26.1.4",
-    "eslint-plugin-jsdoc": "^39.2.7",
+    "eslint-plugin-jest": "^26.1.5",
+    "eslint-plugin-jsdoc": "^39.2.9",
     "eslint-plugin-react": "^7.28.0",
-    "eslint-plugin-react-hooks": "^4.4.0",
-    "flow-bin": "^0.176.2",
+    "eslint-plugin-react-hooks": "^4.5.0",
+    "flow-bin": "^0.176.3",
     "flow-copy-source": "^2.0.9",
     "flow-typed": "^3.6.1",
     "glob": "^8.0.1",
     "history": "^4.0.0",
     "husky": "^7.0.4",
-    "jest": "^27.5.1",
+    "jest": "^28.0.3",
+    "jest-environment-jsdom": "^28.0.2",
     "jest-junit": "^13.2.0",
     "jest-sonar-reporter": "^2.0.0",
     "jscodeshift": "^0.13.1",
-    "lint-staged": "^12.4.0",
+    "lint-staged": "^12.4.1",
     "polished": "^4.2.2",
     "prettier": "^2.6.2",
     "react": "^17.0.2",

package/src/constants/Constants.js

@@ -197,3 +197,8 @@ export const ATTRIBUTE_WIDTH = {
 };
 
 export const ALL_CONTENT_IN_DATA_SETTING = "hasAllContentInData";
+
+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";

package/src/constants/Settings.js

@@ -1,6 +1,13 @@
 // @flow
 import { isPlainObject, has } from "../utils/helpers/objects";
-import { ALL_CONTENT_IN_DATA_SETTING } from "./Constants";
+import {
+  BASE,
+  ALL_CONTENT_IN_DATA_SETTING,
+  LOGIN_PATH_SETTING,
+  LOGIN_USERNAME_SETTING,
+  LOGIN_PASSWORD_SETTING,
+  LOGOUT_PATH_SETTING,
+} from "./Constants";
 
 type Setting = boolean | string | number | Array<string>;
 
@@ -115,3 +122,20 @@ export const allSettings = (): { [name: string]: Setting } => settings;
  */
 export const hasAllContentInData = (): boolean =>
   getSetting(ALL_CONTENT_IN_DATA_SETTING, true);
+
+/**
+ */
+export const loginPath = (): string =>
+  getSetting(LOGIN_PATH_SETTING, `${BASE}/j_security_check`);
+/**
+ */
+export const loginUsernameField = (): string =>
+  getSetting(LOGIN_USERNAME_SETTING, "j_username");
+/**
+ */
+export const loginPasswordField = (): string =>
+  getSetting(LOGIN_PASSWORD_SETTING, "j_password");
+/**
+ */
+export const logoutPath = (): string =>
+  getSetting(LOGOUT_PATH_SETTING, `${BASE}/Logoff`);

package/src/models/list/ListModel.js

@@ -48,10 +48,9 @@ export default class ListModel extends ResourceModel {
       data.contributions.resourcetype &&
       (data.contributions.resourcetype.endsWith("List") ||
         data.contributions.resourcetype.endsWith("ListPanel") ||
+        data.contributions.resourcetype.endsWith("RelatedDataStorePanel") ||
         [
-          "DatastoreRelatedDatastorePanel",
           "list-related-cases",
-          "CaseRelatedDataStorePanel",
           "RecordPanel",
           "EventHistoryPanel",
           "NotePanel",

package/src/models/list/__tests__/ListModel.spec.js

@@ -7,6 +7,10 @@ import ListModel from "../ListModel";
 import mockList from "./list.json";
 import mockListContributions from "./listContributions.json";
 
+import testData from "./related-data.json";
+import testContributions from "./related-contributions.json";
+import ModularUIResponse from "../../../modularui/ModularUIResponse";
+
 describe("listModel spec", () => {
   it("should be able to create an empty list", () => {
     const list = new ListModel();
@@ -120,4 +124,13 @@ describe("listModel spec", () => {
       "<p>This is introtext</p>"
     );
   });
+
+  it("list model is applicable for contributions with resourcetype RecordRelatedDataStorePanel", () => {
+    const data = ModularUIResponse.create({
+      key: "Bewijsstukken",
+      data: testData,
+      contributions: testContributions,
+    });
+    expect(ListModel.isApplicableModel(data)).toBe(true);
+  });
 });

package/src/models/list/__tests__/related-contributions.json

@@ -0,0 +1,42 @@
+{
+  "Bewijsstukken": {
+    "label": "Bewijsstukken",
+    "resourcetype": "RecordRelatedDataStorePanel",
+    "paging": {
+      "pagesize": {
+        "options": [10, 25, 50]
+      }
+    },
+    "sorting": {
+      "attributes": ["CreationDate", "FileName"]
+    },
+    "results": {
+      "Bewijsstukken": {
+        "metadata": {
+          "_id": {
+            "type": "number"
+          }
+        },
+        "attributes": [
+          {
+            "FileName": {
+              "type": "string",
+              "label": "FileName",
+              "layouthint": ["download=CmfDocumentRecordId"],
+              "displaysize": 50,
+              "maxLength": 255
+            }
+          },
+          {
+            "CreationDate": {
+              "type": "date",
+              "label": "CreationDate",
+              "formatlabel": "dd-mm-jjjj",
+              "format": "dd-MM-yyyy"
+            }
+          }
+        ]
+      }
+    }
+  }
+}

package/src/models/list/__tests__/related-data.json

@@ -0,0 +1,32 @@
+{
+  "Bewijsstukken": {
+    "_links": {
+      "self": {
+        "href": "/mijn-account/gebruiker/981/overige-wijzigingshistorie/ta-wijzigings-historie/6341/bewijsstukken"
+      },
+      "api_doc": {
+        "href": "/api-docs/v3/mijn-account/gebruiker/(case-id)/overige-wijzigingshistorie/ta-wijzigings-historie/(ta-wijzigings-historie-record-id)/bewijsstukken"
+      },
+      "contributions": {
+        "href": "/contributions/mijn-account/gebruiker/(case-id)/overige-wijzigingshistorie/ta-wijzigings-historie/(ta-wijzigings-historie-record-id)/bewijsstukken"
+      }
+    },
+    "paging": { "totalresults": 1, "pagesize": 25, "page": 1, "maxpages": 1 },
+    "_embedded": {
+      "results": [
+        {
+          "Bewijsstukken": {
+            "_id": 181,
+            "_links": {
+              "self": {
+                "href": "/mijn-account/gebruiker/981/overige-wijzigingshistorie/ta-wijzigings-historie/6341/bewijsstukken/181"
+              }
+            },
+            "FileName": "dummy.pdf",
+            "CreationDate": "2022-04-22"
+          }
+        }
+      ]
+    }
+  }
+}

package/src/modularui/Authenticate.js

@@ -6,12 +6,12 @@ import Cache from "../utils/browser/Cache";
 
 import { UnauthorizedException } from "../exceptions";
 import type { RequestOptions } from "../utils/fetch/types";
-
-const LOGIN_PATH = `${BASE}/j_security_check`;
-const LOGOUT_PATH = `${BASE}/Logoff`;
-
-const usernameField = "j_username";
-const passwordField = "j_password";
+import {
+  loginPasswordField,
+  loginPath,
+  loginUsernameField,
+  logoutPath,
+} from "../constants";
 
 /**
  */
@@ -65,6 +65,10 @@ class Authenticate {
   /**
    */
   createLogin(username: string, password: string): $Shape<RequestOptions> {
+    const LOGIN_PATH = loginPath();
+    const usernameField = loginUsernameField();
+    const passwordField = loginPasswordField();
+
     const encodedUsername = encodeURIComponent(username);
     const encodedPassword = encodeURIComponent(password);
 
@@ -97,7 +101,7 @@ class Authenticate {
    */
   logout(): Promise<void> {
     return universalFetch({
-      url: LOGOUT_PATH,
+      url: logoutPath(),
     }).then(() => {
       // clear cache because of cached contributions
       Cache.clear();

package/src/react-client/client.js

@@ -19,7 +19,10 @@ import configureStore from "../redux/store/configureStore";
 import rehydrate from "./rehydrate";
 import { BASE } from "../constants/Constants";
 
-import { setAllContentInDataSetting } from "../redux/actions/Preferences";
+import {
+  setAllContentInDataSetting,
+  setLoginPreferences,
+} from "../redux/actions/Preferences";
 import { showXHRErrorNotification } from "../redux/actions/Notification";
 
 import { handleError } from "../redux/actions/Error";
@@ -99,6 +102,7 @@ const client = ({
   );
 
   setAllContentInDataSetting(store.getState());
+  setLoginPreferences(store.getState());
 
   // load existing cache from other browser tabs
   Cache.loadOtherBrowserTabs(() => {

package/src/react-server/__tests__/serverUtil.spec.js

@@ -109,6 +109,15 @@ describe("serverUtil", () => {
           hasAllContentInData: false,
         },
       },
+      {
+        type: "SET_PREFERENCES",
+        payload: {
+          "FormClient.login_url": "/BeInformed/j_security_check",
+          "FormClient.logout_url": "/BeInformed/Logoff",
+          "FormClient.password_field_name": "j_password",
+          "FormClient.username_field_name": "j_username",
+        },
+      },
     ]);
   });
 
@@ -146,6 +155,15 @@ describe("serverUtil", () => {
           hasAllContentInData: false,
         },
       },
+      {
+        type: "SET_PREFERENCES",
+        payload: {
+          "FormClient.login_url": "/BeInformed/j_security_check",
+          "FormClient.logout_url": "/BeInformed/Logoff",
+          "FormClient.password_field_name": "j_password",
+          "FormClient.username_field_name": "j_username",
+        },
+      },
     ]);
   });
 });

package/src/react-server/serverUtil.js

@@ -16,6 +16,7 @@ import {
   setThemePreference,
   setPreference,
   setAllContentInDataSetting,
+  setLoginPreferences,
 } from "../redux/actions/Preferences";
 
 import { getSetting } from "../constants/Settings";
@@ -126,6 +127,7 @@ const setServerPreferences = (
   }
 
   store.dispatch(setAllContentInDataSetting());
+  store.dispatch(setLoginPreferences());
 
   if (
     preferencesProvider &&

package/src/redux/actions/Preferences.js

@@ -2,14 +2,23 @@
 import { isPlainObject } from "../../utils/helpers/objects";
 
 import { JsonParseException } from "../../exceptions";
-import { setSettings, setSetting } from "../../constants/Settings";
+import { setSetting, setSettings } from "../../constants/Settings";
 
 import type {
   PreferenceValue,
   ReduxState,
   SetPreferenceAction,
+  SetPreferencesAction,
 } from "../types";
-import { ALL_CONTENT_IN_DATA_SETTING } from "../../constants";
+
+import {
+  BASE,
+  ALL_CONTENT_IN_DATA_SETTING,
+  LOGIN_PASSWORD_SETTING,
+  LOGIN_PATH_SETTING,
+  LOGIN_USERNAME_SETTING,
+  LOGOUT_PATH_SETTING,
+} from "../../constants";
 
 /**
  */
@@ -57,6 +66,15 @@ export const setPreference = (
   },
 });
 
+/**
+ */
+export const setPreferences = (preferences: Object): SetPreferencesAction => ({
+  type: "SET_PREFERENCES",
+  payload: {
+    ...preferences,
+  },
+});
+
 /**
  */
 export const setThemePreference = (
@@ -97,3 +115,32 @@ export const setAllContentInDataSetting = (
   setSetting(ALL_CONTENT_IN_DATA_SETTING, !!allContentInDataSetting);
   return setPreference(ALL_CONTENT_IN_DATA_SETTING, allContentInDataSetting);
 };
+
+/**
+ * Retrieves login settings from runtime preferences and sets them as setting in the preference reducer
+ */
+export const setLoginPreferences = (
+  state?: ReduxState
+): SetPreferencesAction => {
+  const loginSettings = {
+    [LOGIN_PATH_SETTING]: getServerPreferenceValue(
+      LOGIN_PATH_SETTING,
+      state?.preferences[LOGIN_PATH_SETTING] ?? `${BASE}/j_security_check`
+    ),
+    [LOGIN_USERNAME_SETTING]: getServerPreferenceValue(
+      LOGIN_USERNAME_SETTING,
+      state?.preferences[LOGIN_USERNAME_SETTING] ?? "j_username"
+    ),
+    [LOGIN_PASSWORD_SETTING]: getServerPreferenceValue(
+      LOGIN_PASSWORD_SETTING,
+      state?.preferences[LOGIN_PASSWORD_SETTING] ?? "j_password"
+    ),
+    [LOGOUT_PATH_SETTING]: getServerPreferenceValue(
+      LOGOUT_PATH_SETTING,
+      state?.preferences[LOGOUT_PATH_SETTING] ?? `${BASE}/Logoff`
+    ),
+  };
+
+  setSettings(loginSettings);
+  return setPreferences(loginSettings);
+};

package/src/redux/actions/__tests__/Preferences.spec.js

@@ -4,6 +4,7 @@ import thunk from "redux-thunk";
 import {
   setServerPreference,
   setPreference,
+  setPreferences,
   setThemePreference,
 } from "../Preferences";
 
@@ -31,6 +32,16 @@ describe("preference actions", () => {
     ]);
   });
 
+  it("set preferences", () => {
+    const store = mockStore({ preferences: {} });
+
+    store.dispatch(setPreferences({ name: "value" }));
+
+    expect(store.getActions()).toStrictEqual([
+      { type: "SET_PREFERENCES", payload: { name: "value" } },
+    ]);
+  });
+
   it("theme settings", () => {
     const store = mockStore({ preferences: {} });
 

package/src/redux/reducers/PreferencesReducer.js

@@ -11,7 +11,14 @@ const PreferencesReducer: Reducer<PreferencesState, ReduxAction> = (
   state = initialState,
   action
 ) => {
-  if (action && action.type === "SET_PREFERENCE") {
+  if (action?.type === "SET_PREFERENCE") {
+    return {
+      ...state,
+      ...action.payload,
+    };
+  }
+
+  if (action?.type === "SET_PREFERENCES") {
     return {
       ...state,
       ...action.payload,

package/src/redux/reducers/__tests__/PreferencesReducer.spec.js

@@ -16,4 +16,16 @@ describe("preferences reducer", () => {
       name: "value",
     });
   });
+
+  it("should handle SET_PREFERENCES", () => {
+    expect(
+      PreferencesReducer([], {
+        type: "SET_PREFERENCES",
+        payload: { name: "value", name2: "value2" },
+      })
+    ).toStrictEqual({
+      name: "value",
+      name2: "value2",
+    });
+  });
 });

package/src/redux/types.js

@@ -84,6 +84,10 @@ export type SetPreferenceAction = {
   type: "SET_PREFERENCE",
   payload: { [name: string]: PreferenceValue },
 };
+export type SetPreferencesAction = {
+  type: "SET_PREFERENCES",
+  payload: { [name: string]: PreferenceValue },
+};
 
 export type StartProgressAction = {
   type: "START_PROGRESS",
@@ -142,6 +146,7 @@ export type ReduxAction =
   | DismissNotificationAction
   | ShowNotificationAction
   | SetPreferenceAction
+  | SetPreferencesAction
   | StartProgressAction
   | FinishProgressAction
   | ResetProgressAction