feat(sidebar): filter both databases and collections with dot notation

Author: ooorayray

packages/compass-sidebar/src/components/use-filtered-connections.spec.ts

@@ -53,6 +53,14 @@ const sidebarConnections: SidebarConnection[] = [
             pipeline: [],
             isNonExistent: false,
           },
+          {
+            _id: 'coll_ready_1_1_2',
+            name: 'coll_ready_shared_name',
+            type: 'collection',
+            sourceName: '',
+            pipeline: [],
+            isNonExistent: false,
+          },
         ],
         collectionsLength: 1,
         collectionsStatus: 'ready',
@@ -70,6 +78,14 @@ const sidebarConnections: SidebarConnection[] = [
             pipeline: [],
             isNonExistent: false,
           },
+          {
+            _id: 'coll_ready_1_2_2',
+            name: 'coll_ready_shared_name',
+            type: 'collection',
+            sourceName: '',
+            pipeline: [],
+            isNonExistent: false,
+          },
         ],
         collectionsLength: 1,
         collectionsStatus: 'ready',
@@ -626,6 +642,27 @@ describe('useFilteredConnections', function () {
       });
     });
 
+    it('should filter collection items and database items using dot notation', async function () {
+      const { result } = renderHookWithContext(useFilteredConnections, {
+        initialProps: {
+          connections: mockSidebarConnections,
+          filter: {
+            regex: new RegExp('ready_1_1.coll_ready_shared_name', 'i'), // this matches only coll_ready_shared_name collection in ready_1_1 database
+            excludeInactive: false,
+          },
+          fetchAllCollections: fetchAllCollectionsStub,
+          onDatabaseExpand: onDatabaseExpandStub,
+        },
+      });
+
+      await waitFor(() => {
+        expect(
+          (result.current.filtered?.[0] as SidebarConnectedConnection)
+            .databases[0].collections
+        ).to.have.length(1); // the result has 1 collection
+      });
+    });
+
     it('as expanded, it should return an object containing an expanded object for the matching items', async function () {
       const { result } = renderHookWithContext(useFilteredConnections, {
         initialProps: {

packages/compass-sidebar/src/components/use-filtered-connections.ts

@@ -85,7 +85,7 @@ const filterDatabases = (
   const results: FilteredDatabase[] = [];
   for (const db of databases) {
     const isMatch = !regex || regex.test(db.name);
-    const childMatches = filterCollections(db.collections, regex);
+    const childMatches = filterCollections(db.collections, regex, db.name);
 
     if (isMatch || childMatches.length) {
       // If the db doesn't match, we want to use just the matching collections.
@@ -111,10 +111,14 @@ const filterDatabases = (
 
 const filterCollections = (
   collections: SidebarCollection[],
-  regex: RegExp | null
+  regex: RegExp | null,
+  dbName: string
 ): FilteredCollection[] => {
   return collections
-    .filter(({ name }) => !regex || regex.test(name))
+    .filter(
+      ({ name }) =>
+        !regex || regex.test(name) || regex.test(`${dbName}.${name}`)
+    )
     .map((collection) => ({ ...collection, isMatch: true }));
 };