Merge pull request #4323 from Budibase/relationship-field-default-value

Relationship field default value

packages/bbui/src/Table/InternalRenderer.svelte

@@ -8,10 +8,35 @@
     copyToClipboard(value)
   }
 
-  function copyToClipboard(value) {
-    navigator.clipboard.writeText(value).then(() => {
-      notifications.success("Copied")
+  const copyToClipboard = value => {
+    return new Promise(res => {
+      if (navigator.clipboard && window.isSecureContext) {
+        // Try using the clipboard API first
+        navigator.clipboard.writeText(value).then(res)
+      } else {
+        // Fall back to the textarea hack
+        let textArea = document.createElement("textarea")
+        textArea.value = value
+        textArea.style.position = "fixed"
+        textArea.style.left = "-9999px"
+        textArea.style.top = "-9999px"
+        document.body.appendChild(textArea)
+        textArea.focus()
+        textArea.select()
+        document.execCommand("copy")
+        textArea.remove()
+        res()
+      }
     })
+      .then(() => {
+        notifications.success("Copied to clipboard")
+      })
+      .catch(() => {
+        notifications.error(
+          "Failed to copy to clipboard. Check the dev console for the value."
+        )
+        console.warn("Failed to copy the value", value)
+      })
   }
 </script>
 

packages/client/manifest.json

@@ -2537,6 +2537,11 @@
         "label": "Placeholder",
         "key": "placeholder"
       },
+      {
+        "type": "text",
+        "label": "Default value",
+        "key": "defaultValue"
+      },
       {
         "type": "boolean",
         "label": "Autocomplete",

packages/client/src/components/app/forms/RelationshipField.svelte

@@ -12,6 +12,7 @@
   export let disabled = false
   export let validation
   export let autocomplete = false
+  export let defaultValue
 
   let fieldState
   let fieldApi
@@ -27,6 +28,7 @@
   $: singleValue = flatten(fieldState?.value)?.[0]
   $: multiValue = flatten(fieldState?.value) ?? []
   $: component = multiselect ? CoreMultiselect : CoreSelect
+  $: expandedDefaultValue = expand(defaultValue)
 
   const fetchTable = async id => {
     if (id) {
@@ -62,6 +64,16 @@
   const multiHandler = e => {
     fieldApi.setValue(e.detail)
   }
+
+  const expand = values => {
+    if (!values) {
+      return []
+    }
+    if (Array.isArray(values)) {
+      return values
+    }
+    return values.split(",").map(value => value.trim())
+  }
 </script>
 
 <Field
@@ -69,11 +81,11 @@
   {field}
   {disabled}
   {validation}
+  defaultValue={expandedDefaultValue}
   type={FieldTypes.LINK}
   bind:fieldState
   bind:fieldApi
   bind:fieldSchema
-  defaultValue={[]}
 >
   {#if fieldState}
     <svelte:component