chore: unbuild search integration in popup menu

This reverts the integration of the (partially broken) search into the popup menu.
bpmn-io · Sep 23, 2024 · 2ce8808 · 2ce8808
1 parent 8c452f0
commit 2ce8808
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 23 deletions.
diff --git a/lib/features/popup-menu/PopupMenu.js b/lib/features/popup-menu/PopupMenu.js
@@ -60,10 +60,9 @@ var DEFAULT_PRIORITY = 1000;
  * @param {EventBus} eventBus
  * @param {Canvas} canvas
  */
-export default function PopupMenu(config, eventBus, canvas, search) {
+export default function PopupMenu(config, eventBus, canvas) {
   this._eventBus = eventBus;
   this._canvas = canvas;
-  this._search = search;
 
   this._current = null;
 
@@ -95,8 +94,7 @@ export default function PopupMenu(config, eventBus, canvas, search) {
 PopupMenu.$inject = [
   'config.popupMenu',
   'eventBus',
-  'canvas',
-  'search'
+  'canvas'
 ];
 
 PopupMenu.prototype._render = function() {
@@ -140,7 +138,6 @@ PopupMenu.prototype._render = function() {
         scale=${ scale }
         onOpened=${ this._onOpened.bind(this) }
         onClosed=${ this._onClosed.bind(this) }
-        searchFn=${ this._search }
         ...${{ ...options }}
       />
     `,
@@ -551,6 +548,7 @@ PopupMenu.prototype._getHeaderEntries = function(target, providers) {
 
 
 PopupMenu.prototype._getEmptyPlaceholder = function(providers) {
+
   const provider = providers.find(
     provider => isFunction(provider.getEmptyPlaceholder)
   );

diff --git a/lib/features/popup-menu/PopupMenuComponent.js b/lib/features/popup-menu/PopupMenuComponent.js
@@ -54,7 +54,6 @@ export default function PopupMenuComponent(props) {
     scale,
     search,
     emptyPlaceholder,
-    searchFn,
     entries: originalEntries,
     onOpened,
     onClosed
@@ -76,19 +75,29 @@ export default function PopupMenuComponent(props) {
       return originalEntries;
     }
 
-    if (!value) {
-      return originalEntries.filter(({ rank = 0 }) => rank >= 0);
-    }
+    const filter = entry => {
+      if (!value) {
+        return (entry.rank || 0) >= 0;
+      }
 
-    const searchableEntries = originalEntries.filter(({ searchable }) => searchable !== false);
+      if (entry.searchable === false) {
+        return false;
+      }
+
+      const searchableFields = [
+        entry.description || '',
+        entry.label || '',
+        entry.search || ''
+      ].map(string => string.toLowerCase());
+
+      // every word of `value` should be included in one of the searchable fields
+      return value
+        .toLowerCase()
+        .split(/\s/g)
+        .every(word => searchableFields.some(field => field.includes(word)));
+    };
 
-    return searchFn(searchableEntries, value, {
-      keys: [
-        'label',
-        'description',
-        'search'
-      ]
-    }).map(({ item }) => item);
+    return originalEntries.filter(filter);
   }, [ searchable ]);
 
   const [ entries, setEntries ] = useState(filterEntries(originalEntries, value));

diff --git a/lib/features/popup-menu/index.js b/lib/features/popup-menu/index.js
@@ -1,13 +1,10 @@
 import PopupMenu from './PopupMenu';
 
-import Search from '../search';
-
 
 /**
  * @type { import('didi').ModuleDeclaration }
  */
 export default {
-  __depends__: [ Search ],
   __init__: [ 'popupMenu' ],
   popupMenu: [ 'type', PopupMenu ]
 };
diff --git a/test/spec/features/popup-menu/PopupMenuComponentSpec.js b/test/spec/features/popup-menu/PopupMenuComponentSpec.js
@@ -17,8 +17,6 @@ import {
   queryAll as domQueryAll
 } from 'min-dom';
 
-import searchFn from 'lib/features/search/search';
-
 
 const TEST_IMAGE_URL = `data:image/svg+xml;utf8,${
   encodeURIComponent(`
@@ -741,7 +739,6 @@ describe('features/popup-menu - <PopupMenu>', function() {
     const props = {
       entries: [],
       headerEntries: [],
-      searchFn: searchFn,
       position() {
         return { x: 0, y: 0 };
       },

diff --git a/test/spec/features/popup-menu/PopupMenuSpec.js b/test/spec/features/popup-menu/PopupMenuSpec.js
@@ -1495,6 +1495,28 @@ describe('features/popup-menu', function() {
     }));
 
 
+    it('should show search results (matching label & search)', inject(async function(popupMenu) {
+
+      // given
+      popupMenu.registerProvider('test-menu', testMenuProvider);
+      popupMenu.open({}, 'test-menu', { x: 100, y: 100 }, { search: true });
+
+      // when
+      await triggerSearch('delta search');
+
+      // then
+      var shownEntries;
+
+      await waitFor(() => {
+        shownEntries = queryPopupAll('.entry');
+
+        expect(shownEntries).to.have.length(1);
+      });
+
+      expect(shownEntries[0].querySelector('.djs-popup-label').textContent).to.eql('Delta');
+    }));
+
+
     describe('ranking', function() {
 
       it('should hide rank < 0 items', inject(async function(popupMenu) {