fix(plugin): onSearch listener when clicking on reaction (MIN-314)

docs/plugins/events.md

@@ -70,7 +70,7 @@ To listen for specific events, plugins can use the `addListener` method in `even
 15
 ```
 
-- onSearch - triggered after completing a search; the elements returned by the search are passed as arguments. Three separate events 'onSearch' are triggered, each with a different searched category type. Category types include: bioEntity, drugs, chemicals. Example argument:
+- onSearch - triggered after completing a search; the elements returned by the search are passed as arguments. Three separate events 'onSearch' are triggered, each with a different searched category type. Category types include: bioEntity, drugs, chemicals, reaction. Example argument:
 
 ```javascript
 {

src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleReactionResults.test.ts

@@ -11,12 +11,15 @@ import { INITIAL_STORE_STATE_MOCK } from '@/redux/root/root.fixtures';
 import { mockNetworkNewAPIResponse, mockNetworkResponse } from '@/utils/mockNetworkResponse';
 import { getReduxStoreWithActionsListener } from '@/utils/testing/getReduxStoreActionsListener';
 import { HttpStatusCode } from 'axios';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
 import * as findClosestReactionPoint from './findClosestReactionPoint';
 import { handleReactionResults } from './handleReactionResults';
 
 const mockedAxiosOldClient = mockNetworkResponse();
 const mockedAxiosNewClient = mockNetworkNewAPIResponse();
 
+jest.mock('../../../../../../services/pluginsManager/pluginsEventBus');
+
 jest.mock('./findClosestReactionPoint', () => ({
   __esModule: true,
   ...jest.requireActual('./findClosestReactionPoint'),
@@ -266,4 +269,47 @@ describe('handleReactionResults - util', () => {
       ]);
     });
   });
+  describe('when matching reaction found', () => {
+    const reaction = {
+      ...reactionsFixture[0],
+      products: [],
+      reactants: [],
+      modifiers: [],
+      lines: [{ start: { x: 0, y: 0 }, end: { x: 3, y: 4 }, type: 'START' }],
+    };
+
+    const point = { x: 1, y: 1 };
+    const maxZoom = 10;
+    const zoom = 5;
+
+    it('should dispatch onSearch event with reaction data', async () => {
+      const { store } = getReduxStoreWithActionsListener();
+      mockedAxiosNewClient
+        .onGet(
+          apiPath.getBioEntityContentsStringWithQuery({
+            searchQuery: ELEMENT_SEARCH_RESULT_MOCK_ALIAS.id.toString(),
+            isPerfectMatch: true,
+          }),
+        )
+        .reply(HttpStatusCode.Ok, []);
+
+      mockedAxiosOldClient
+        .onGet(apiPath.getReactionsWithIds([ELEMENT_SEARCH_RESULT_MOCK_REACTION.id]))
+        .reply(HttpStatusCode.Ok, [reaction]);
+
+      await handleReactionResults(store.dispatch, ELEMENT_SEARCH_RESULT_MOCK_REACTION, {
+        searchDistance,
+        maxZoom,
+        zoom,
+        point,
+        isResultDrawerOpen: false,
+      })(ELEMENT_SEARCH_RESULT_MOCK_REACTION);
+
+      expect(PluginsEventBus.dispatchEvent).toHaveBeenCalledWith('onSearch', {
+        results: [[reaction]],
+        searchValues: [ELEMENT_SEARCH_RESULT_MOCK_REACTION],
+        type: 'reaction',
+      });
+    });
+  });
 });

src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleReactionResults.ts

@@ -56,9 +56,9 @@ export const handleReactionResults =
         )
       ).unwrap().then((bioEntityContents) => {
         PluginsEventBus.dispatchEvent('onSearch', {
-          type: 'bioEntity',
+          type: 'reaction',
           searchValues: [closestSearchResult],
-          results: [bioEntityContents],
+          results: [[...bioEntityContents, reaction]],
         });
 
         if (searchConfig && searchConfig.hasFitBounds) {

src/services/pluginsManager/pluginsEventBus/pluginsEventBus.types.ts

@@ -5,6 +5,7 @@ import {
   Drug,
   ElementSearchResult,
   MapOverlay,
+  Reaction,
 } from '@/types/models';
 import { dispatchEvent } from './pluginsEventBus';
 
@@ -53,6 +54,12 @@ export type ClickedSurfaceOverlay = {
   id: number | string;
 };
 
+export type SearchDataReaction = {
+  type: 'reaction';
+  searchValues: string[] | ElementSearchResult[];
+  results: (BioEntityContent | Reaction)[][];
+};
+
 export type SearchDataBioEntity = {
   type: 'bioEntity';
   searchValues: string[] | ElementSearchResult[];
@@ -75,7 +82,11 @@ export type PluginUnloaded = {
   hash: string;
 };
 
-export type SearchData = SearchDataBioEntity | SearchDataDrugs | SearchDataChemicals;
+export type SearchData =
+  | SearchDataBioEntity
+  | SearchDataDrugs
+  | SearchDataChemicals
+  | SearchDataReaction;
 
 export type EventsData =
   | CreatedOverlay