Updating datasource to delete through it.

packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavItem/DatasourceNavItem.svelte

@@ -7,7 +7,7 @@
   import IntegrationIcon from "@/components/backend/DatasourceNavigator/IntegrationIcon.svelte"
   import { Icon } from "@budibase/bbui"
   import UpdateDatasourceModal from "@/components/backend/DatasourceNavigator/modals/UpdateDatasourceModal.svelte"
-  import DeleteConfirmationModal from "./DeleteConfirmationModal.svelte"
+  import DeleteDataConfirmModal from "@/components/backend/modals/DeleteDataConfirmationModal.svelte"
 
   export let datasource
 
@@ -71,7 +71,10 @@
   {/if}
 </NavItem>
 <UpdateDatasourceModal {datasource} bind:this={editModal} />
-<DeleteConfirmationModal {datasource} bind:this={deleteConfirmationModal} />
+<DeleteDataConfirmModal
+  source={datasource}
+  bind:this={deleteConfirmationModal}
+/>
 
 <style>
   .datasource-icon {

packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavItem/DeleteConfirmationModal.svelte

@@ -1,37 +0,0 @@
-<script>
-  import { goto } from "@roxi/routify"
-  import { datasources } from "@/stores/builder"
-  import { notifications } from "@budibase/bbui"
-  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
-
-  export let datasource
-
-  let confirmDeleteDialog
-
-  export const show = () => {
-    confirmDeleteDialog.show()
-  }
-
-  async function deleteDatasource() {
-    try {
-      const isSelected = datasource.selected || datasource.containsSelected
-      await datasources.delete(datasource)
-      notifications.success("Datasource deleted")
-      if (isSelected) {
-        $goto("./datasource")
-      }
-    } catch (error) {
-      notifications.error("Error deleting datasource")
-    }
-  }
-</script>
-
-<ConfirmDialog
-  bind:this={confirmDeleteDialog}
-  okText="Delete Datasource"
-  onOk={deleteDatasource}
-  title="Confirm Deletion"
->
-  Are you sure you wish to delete the datasource
-  <i>{datasource.name}</i>? This action cannot be undone.
-</ConfirmDialog>

packages/builder/src/components/backend/modals/DeleteDataConfirmationModal.svelte

@@ -13,6 +13,7 @@
   import { SourceType } from "@budibase/types"
   import { goto, params } from "@roxi/routify"
   import { DB_TYPE_EXTERNAL } from "@/constants/backend"
+  import { get } from "svelte/store"
   import type { Table, ViewV2, View, Datasource, Query } from "@budibase/types"
 
   export let source: Table | ViewV2 | Datasource | Query | undefined
@@ -107,6 +108,20 @@
     }
   }
 
+  async function deleteDatasource(datasource: Datasource) {
+    try {
+      const isSelected =
+        get(datasources).selectedDatasourceId === datasource._id
+      await datasources.delete(datasource)
+      notifications.success("Datasource deleted")
+      if (isSelected) {
+        $goto("./datasource")
+      }
+    } catch (error) {
+      notifications.error("Error deleting datasource")
+    }
+  }
+
   async function deleteQuery(query: Query) {
     try {
       // Go back to the datasource if we are deleting the active query
@@ -134,6 +149,7 @@
       case SourceType.QUERY:
         return await deleteQuery(source as Query)
       case SourceType.DATASOURCE:
+        return await deleteDatasource(source as Datasource)
     }
   }
 </script>
@@ -180,7 +196,7 @@
       </div>
     {/if}
     <p class="fourthWarning">
-      Please enter the "<b on:click={autofillSourceName} class="sourceName"
+      Please enter "<b on:click={autofillSourceName} class="sourceName"
         >{source?.name}</b
       >" below to confirm.
     </p>