Merge pull request #14111 from Budibase/fix/automations-ux

Automation UX fixes

packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte

@@ -250,6 +250,7 @@
                   },
                 }))
               },
+              placeholder: false,
               getOptionLabel: type => type.name,
               getOptionValue: type => type.id,
               options: [
@@ -280,14 +281,14 @@
                   tableId: inputData["row"].tableId,
                 },
                 meta: {
-                  fields: inputData["meta"].oldFields || {},
+                  fields: inputData["meta"]?.oldFields || {},
                 },
                 onChange: e => {
                   onChange({
                     oldRow: e.detail.row,
                     meta: {
-                      fields: inputData["meta"].fields,
+                      fields: inputData["meta"]?.fields || {},
-                      oldFields: e.detail.meta.fields,
+                      oldFields: e.detail?.meta?.fields || {},
                     },
                   })
                 },
@@ -304,7 +305,15 @@
               row: inputData["row"],
               meta: inputData["meta"] || {},
               onChange: e => {
-                onChange(e.detail)
+                onChange({
+                  row: e.detail.row,
+                  meta: {
+                    fields: e.detail?.meta?.fields || {},
+                    ...(isTestModal
+                      ? { oldFields: inputData["meta"]?.oldFields || {} }
+                      : {}),
+                  },
+                })
               },
               ...baseProps,
             },
@@ -452,7 +461,6 @@
    */
   const onChange = Utils.sequential(async update => {
     const request = cloneDeep(update)
-
     // Process app trigger updates
     if (isTrigger && !isTestModal) {
       // Row trigger

packages/builder/src/components/automation/SetupPanel/RowSelector.svelte

@@ -288,29 +288,27 @@
 {/each}
 
 {#if table && schemaFields}
-  {#key editableFields}
+  <div
-    <div
+    class="add-fields-btn"
-      class="add-fields-btn"
+    class:empty={Object.is(editableFields, {})}
-      class:empty={Object.is(editableFields, {})}
+    bind:this={popoverAnchor}
-      bind:this={popoverAnchor}
+  >
-    >
+    <ActionButton
-      <ActionButton
+      icon="Add"
-        icon="Add"
+      fullWidth
-        fullWidth
+      on:click={() => {
-        on:click={() => {
+        customPopover.show()
-          customPopover.show()
+      }}
-        }}
+      disabled={!schemaFields}
-        disabled={!schemaFields}
+      >Add fields
-        >Add fields
+    </ActionButton>
-      </ActionButton>
+  </div>
-    </div>
-  {/key}
 {/if}
 
 <Popover
   align="center"
   bind:this={customPopover}
-  anchor={popoverAnchor}
+  anchor={editableFields ? popoverAnchor : null}
   useAnchorWidth
   maxHeight={300}
   resizable={false}