From 344d661acdadaacdcae22b18abc17a6e980850f3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= <joze.fortun@gmail.com>
Date: Tue, 4 Jun 2024 14:52:57 +0200
Subject: [PATCH] Update record list parent field handling

---
 .../src/components/Common/FieldPicker.vue     |  2 +-
 .../components/PageBlocks/RecordListBase.vue  | 39 ++++----
 .../PageBlocks/RecordListConfigurator.vue     | 95 +++++++------------
 .../RecordOrganizerConfigurator.vue           | 19 ++--
 .../compose/types/page-block/record-list.ts   |  8 +-
 locale/en/corteza-webapp-compose/block.yaml   |  3 +-
 6 files changed, 68 insertions(+), 98 deletions(-)

diff --git a/client/web/compose/src/components/Common/FieldPicker.vue b/client/web/compose/src/components/Common/FieldPicker.vue
index 613fdd733..3f8682366 100644
--- a/client/web/compose/src/components/Common/FieldPicker.vue
+++ b/client/web/compose/src/components/Common/FieldPicker.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="d-flex flex-column"
+    class="d-flex flex-column border border-light rounded p-2 "
   >
     <c-item-picker
       :value.sync="selected"
diff --git a/client/web/compose/src/components/PageBlocks/RecordListBase.vue b/client/web/compose/src/components/PageBlocks/RecordListBase.vue
index 495c42bec..73c6d6a56 100644
--- a/client/web/compose/src/components/PageBlocks/RecordListBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordListBase.vue
@@ -1041,6 +1041,10 @@ export default {
 
       return this.selected.map(r => `recordID='${r}'`).join(' OR ')
     },
