diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ButtonActionEditor/actions/ExportData.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ButtonActionEditor/actions/ExportData.svelte
index 93b9a556a6..5a10e1eca8 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ButtonActionEditor/actions/ExportData.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ButtonActionEditor/actions/ExportData.svelte
@@ -1,11 +1,13 @@
 <script>
   import { Label, Select, Body } from "@budibase/bbui"
-  import { tables } from "stores/backend"
+  import { findAllMatchingComponents } from "builderStore/componentUtils"
+  import { currentAsset } from "builderStore"
   import { onMount } from "svelte"
 
   export let parameters
-  $: tableOptions = $tables.list || []
-
+  $: components = findAllMatchingComponents($currentAsset?.props, component =>
+    component._component.endsWith("table")
+  )
   const FORMATS = [
     {
       label: "CSV",
@@ -26,21 +28,22 @@
 
 <div class="root">
   <Body size="S">
-    Choose the table that you would like to export your row selection from.
+    Choose the table component that you would like to export your row selection
+    from.
     <br />
-    Please ensure you have enabled row selection in the table settings
+    Please ensure you have enabled row selection in the table settings.
   </Body>
 
   <div class="params">
     <Label small>Table</Label>
     <Select
-      bind:value={parameters.tableId}
-      options={tableOptions}
-      getOptionLabel={option => option.name}
+      bind:value={parameters.tableComponentId}
+      options={components}
+      getOptionLabel={option => option._instanceName}
       getOptionValue={option => option._id}
     />
 
-    <Label small>Type</Label>
+    <Label small>Export as</Label>
     <Select bind:value={parameters.type} options={FORMATS} />
   </div>
 </div>
@@ -48,7 +51,7 @@
 <style>
   .root {
     width: 100%;
-    max-width: 800px;
+    max-width: 500px;
     margin: 0 auto;
     display: flex;
     flex-direction: column;
@@ -63,9 +66,9 @@
 
   .params {
     display: grid;
-    column-gap: var(--spacing-l);
+    column-gap: var(--spacing-xs);
     row-gap: var(--spacing-s);
-    grid-template-columns: 100px 1fr;
+    grid-template-columns: 70px 1fr;
     align-items: center;
   }
 </style>
diff --git a/packages/client/src/stores/rowSelection.js b/packages/client/src/stores/rowSelection.js
index 4561557c6f..de40ae595e 100644
--- a/packages/client/src/stores/rowSelection.js
+++ b/packages/client/src/stores/rowSelection.js
@@ -10,12 +10,12 @@ const createRowSelectionStore = () => {
     })
   }
 
-  function getSelection(tableId) {
+  function getSelection(tableComponentId) {
     const selection = get(store)
     const componentId = Object.keys(selection).find(
-      componentId => selection[componentId].tableId === tableId
+      componentId => componentId === tableComponentId
     )
-    return componentId ? selection[componentId] : {}
+    return selection[componentId] || {}
   }
 
   return {
diff --git a/packages/client/src/utils/buttonActions.js b/packages/client/src/utils/buttonActions.js
index 5d0f4ff71e..25659cea98 100644
--- a/packages/client/src/utils/buttonActions.js
+++ b/packages/client/src/utils/buttonActions.js
@@ -243,7 +243,7 @@ const s3UploadHandler = async action => {
 
 const exportDataHandler = async action => {
   let selection = rowSelectionStore.actions.getSelection(
-    action.parameters.tableId
+    action.parameters.tableComponentId
   )
   if (selection.selectedRows && selection.selectedRows.length > 0) {
     try {
