From 10bbe4d168697805a8293d1c8898ba67828b9de4 Mon Sep 17 00:00:00 2001
From: Peter Evans <peter@baserow.io>
Date: Thu, 23 Apr 2026 09:15:17 +0100
Subject: [PATCH] fix: data source creation from the DataSourceDropdown footer
 (#5255)

---
 ...which_prevented_users_from_creating_data_sour.json |  9 +++++++++
 .../components/dataSource/DataSourceDropdown.vue      | 11 +++++++++--
 2 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 changelog/entries/unreleased/bug/5118_resolved_a_bug_which_prevented_users_from_creating_data_sour.json

diff --git a/changelog/entries/unreleased/bug/5118_resolved_a_bug_which_prevented_users_from_creating_data_sour.json b/changelog/entries/unreleased/bug/5118_resolved_a_bug_which_prevented_users_from_creating_data_sour.json
new file mode 100644
index 0000000000..1df2b90ad7
--- /dev/null
+++ b/changelog/entries/unreleased/bug/5118_resolved_a_bug_which_prevented_users_from_creating_data_sour.json
@@ -0,0 +1,9 @@
+{
+    "type": "bug",
+    "message": "Resolved a bug which prevented users from creating data sources from the data source dropdown's footer.",
+    "issue_origin": "github",
+    "issue_number": 5118,
+    "domain": "builder",
+    "bullet_points": [],
+    "created_at": "2026-04-22"
+}
\ No newline at end of file
diff --git a/web-frontend/modules/builder/components/dataSource/DataSourceDropdown.vue b/web-frontend/modules/builder/components/dataSource/DataSourceDropdown.vue
index 85d3b1aa81..de0ac02952 100644
--- a/web-frontend/modules/builder/components/dataSource/DataSourceDropdown.vue
+++ b/web-frontend/modules/builder/components/dataSource/DataSourceDropdown.vue
@@ -48,7 +48,10 @@
     <DataSourceCreateEditModal
       :key="modalKey"
       ref="dataSourceCreateEditModal"
+      :data-source-id="currentDataSourceId"
+      @data-source-created="currentDataSourceId = $event.id"
       @updated="onDataSourceUpdated"
+      @hidden="currentDataSourceId = null"
     />
   </div>
 </template>
@@ -84,6 +87,7 @@ export default {
   data() {
     return {
       modalKey: 0,
+      currentDataSourceId: null,
     }
   },
   computed: {
@@ -112,8 +116,11 @@ export default {
         : this.$t('integrationsCommon.singleRow')
       return `${dataSource.name} (${suffix})`
     },
-    openDataSourceModal() {
-      this.$refs.dataSourceCreateEditModal.show()
+    async openDataSourceModal() {
+      this.currentDataSourceId = null
+      this.modalKey++
+      await this.$nextTick()
+      this.$refs.dataSourceCreateEditModal?.show()
     },
     /**
      * When a data source is updated (i.e. the user has created the record,