+
+    isOnRecordPage () {
+      return this.page && this.page.moduleID !== NoID
+    },
   },
 
   watch: {
@@ -1273,7 +1277,7 @@ export default {
       const r = new compose.Record(this.recordListModule, {})
 
       // Set record values that should be prefilled
-      if (this.record.recordID && this.options.linkToParent) {
+      if (this.record.recordID && this.options.refField) {
         r.values[this.options.refField] = this.record.recordID
       }
 
@@ -1344,6 +1348,12 @@ export default {
     // prepares prefilter
     prepRecordList () {
       this.recordsPerPage = this.options.perPage
+
+      // Legacy support for linkToParent
+      if (this.isOnRecordPage && this.options.linkToParent && !this.options.refField) {
+        this.options.refField = (this.recordListModule.fields.find(f => f.kind === 'Record' && f.options.moduleID === this.page.moduleID) || {}).name
+      }
+
       const { moduleID, presort, prefilter, editable, refField, positionField } = this.options
 
       // Validate props
@@ -1364,13 +1374,15 @@ export default {
         }
       }
 
-      const filter = []
-      let sort = 'createdAt DESC'
+      // Sorting
+      let sort = presort || 'createdAt DESC'
 
-      if (presort) {
-        sort = presort
+      if (editable && positionField) {
+        sort = `${positionField}`
       }
 
+      const filter = []
+
       // Initial filter
       if (prefilter) {
         const pf = evaluatePrefilter(prefilter, {
@@ -1383,20 +1395,14 @@ export default {
         filter.push(`(${pf})`)
       }
 
-      if (editable) {
-        if (positionField) {
-          sort = `${positionField}`
-        }
-
-        if (refField && this.record.recordID) {
-          filter.push(`(${refField} = ${this.record.recordID})`)
-        }
+      if (refField && this.record.recordID) {
+        filter.push(`(${refField} = ${this.record.recordID})`)
       }
 
       this.prefilter = filter.join(' AND ')
-      const limit = this.recordsPerPage
+
       this.filter = {
-        limit,
+        limit: this.recordsPerPage,
         sort,
       }
     },
@@ -1979,7 +1985,7 @@ export default {
     },
 
     handleAddRecord () {
-      const refRecord = this.options.linkToParent && this.recordID !== NoID ? this.record : undefined
+      const refRecord = this.options.refField && this.recordID !== NoID ? this.record : undefined
       const pageID = this.recordPageID
 
       if (!(pageID || this.options.rowCreateUrl)) return
@@ -2052,7 +2058,6 @@ export default {
         })
       }
     },
-
   },
 }
 </script>
diff --git a/client/web/compose/src/components/PageBlocks/RecordListConfigurator.vue b/client/web/compose/src/components/PageBlocks/RecordListConfigurator.vue
index ed276f4b2..73dbb3bfe 100644
--- a/client/web/compose/src/components/PageBlocks/RecordListConfigurator.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordListConfigurator.vue
@@ -86,7 +86,12 @@
                 class="mb-3"
                 style="height: 40vh;"
               />
+            </b-col>
 
+            <b-col
+              cols="12"
+              lg="6"
+            >
               <b-form-group
                 :label="$t('recordList.hideConfigureFieldsButton')"
                 label-class="text-primary"
@@ -99,6 +104,28 @@
                 />
               </b-form-group>
             </b-col>
+
+            <b-col
+              v-if="onRecordPage"
+              cols="12"
+              lg="6"
+            >
+              <b-form-group
+                :label="$t('recordList.refField.label')"
+                label-class="text-primary"
+              >
+                <c-input-select
+                  v-model="options.refField"
+                  :options="parentFields"
+                  :placeholder="$t('general.label.none')"
+                  :reduce="f => f.name"
+                />
+
+                <b-form-text class="text-secondary small">
+                  {{ $t('recordList.refField.footnote') }}
+                </b-form-text>
+              </b-form-group>
+            </b-col>
           </b-row>
         </div>
 
@@ -130,37 +157,6 @@
           <b-row
             class="mt-3"
           >
-            <b-col
-              cols="12"
-              lg="6"
-            >
-              <b-form-group
-                :label="$t('recordList.refField.label')"
-                label-class="text-primary"
-              >
-                <b-form-select
-                  v-model="options.refField"
-                  required
-                >
-                  <option :value="undefined">
-                    {{ $t('general.label.none') }}
-                  </option>
-
-                  <option
-                    v-for="field in parentFields"
-                    :key="field.fieldID"
-                    :value="field.name"
-                  >
-                    {{ field.name }}
-                  </option>
-                </b-form-select>
-
-                <b-form-text class="text-secondary small">
-                  {{ $t('recordList.refField.footnote') }}
-                </b-form-text>
-              </b-form-group>
-            </b-col>
-
             <b-col
               cols="12"
               lg="6"
@@ -169,19 +165,12 @@
                 :label="$t('recordList.positionField.label')"
                 label-class="text-primary"
               >
-                <b-form-select v-model="options.positionField">
-                  <option :value="undefined">
-                    {{ $t('general.label.none') }}
-                  </option>
-
-                  <option
-                    v-for="field in positionFields"
-                    :key="field.fieldID"
-                    :value="field.name"
-                  >
-                    {{ field.label || field.name }}
-                  </option>
-                </b-form-select>
+                <c-input-select
+                  v-model="options.positionField"
+                  :placeholder="$t('recordList.positionField.placeholder')"
+                  :reduce="f => f.name"
+                  label="label"
+                />
 
                 <b-form-text class="text-secondary small">
                   {{ $t('recordList.positionField.footnote') }}
@@ -643,24 +632,6 @@
               </b-form-group>
             </b-col>
 
-            <b-col
-              v-if="onRecordPage"
-              cols="12"
-              lg="6"
-            >
-              <b-form-group
-                :label="$t('recordList.record.linkToParent')"
-                label-class="text-primary"
-              >
-                <c-input-checkbox
-                  v-model="options.linkToParent"
-                  switch
-                  invert
-                  :labels="checkboxLabel"
-                />
-              </b-form-group>
-            </b-col>
-
             <b-col
               cols="12"
               lg="6"
diff --git a/client/web/compose/src/components/PageBlocks/RecordOrganizerConfigurator.vue b/client/web/compose/src/components/PageBlocks/RecordOrganizerConfigurator.vue
index a4c409805..482159e3d 100644
--- a/client/web/compose/src/components/PageBlocks/RecordOrganizerConfigurator.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordOrganizerConfigurator.vue
@@ -94,18 +94,13 @@
         :label="$t('recordOrganizer.positionField.label')"
         label-class="text-primary"
       >
-        <b-form-select v-model="options.positionField">
-          <option value="">
-            {{ $t('general.label.none') }}
-          </option>
-          <option
-            v-for="(field, index) in positionFields"
-            :key="index"
-            :value="field.name"
-          >
-            {{ field.label || field.name }}
-          </option>
-        </b-form-select>
+        <c-input-select
+          v-model="options.positionField"
+          :placeholder="$t('recordOrganizer.positionField.placeholder')"
+          :reduce="f => f.name"
+          label="label"
+        />
+
         <b-form-text class="text-secondary small">
           {{ $t('recordOrganizer.positionField.footnote') }}
         </b-form-text>
diff --git a/lib/js/src/compose/types/page-block/record-list.ts b/lib/js/src/compose/types/page-block/record-list.ts
index 4f2f473d2..bec4550cd 100644
--- a/lib/js/src/compose/types/page-block/record-list.ts
+++ b/lib/js/src/compose/types/page-block/record-list.ts
@@ -48,11 +48,9 @@ interface Options {
   editable: boolean;
   draggable?: boolean;
   positionField?: string;
-  refField?: string;
+  refField?: string; // When adding a new record, prefill refField value with parent record ID
   editFields?: unknown[];
-
-  // When adding a new record, link it to parent when available
-  linkToParent: boolean;
+  linkToParent: boolean; // Legacy
 
   // Should records be opened in a new tab
   // legacy field that has been removed but we keep it for backwards compatibility
@@ -107,7 +105,7 @@ const defaults: Readonly<Options> = Object.freeze({
   refField: undefined,
   editFields: [],
 
-  linkToParent: true,
+  linkToParent: false,
 
   openInNewTab: false,
 
diff --git a/locale/en/corteza-webapp-compose/block.yaml b/locale/en/corteza-webapp-compose/block.yaml
index 0dd97ecb2..57a9dfc91 100644
--- a/locale/en/corteza-webapp-compose/block.yaml
+++ b/locale/en/corteza-webapp-compose/block.yaml
@@ -428,6 +428,7 @@ recordList:
     selectLabel: Select an option
   positionField:
     footnote: Records will be sorted based on this field
+    placeholder: Field that will hold the record position
     label: Record sort field
   preview:
     addRecordButton: Add record button
@@ -483,7 +484,6 @@ recordList:
     openInNewTab: Open record in a new tab
     openInModal: Open record in a modal
     enableBulkRecordEdit: Enable bulk record edit
-    linkToParent: Link to parent record
     buttons: Record buttons
     tooltip:
       clone: Clone
@@ -531,6 +531,7 @@ recordOrganizer:
   notConfigured: Record organizer is not configured correctly
   positionField:
     footnote: Records will be sorted based on this field. That field value will be updated based on the position of the record.
+    placeholder: Field that will hold the record position
     label: Record sort field
   preview:
     label: 'Record Organizer block for module {{0}}. Label field {{1}}, Description field {{2}}. Value setting field: {{3}}, Sorted by position field: {{4}}.'