From 88023b3784641578b42eeffc212c85b3872d47bb Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 9 Nov 2023 15:12:17 +0100
Subject: [PATCH] Apply filters

---
 .../DatasourceNavigator/DatasourceNavigator.svelte     |  7 +++++--
 .../builder/src/components/common/SearchBox.svelte     |  4 ++--
 .../builder/app/[application]/data/_layout.svelte      | 10 ++++++++--
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte b/packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte
index 0cc61c69e6..dac0e7af74 100644
--- a/packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte
@@ -22,6 +22,7 @@
   import { TableNames } from "constants"
   import { userSelectedResourceMap } from "builderStore"
 
+  export let searchTerm
   let openDataSources = []
 
   $: enrichedDataSources = enrichDatasources(
@@ -209,9 +210,11 @@
         {/if}
       </NavItem>
 
-      {#if datasource.open}
+      {#if datasource.open || searchTerm}
         <TableNavigator sourceId={datasource._id} {selectTable} />
-        {#each $queries.list.filter(query => query.datasourceId === datasource._id) as query}
+        {#each $queries.list.filter(query => query.datasourceId === datasource._id && (!searchTerm || query.name
+                ?.toLowerCase()
+                ?.indexOf(searchTerm.toLowerCase()) > -1)) as query}
           <NavItem
             indentLevel={1}
             icon="SQLQuery"
diff --git a/packages/builder/src/components/common/SearchBox.svelte b/packages/builder/src/components/common/SearchBox.svelte
index 10a09ce446..99e45d954d 100644
--- a/packages/builder/src/components/common/SearchBox.svelte
+++ b/packages/builder/src/components/common/SearchBox.svelte
@@ -4,8 +4,8 @@
 
   export let title
   export let placeholder
+  export let value
 
-  let searchValue
   let searchInput
   let search = false
 
@@ -32,7 +32,7 @@
 <div class="header" class:search>
   <input
     readonly={!search}
-    bind:value={searchValue}
+    bind:value
     bind:this={searchInput}
     class="searchBox"
     class:hide={!search}
diff --git a/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte
index c746900979..7d05b68ec8 100644
--- a/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/data/_layout.svelte
@@ -6,6 +6,8 @@
   import { datasources } from "stores/backend"
   import SearchBox from "components/common/SearchBox.svelte"
 
+  let searchValue
+
   $: {
     // If we ever don't have any data other than the users table, prompt the
     // user to add some
@@ -21,11 +23,15 @@
   {#if !$isActive("./new")}
     <Panel borderRight>
       <span class="panel-title-content" slot="panel-title-content">
-        <SearchBox title="Sources" placeholder="Search for sources" />
+        <SearchBox
+          title="Sources"
+          placeholder="Search for sources"
+          bind:value={searchValue}
+        />
       </span>
       <Layout paddingX="L" paddingY="XL" gap="S">
         <Button cta on:click={() => $goto("./new")}>Add source</Button>
-        <DatasourceNavigator />
+        <DatasourceNavigator searchTerm={searchValue} />
       </Layout>
     </Panel>
   {/if}