@beinformed/ui 1.60.4 → 1.60.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beinformed/ui",
-  "version": "1.60.4",
+  "version": "1.60.5",
   "description": "Toolbox for be informed javascript layouts",
   "license": "SEE LICENSE IN LICENSE.md",
   "bugs": "https://support.beinformed.com",
@@ -68,7 +68,7 @@
     "styled-components": "^5.0.0"
   },
   "dependencies": {
-    "@babel/runtime-corejs3": "^7.26.9",
+    "@babel/runtime-corejs3": "^7.27.0",
     "@date-fns/tz": "^1.2.0",
     "big.js": "^6.2.2",
     "date-fns": "^4.1.0",
@@ -76,7 +76,7 @@
     "dequal": "^2.0.3",
     "file-size": "^1.0.0",
     "format-message": "^6.2.4",
-    "html-entities": "^2.5.2",
+    "html-entities": "^2.6.0",
     "iban": "^0.0.14",
     "js-cookie": "^3.0.5",
     "klona": "^2.0.6",
@@ -86,62 +86,62 @@
     "timezone-soft": "^1.5.2"
   },
   "devDependencies": {
-    "@babel/cli": "^7.26.4",
-    "@babel/core": "^7.26.9",
-    "@babel/eslint-parser": "^7.26.8",
-    "@babel/eslint-plugin": "^7.25.9",
+    "@babel/cli": "^7.27.0",
+    "@babel/core": "^7.26.10",
+    "@babel/eslint-parser": "^7.27.0",
+    "@babel/eslint-plugin": "^7.27.0",
     "@babel/plugin-proposal-class-properties": "^7.18.6",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.26.9",
+    "@babel/plugin-transform-runtime": "^7.26.10",
     "@babel/preset-env": "^7.26.9",
     "@babel/preset-flow": "^7.25.9",
     "@babel/preset-react": "^7.26.3",
-    "@commitlint/cli": "^19.7.1",
-    "@commitlint/config-conventional": "^19.7.1",
+    "@commitlint/cli": "^19.8.0",
+    "@commitlint/config-conventional": "^19.8.0",
     "@testing-library/dom": "^10.4.0",
-    "@testing-library/react": "^16.2.0",
+    "@testing-library/react": "^16.3.0",
     "auditjs": "^4.0.46",
     "babel-jest": "^29.7.0",
     "babel-plugin-styled-components": "^2.1.4",
     "cherry-pick": "^0.5.0",
-    "commit-and-tag-version": "^12.5.0",
+    "commit-and-tag-version": "^12.5.1",
     "cross-env": "^7.0.3",
     "documentation": "^14.0.2",
     "eslint": "^8.57.0",
-    "eslint-config-prettier": "^10.0.2",
+    "eslint-config-prettier": "^10.1.2",
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-ft-flow": "^3.0.11",
     "eslint-plugin-jest": "^28.11.0",
-    "eslint-plugin-jsdoc": "^50.6.3",
-    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-jsdoc": "^50.6.9",
+    "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-you-dont-need-lodash-underscore": "^6.14.0",
     "flow-bin": "^0.200.1",
     "flow-copy-source": "^2.0.9",
     "flow-typed": "^3.9.0",
-    "hermes-eslint": "^0.26.0",
+    "hermes-eslint": "^0.28.0",
     "history": "^4.0.0",
     "husky": "^9.1.7",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "jest-junit": "^16.0.0",
     "jest-sonar-reporter": "^2.0.0",
-    "jscodeshift": "^17.1.2",
-    "lint-staged": "^15.4.3",
+    "jscodeshift": "^17.3.0",
+    "lint-staged": "^15.5.1",
     "polished": "^4.0.0",
     "prettier": "^3.5.3",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "react-helmet-async": "^2.0.5",
     "react-redux": "^8.1.3",
     "react-router": "^5.0.0",
-    "react-test-renderer": "^19.0.0",
+    "react-test-renderer": "^19.1.0",
     "redux": "^4.2.1",
     "redux-mock-store": "^1.5.5",
     "redux-thunk": "^2.4.2",
     "rimraf": "^6.0.1",
     "styled-components": "^5.3.11",
-    "typescript": "^5.8.2",
+    "typescript": "^5.8.3",
     "xhr-mock": "^2.5.1"
   },
   "scarfSettings": {

package/src/hooks/__tests__/useForm.spec.js

@@ -73,7 +73,7 @@ describe("form hooks", () => {
       {
         type: "MODULARUI/FETCH",
         payload: expect.objectContaining({
-          key: "form(/form)(en)",
+          key: "form(/form?commit=false)(en)",
           href: new Href("/form?commit=false"),
           locale: "en",
           targetModel: FormModel,

package/src/hooks/useForm.js

@@ -10,7 +10,7 @@ import type {
   UpdateFormAction,
 } from "../redux/_modularui";
 import { loadModularUI, removeModelByKey } from "../redux/_modularui";
-import { useModularUI } from "./useModularUI";
+import { createKeyForModularUIStore, useModularUI } from "./useModularUI";
 
 import {
   addRepeatableAttributeSet,
@@ -47,6 +47,8 @@ type AttributeUpdateHook = (
   options: UpdateFormOptions,
 ) => void;
 
+const FORM_MODEL_KEY = "form";
+
 /**
  * Load a form by href
  */
@@ -57,7 +59,7 @@ export const useForm = (href: string | Href, data?: Object): ?FormModel => {
     formHref.addParameter("commit", "false");
   }
 
-  const form = useModularUI("form", formHref, {
+  const form = useModularUI(FORM_MODEL_KEY, formHref, {
     method: HTTP_METHODS.POST,
     targetModel: FormModel,
     removeOnUnmount: true,
@@ -81,9 +83,15 @@ export const useFormNavigation = (): FormNavigationHook => {
 
   const cancel = (form: FormModel) => dispatch(cancelForm(form));
 
-  const submit = (form: FormModel) =>
-    dispatch(
-      loadModularUI(form.connectKey, form.selfhref, {
+  const submit = (form: FormModel) => {
+    const connectKey = createKeyForModularUIStore(
+      FORM_MODEL_KEY,
+      form.selfhref.toString(),
+      form.locale,
+    );
+
+    return dispatch(
+      loadModularUI(connectKey, form.selfhref, {
         method: HTTP_METHODS.POST,
         data: form.formdata,
         updateHandler: (newModel: ModularUIModel): ModularUIModel => {
@@ -97,6 +105,7 @@ export const useFormNavigation = (): FormNavigationHook => {
         targetModel: FormModel,
       }),
     );
+  };
 
   const remove = (form: FormModel) =>
     dispatch(removeModelByKey(form.connectKey));

package/src/hooks/useModularUI.js

@@ -18,11 +18,26 @@ import type { RequestModularUIOptions } from "../utils";
 
 /**
  */
-const useKeyForHook = (modelKey: string, url: string) => {
+export const createKeyForModularUIStore = (
+  modelKey: string,
+  url: string,
+  locale: string,
+): string => {
+  return `${modelKey}(${url})(${locale})`;
+};
+
+/**
+ */
+const useKeyForHook = (
+  modelKey: string,
+  url: string,
+  removeQuerystringFromKey: boolean = true,
+): string => {
   const locale = useLocale();
+  const href = removeQuerystringFromKey ? url.split("?")[0] : url;
   return useMemo(
-    () => `${modelKey}(${url.split("?")[0]})(${locale})`,
-    [modelKey, url, locale],
+    () => createKeyForModularUIStore(modelKey, href, locale),
+    [modelKey, href, locale],
   );
 };
 
@@ -39,7 +54,11 @@ export const useModularUI = (
 ): any => {
   const dispatch = useDispatch();
   const href = useMemo(() => url?.toString() || "", [url]);
-  const key = useKeyForHook(modelKey, href);
+  const key = useKeyForHook(
+    modelKey,
+    href,
+    !options.method || options.method === HTTP_METHODS.GET,
+  );
 
   const modelSelector = useMemo(() => (state) => state.modularui[key], [key]);
   const model = useSelector(modelSelector);