Resolve "Allow form view prefill of multiple link to table entries"

changelog.md

@@ -3,6 +3,7 @@
 ## Released 1.22.2
 
 ### New features
+* Allow form view prefill of multiple link to table entries [#2024](https://gitlab.com/baserow/baserow/-/issues/2024)
 * Show the button formula as a clickable button. [#2089](https://gitlab.com/baserow/baserow/-/issues/2089)
 * Add group by support for the duration field type [#2191](https://gitlab.com/baserow/baserow/-/issues/2191)
 * Implement Sentry integration (FE/BE) via environment variables. [#2205](https://gitlab.com/baserow/baserow/-/issues/2205)

changelog/entries/1.22.2/feature/2040_allow_form_view_prefill_multiple_link_to_table_entries.json

@@ -0,0 +1,7 @@
+{
+  "type": "feature",
+  "message": "Allow form view prefill of multiple link to table entries",
+  "issue_number": 2024,
+  "bullet_points": [],
+  "created_at": "2024-01-14"
+}

web-frontend/modules/database/fieldTypes.js

@@ -1104,18 +1104,30 @@ export class LinkRowFieldType extends FieldType {
   }
 
   async parseQueryParameter(field, value, { client, slug, publicAuthToken }) {
-    const { data } = await ViewService(client).linkRowFieldLookup(
-      slug,
-      field.field.id,
-      1,
-      value,
-      1,
-      publicAuthToken
-    )
+    const parsedValues = this.app.$papa.stringToArray(value)
+    const items = []
+    const length =
+      field.field_component === DEFAULT_FORM_VIEW_FIELD_COMPONENT_KEY
+        ? 1
+        : parsedValues.length
 
-    const item = data.results.find((item) => item.value === value)
+    for (let i = 0; i < length; i++) {
+      const { data } = await ViewService(client).linkRowFieldLookup(
+        slug,
+        field.field.id,
+        1,
+        parsedValues[i],
+        1,
+        publicAuthToken
+      )
+      const item = data.results.find((item) => item.value === parsedValues[i])
 
-    return item ? [item] : this.getEmptyValue()
+      if (item) {
+        items.push(item)
+      }
+    }
+
+    return items.length > 0 ? items : this.getEmptyValue()
   }
 
   getCanImport() {

web-frontend/modules/database/viewTypes.js

@@ -912,6 +912,7 @@ export class FormViewType extends ViewType {
           show_when_matching_conditions: false,
           condition_type: 'AND',
           conditions: [],
+          field_component: 'default',
         },
       },
       { root: true }

web-frontend/test/unit/database/fieldTypes.spec.js

@@ -14,6 +14,7 @@ import {
   TextFieldType,
   URLFieldType,
 } from '@baserow/modules/database/fieldTypes'
+import { DEFAULT_FORM_VIEW_FIELD_COMPONENT_KEY } from '@baserow/modules/database/constants'
 
 // The `testing_row_data` is not actually part of the field instance, but it
 // contains an example of how the cell value could be in the frontend.
@@ -619,15 +620,56 @@ const queryParametersForParsing = [
 
 const queryParametersAsyncForParsing = [
   {
-    fieldType: new LinkRowFieldType(),
-    data: { results: [{ value: 'test', id: 1 }] },
-    input: { value: 'test', field: { field: { id: 20 } } },
+    FieldType: LinkRowFieldType,
+    data: [
+      { results: [{ value: 'test', id: 1 }] },
+      { results: [{ value: 'test2', id: 2 }] },
+      { results: [{ value: 'test3,test4', id: 3 }] },
+    ],
+    input: {
+      value: 'test,test2',
+      field: {
+        field: { id: 20 },
+        field_component: DEFAULT_FORM_VIEW_FIELD_COMPONENT_KEY,
+      },
+    },
     output: [{ id: 1, value: 'test' }],
   },
   {
-    fieldType: new LinkRowFieldType(),
-    data: { results: [{ value: 'some other value', id: 1 }] },
-    input: { value: 'test', field: { field: { id: 20 } } },
+    FieldType: LinkRowFieldType,
+    data: [
+      { results: [{ value: 'test', id: 1 }] },
+      { results: [{ value: 'test2', id: 2 }] },
+      { results: [{ value: 'test3,test4', id: 3 }] },
+    ],
+    input: {
+      value: 'test',
+      field: { field: { id: 20 }, field_component: 'multiple' },
+    },
+    output: [{ id: 1, value: 'test' }],
+  },
+  {
+    FieldType: LinkRowFieldType,
+    data: [
+      { results: [{ value: 'test', id: 1 }] },
+      { results: [{ value: 'test3,test4', id: 3 }] },
+    ],
+    input: {
+      value: 'test,"test3,test4"',
+      field: { field: { id: 20 }, field_component: 'multiple' },
+    },
+    output: [
+      { id: 1, value: 'test' },
+      { id: 3, value: 'test3,test4' },
+    ],
+  },
+  {
+    FieldType: LinkRowFieldType,
+    data: [{ results: [{ value: 'some other value', id: 1 }] }],
+    input: {
+      value: 'test',
+      field: { field: { id: 20 }, field_component: 'multiple' },
+    },
     output: new LinkRowFieldType().getEmptyValue(),
   },
 ]
@@ -700,8 +742,15 @@ describe('FieldType tests', () => {
 
   test.each(queryParametersAsyncForParsing)(
     'Verify that parseQueryParameter for async field types returns the correct output',
-    async ({ data, input, output, fieldType }) => {
-      const client = { get: jest.fn().mockReturnValue({ data }) }
+    async ({ data, input, output, FieldType }) => {
+      const fieldType = new FieldType({ app: testApp._app })
+      let dataI = 0
+      const get = () => {
+        const returnValue = { data: data[dataI] }
+        dataI++
+        return returnValue
+      }
+      const client = { get }
       const result = await fieldType.parseQueryParameter(
         input.field,
         input.value,