From 52f2abbb933afe73fcdbbfbfefc4370e95f02bd0 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Wed, 26 Aug 2026 16:47:21 -0600
Subject: [PATCH] fix(collection-record): preserve configured mode for dynamic
 records

---
 .../renderer/collection-record-mode.js        |  6 ++++
 .../form-collection-record-control.vue        | 11 +++++--
 .../unit/FormCollectionRecordControl.spec.js  | 30 +++++++++++++++++++
 3 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 src/components/renderer/collection-record-mode.js
 create mode 100644 tests/unit/FormCollectionRecordControl.spec.js

diff --git a/src/components/renderer/collection-record-mode.js b/src/components/renderer/collection-record-mode.js
new file mode 100644
index 000000000..ebb6a8958
--- /dev/null
+++ b/src/components/renderer/collection-record-mode.js
@@ -0,0 +1,6 @@
+export default function resolveCollectionMode(
+  collectionMode,
+  defaultMode = "Edit"
+) {
+  return collectionMode?.modeId ?? defaultMode;
+}
diff --git a/src/components/renderer/form-collection-record-control.vue b/src/components/renderer/form-collection-record-control.vue
index 50db5fcb7..e776dbe56 100644
--- a/src/components/renderer/form-collection-record-control.vue
+++ b/src/components/renderer/form-collection-record-control.vue
@@ -17,6 +17,7 @@
 import _ from "lodash";
 import VueFormRenderer from "../vue-form-renderer.vue";
 import CollectionRecordsList from "../inspector/collection-records-list.vue";
+import resolveCollectionMode from "./collection-record-mode";
 
 const globalObject = typeof window === "undefined" ? global : window;
 
@@ -120,7 +121,7 @@ export default {
         this.loadRecordCollection(
           this.collection.collectionId,
           record,
-          this.selDisplayMode
+          this.getCollectionMode()
         );
       } else {
         if (this.isMustache(record)) {
@@ -154,7 +155,7 @@ export default {
         this.hasMustache = true;
       }
 
-      const collectionMode = this.collectionmode?.modeId ?? this.defaultCollectionMode;
+      const collectionMode = this.getCollectionMode();
 
       this.loadRecordCollection(
         this.collection.collectionId,
@@ -164,6 +165,12 @@ export default {
     }
   },
   methods: {
+    getCollectionMode() {
+      return resolveCollectionMode(
+        this.collectionmode,
+        this.defaultCollectionMode
+      );
+    },
     isSubmitButton(item) {
       return (
         item.config &&
diff --git a/tests/unit/FormCollectionRecordControl.spec.js b/tests/unit/FormCollectionRecordControl.spec.js
new file mode 100644
index 000000000..c33dac364
--- /dev/null
+++ b/tests/unit/FormCollectionRecordControl.spec.js
@@ -0,0 +1,30 @@
+import resolveCollectionMode from "../../src/components/renderer/collection-record-mode";
+
+const readScreenId = 101;
+const updateScreenId = 202;
+
+function getScreenId(collectionMode) {
+  return resolveCollectionMode(collectionMode) === "View"
+    ? readScreenId
+    : updateScreenId;
+}
+
+describe("FormCollectionRecordControl mode resolution", () => {
+  test("preserves each configured mode when a shared dynamic record changes", () => {
+    const controls = [
+      { collectionMode: { modeId: "Edit" }, screenId: updateScreenId },
+      { collectionMode: { modeId: "View" }, screenId: readScreenId }
+    ];
+
+    [1, 2].forEach(() => {
+      controls.forEach(({ collectionMode, screenId }) => {
+        expect(getScreenId(collectionMode)).toBe(screenId);
+      });
+    });
+  });
+
+  test("defaults to Edit when collection mode is not configured", () => {
+    expect(resolveCollectionMode()).toBe("Edit");
+    expect(getScreenId()).toBe(updateScreenId);
+  });
+});