diff --git a/docs/plugins/events.md b/docs/plugins/events.md
new file mode 100644
index 0000000000000000000000000000000000000000..957b28a29c0bbde50cd8fc105001e55976bbe822
--- /dev/null
+++ b/docs/plugins/events.md
@@ -0,0 +1,291 @@
+### Events
+
+Plugins can interact with Minerva by subscribing to events. These events allow plugins to respond to user actions, system events, or changes in the application state.
+
+#### Add Event Listener
+
+To listen for specific events, plugins can use the `addListener` method in `events` object returned by `window.minerva.plugins.registerPlugin`. This method takes two arguments: the name of the event and a callback function to handle the event.
+**Available Events**:
+
+- onAddDataOverlay - triggered after successfully adding an overlay; the created overlay is passed as an argument. Example argument:
+
+```javascript
+{
+ "name": "Example Overlay",
+ "googleLicenseConsent": false,
+ "creator": "appu-admin",
+ "description": "Different",
+ "genomeType": null,
+ "genomeVersion": null,
+ "idObject": 149,
+ "publicOverlay": false,
+ "type": "GENERIC",
+ "order": 9
+}
+```
+
+- onRemoveDataOverlay - triggered after successfully removing an overlay; the ID of the removed overlay is passed as an argument. Example argument:
+
+```
+43
+```
+
+- onShowOverlay - triggered after displaying an overlay on the map; the displayed overlay is passed as an argument. Example argument:
+
+```javascript
+{
+ "name": "Generic advanced format overlay",
+ "googleLicenseConsent": false,
+ "creator": "appu-admin",
+ "description": "Data set provided by a user",
+ "genomeType": null,
+ "genomeVersion": null,
+ "idObject": 20,
+ "publicOverlay": true,
+ "type": "GENERIC",
+ "order": 9
+}
+```
+
+- onHideOverlay - triggered after disabling an overlay on the map; the disabled overlay is passed as an argument. Example argument:
+
+```javascript
+{
+ "name": "colored overlay",
+ "googleLicenseConsent": false,
+ "creator": "appu-admin",
+ "description": "",
+ "genomeType": null,
+ "genomeVersion": null,
+ "idObject": 24,
+ "publicOverlay": true,
+ "type": "GENERIC",
+ "order": 10
+}
+```
+
+- onBackgroundOverlayChange - triggered after changing the background; the identifier of the new background is passed as an argument. Example argument:
+
+```
+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:
+
+```javascript
+{
+ type: 'drugs',
+ searchValues: ['PRKN'],
+ results: [
+ [{
+ bioEntity: {
+ id: 38253,
+ model: 52,
+ glyph: null,
+ submodel: null,
+ compartment: 46644,
+ elementId: 'path_0_sa11305',
+ x: 18412,
+ y: 3088.653195488725,
+ z: 2298,
+ width: 80,
+ height: 40,
+ fontSize: 12,
+ fontColor: {
+ alpha: 255,
+ rgb: -16777216,
+ },
+ fillColor: {
+ alpha: 255,
+ rgb: -3342388,
+ },
+ borderColor: {
+ alpha: 255,
+ rgb: -16777216,
+ },
+ visibilityLevel: '4',
+ transparencyLevel: '0',
+ notes: '',
+ symbol: 'PRKN',
+ fullName: 'parkin RBR E3 ubiquitin protein ligase',
+ abbreviation: null,
+ formula: null,
+ name: 'PRKN',
+ nameX: 18412,
+ nameY: 3088.653195488725,
+ nameWidth: 80,
+ nameHeight: 40,
+ nameVerticalAlign: 'MIDDLE',
+ nameHorizontalAlign: 'CENTER',
+ synonyms: ['AR-JP', 'PDJ', 'parkin'],
+ formerSymbols: ['PARK2'],
+ activity: false,
+ lineWidth: 1,
+ complex: 38252,
+ initialAmount: null,
+ charge: null,
+ initialConcentration: 0,
+ onlySubstanceUnits: false,
+ homodimer: 1,
+ hypothetical: null,
+ boundaryCondition: false,
+ constant: false,
+ modificationResidues: [{
+ id: 58046,
+ idModificationResidue: 'rs2',
+ name: '',
+ x: 18481.67916137211,
+ y: 3118.9740341163433,
+ z: 2299,
+ width: 15,
+ height: 15,
+ borderColor: {
+ alpha: 255,
+ rgb: -16777216,
+ },
+ fontSize: 10,
+ state: null,
+ size: 225,
+ center: {
+ x: 18489.17916137211,
+ y: 3126.4740341163433,
+ },
+ elementId: 'rs2',
+ }, ],
+ stringType: 'Protein',
+ substanceUnits: null,
+ references: [{
+ link: 'https://www.genenames.org/cgi-bin/gene_symbol_report?match=PRKN',
+ type: 'HGNC_SYMBOL',
+ resource: 'PRKN',
+ id: 173229,
+ annotatorClassName: 'lcsb.mapviewer.annotation.services.annotators.HgncAnnotator',
+ }, ],
+ compartmentName: 'Dopamine metabolism',
+ complexName: 'insoluble aggregates',
+ },
+ perfect: true,
+ }, ],
+ ],
+};
+```
+
+- onClear - after clearing the search; no arguments are passed
+
+- onZoomChanged - triggered after changing the zoom level on the map; the zoom level and the map ID are passed as argument. Example argument:
+
+```javascript
+{
+ "modelId": 52,
+ "zoom": 9.033753064925367
+}
+```
+
+- onCenterChanged - triggered after the coordinates of the map center change; the coordinates of the center and map ID are passed as argument. Example argument:
+
+```javascript
+{
+ "modelId": 52,
+ "x": 8557,
+ "y": 1675
+}
+```
+
+- onBioEntityClick - triggered when someone clicks on a pin; the element to which the pin is attached is passed as an argument. Example argument:
+
+```javascript
+{
+ "id": 40072,
+ "modelId": 52,
+ "type": "ALIAS"
+}
+```
+
+- onSubmapOpen - triggered when submap opens; the submap identifier is passed as an argument. Example argument:
+
+```
+52
+```
+
+- onSubmapClose - triggered when a submap closes; the submap identifier is passed as an argument. Example argument:
+
+```
+51
+```
+
+##### Example of adding event listener:
+
+```javascript
+const {
+ element,
+ events: { addListener, removeListener, removeAllListeners },
+} = minerva.plugins.registerPlugin({
+ pluginName,
+ pluginVersion,
+ pluginUrl,
+});
+
+const callbackShowOverlay = data => {
+ console.log('onShowOverlay', data);
+};
+
+addListener('onShowOverlay', callbackShowOverlay);
+```
+
+#### Remove Event Listener
+
+To remove event listener, plugins can use the `removeListener` method in `events` object returned by `window.minerva.plugins.registerPlugin`. This method takes two arguments: the name of the event and the reference to the callback function previously used to add the listener.
+
+```javascript
+const {
+ element,
+ events: { addListener, removeListener, removeAllListeners },
+} = minerva.plugins.registerPlugin({
+ pluginName,
+ pluginVersion,
+ pluginUrl,
+});
+
+const callbackShowOverlay = data => {
+ console.log('onShowOverlay', data);
+};
+
+addListener('onShowOverlay', callbackShowOverlay);
+
+removeListener('onShowOverlay', callbackShowOverlay);
+```
+
+#### Remove All Event Listeners
+
+To remove all event listeners attached by a plugin, plugins can use the `removeAllListeners` method in `events` object returned by `window.minerva.plugins.registerPlugin`.
+
+```javascript
+const {
+ element,
+ events: { addListener, removeListener, removeAllListeners },
+} = minerva.plugins.registerPlugin({
+ pluginName,
+ pluginVersion,
+ pluginUrl,
+});
+
+const callbackShowOverlay = data => {
+ console.log('onShowOverlay', data);
+};
+
+const callbackHideOverlay = data => {
+ console.log('onHideOverlay', data);
+};
+
+const callbackOpenSubamp = data => {
+ console.log('onSubmapOpen', data);
+};
+
+addListener('onHideOverlay', callbackHideOverlay);
+
+addListener('onSubmapOpen', callbackOpenSubamp);
+
+addListener('onShowOverlay', callbackShowOverlay);
+
+removeAllListeners();
+```
diff --git a/docs/plugins.md b/docs/plugins/plugins.md
similarity index 73%
rename from docs/plugins.md
rename to docs/plugins/plugins.md
index 58af6267784516957b43981226f5e22bbd95820e..1636f258387c5e49c2fab61848a79db723bff32b 100644
--- a/docs/plugins.md
+++ b/docs/plugins/plugins.md
@@ -62,20 +62,44 @@ const createStructure = () => {
`<div class="flex flex-col items-center p-2.5">
<h1 class="text-lg">My plugin ${minerva.configuration.overlayTypes[0].name}</h1>
<input class="mt-2.5 p-2.5 rounded-s font-semibold outline-none border border-[#cacaca] bg-[#f7f7f8]" value="https://minerva-dev.lcsb.uni.lu/minerva">
+ <button type="button" id="remove-listeners">Remove all event listeners</button>
+ <button type="button" id="remove-listener">Remove onShowOverlay listener</button>
</div>`,
).appendTo(pluginContainer);
};
function initPlugin() {
- const { element } = window.minerva.plugins.registerPlugin({
- pluginName: 'perfect-plugin',
- pluginVersion: '9.9.9',
- pluginUrl: 'https://example.com/plugins/perfect-plugin.js',
+ const {
+ element,
+ events: { addListener, removeListener, removeAllListeners },
+ } = minerva.plugins.registerPlugin({
+ pluginName,
+ pluginVersion,
+ pluginUrl,
});
pluginContainer = element;
-
createStructure();
+
+ const callbackShowOverlay = data => {
+ console.log('onShowOverlay', data);
+ };
+
+ const callbackRemoveDataOverlay = data => {
+ console.log('onRemoveDataOverlay', data);
+ };
+
+ addListener('onShowOverlay', callbackShowOverlay);
+
+ addListener('onRemoveDataOverlay', callbackRemoveDataOverlay);
+
+ $('#remove-listener').on('click', function () {
+ removeListener('onShowOverlay', callbackShowOverlay);
+ });
+
+ $('#remove-listeners').on('click', function () {
+ removeAllListeners();
+ });
}
initPlugin();
diff --git a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx
index 051bc4d73ffb780eceff010f71b235f579a9060c..f6a1cbfe164bc1eeda880d4490e52ff858c30d0c 100644
--- a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx
+++ b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.test.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable no-magic-numbers */
import {
InitialStoreState,
getReduxWrapperWithStore,
@@ -5,6 +6,8 @@ import {
import { StoreType } from '@/redux/store';
import { initialMapDataFixture, openedMapsThreeSubmapsFixture } from '@/redux/map/map.fixtures';
import { act, render, screen, within } from '@testing-library/react';
+import { MODELS_DATA_MOCK_WITH_MAIN_MAP } from '@/redux/models/models.mock';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { MapNavigation } from './MapNavigation.component';
const MAIN_MAP_ID = 5053;
@@ -103,6 +106,7 @@ describe('MapNavigation - component', () => {
it('should close map and open main map if closed currently selected map', async () => {
const { store } = renderComponent({
+ models: MODELS_DATA_MOCK_WITH_MAIN_MAP,
map: {
data: {
...initialMapDataFixture,
@@ -132,4 +136,88 @@ describe('MapNavigation - component', () => {
expect(isHistamineMapOpened).toBe(false);
expect(modelId).toBe(MAIN_MAP_ID);
});
+ describe('plugin event bus', () => {
+ beforeEach(() => {
+ PluginsEventBus.events = [];
+ });
+ afterEach(() => {
+ jest.clearAllMocks();
+ });
+ it('should dispatch event if it closes active map and set main map as active', async () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+
+ renderComponent({
+ models: MODELS_DATA_MOCK_WITH_MAIN_MAP,
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: HISTAMINE_MAP_ID,
+ },
+ openedMaps: openedMapsThreeSubmapsFixture,
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ });
+
+ const histamineMapButton = screen.getByRole('button', { name: 'Histamine signaling' });
+ const histamineMapCloseButton = await within(histamineMapButton).getByTestId('close-icon');
+ await act(() => {
+ histamineMapCloseButton.click();
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(2);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapClose', 5052);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapOpen', 52);
+ });
+ it('should not dispatch event if it closes not active map', async () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+
+ renderComponent({
+ models: MODELS_DATA_MOCK_WITH_MAIN_MAP,
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: HISTAMINE_MAP_ID,
+ },
+ openedMaps: openedMapsThreeSubmapsFixture,
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ });
+
+ const prknMapButton = screen.getByRole('button', { name: 'PRKN substrates' });
+ const prknMapCloseButton = await within(prknMapButton).getByTestId('close-icon');
+ await act(() => {
+ prknMapCloseButton.click();
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(0);
+ });
+ it('should dispatch event if it switches to new tab and set is as active map', async () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+
+ renderComponent({
+ models: MODELS_DATA_MOCK_WITH_MAIN_MAP,
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: HISTAMINE_MAP_ID,
+ },
+ openedMaps: openedMapsThreeSubmapsFixture,
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ });
+
+ const prknMapButton = screen.getByRole('button', { name: 'PRKN substrates' });
+
+ await act(() => {
+ prknMapButton.click();
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(2);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapClose', 5052);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapOpen', 5054);
+ });
+ });
});
diff --git a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx
index 293fba3afa23d0b794be74c90a7fe10966f011d8..bab3d90aede6a9df3860d67ab25c4a10c546d8d7 100644
--- a/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx
+++ b/src/components/FunctionalArea/MapNavigation/MapNavigation.component.tsx
@@ -4,6 +4,8 @@ import { MAIN_MAP } from '@/redux/map/map.constants';
import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
import { closeMap, closeMapAndSetMainMapActive, setActiveMap } from '@/redux/map/map.slice';
import { OppenedMap } from '@/redux/map/map.types';
+import { mainMapModelSelector } from '@/redux/models/models.selectors';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { Button } from '@/shared/Button';
import { Icon } from '@/shared/Icon';
import { MouseEvent } from 'react';
@@ -13,6 +15,7 @@ export const MapNavigation = (): JSX.Element => {
const dispatch = useAppDispatch();
const openedMaps = useAppSelector(mapOpenedMapsSelector);
const currentModelId = useAppSelector(mapModelIdSelector);
+ const mainMapModel = useAppSelector(state => mainMapModelSelector(state));
const isActive = (modelId: number): boolean => currentModelId === modelId;
const isNotMainMap = (modelName: string): boolean => modelName !== MAIN_MAP;
@@ -21,6 +24,9 @@ export const MapNavigation = (): JSX.Element => {
event.stopPropagation();
if (isActive(map.modelId)) {
dispatch(closeMapAndSetMainMapActive({ modelId: map.modelId }));
+
+ PluginsEventBus.dispatchEvent('onSubmapClose', map.modelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', mainMapModel.idObject);
} else {
dispatch(closeMap({ modelId: map.modelId }));
}
@@ -28,6 +34,10 @@ export const MapNavigation = (): JSX.Element => {
const onSubmapTabClick = (map: OppenedMap): void => {
dispatch(setActiveMap(map));
+ if (currentModelId !== map.modelId) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', map.modelId);
+ }
};
return (
diff --git a/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.test.ts b/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.test.ts
index 8fcac18fbda172096b00d88362d8ec73476a098f..6430cb9905d226d848147e39d267ee9bcdc1664b 100644
--- a/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.test.ts
+++ b/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.test.ts
@@ -71,8 +71,8 @@ describe('useEditOverlay', () => {
expect(actions[0].type).toBe('overlays/removeOverlay/pending');
- const { login, overlayId } = actions[0].meta.arg;
- expect(login).toBe('test');
+ const { overlayId } = actions[0].meta.arg;
+
expect(overlayId).toBe(overlayFixture.idObject);
});
it('should not handle handleRemoveOverlay if proper data is not provided', () => {
diff --git a/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.ts b/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.ts
index adb7778cddb6a3959480fe319a97ea888efca29a..63a98d5e96cacc5fb1d6c5f34f0a5ba94a5f2ec2 100644
--- a/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.ts
+++ b/src/components/FunctionalArea/Modal/EditOverlayModal/hooks/useEditOverlay.ts
@@ -48,7 +48,7 @@ export const useEditOverlay = (): UseEditOverlayReturn => {
const handleRemoveOverlay = (): void => {
if (!login || !currentEditedOverlay) return;
- dispatch(removeOverlay({ overlayId: currentEditedOverlay.idObject, login }));
+ dispatch(removeOverlay({ overlayId: currentEditedOverlay.idObject }));
};
const handleUpdateOverlay = async ({
@@ -67,8 +67,8 @@ export const useEditOverlay = (): UseEditOverlayReturn => {
);
};
- const getUserOverlaysByCreator = async (creator: string): Promise<void> => {
- await dispatch(getAllUserOverlaysByCreator(creator));
+ const getUserOverlaysByCreator = async (): Promise<void> => {
+ await dispatch(getAllUserOverlaysByCreator());
};
const handleCloseModal = (): void => {
@@ -83,7 +83,7 @@ export const useEditOverlay = (): UseEditOverlayReturn => {
overlayName: name,
});
- await getUserOverlaysByCreator(login);
+ await getUserOverlaysByCreator();
handleCloseModal();
};
diff --git a/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.test.tsx b/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.test.tsx
index 4b59aaa789cd62276e130533d5d3dd710747a364..9154bdddc543cb52533ca8f7d0ab8b15f7fdd3c9 100644
--- a/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.test.tsx
+++ b/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.test.tsx
@@ -1,12 +1,19 @@
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';
import { StoreType } from '@/redux/store';
import {
InitialStoreState,
getReduxWrapperWithStore,
} from '@/utils/testing/getReduxWrapperWithStore';
import { act } from 'react-dom/test-utils';
+import { mockNetworkResponse } from '@/utils/mockNetworkResponse';
+import { apiPath } from '@/redux/apiPath';
+import { HttpStatusCode } from 'axios';
+import { loginFixture } from '@/models/fixtures/loginFixture';
+import { overlaysFixture } from '@/models/fixtures/overlaysFixture';
import { LoginModal } from './LoginModal.component';
+const mockedAxiosClient = mockNetworkResponse();
+
const renderComponent = (initialStoreState: InitialStoreState = {}): { store: StoreType } => {
const { Wrapper, store } = getReduxWrapperWithStore(initialStoreState);
@@ -22,40 +29,71 @@ const renderComponent = (initialStoreState: InitialStoreState = {}): { store: St
);
};
-test('renders LoginModal component', () => {
- renderComponent();
+describe('LoginModal - component', () => {
+ test('renders LoginModal component', () => {
+ renderComponent();
- const loginInput = screen.getByLabelText(/login/i);
- const passwordInput = screen.getByLabelText(/password/i);
- expect(loginInput).toBeInTheDocument();
- expect(passwordInput).toBeInTheDocument();
-});
+ const loginInput = screen.getByLabelText(/login/i);
+ const passwordInput = screen.getByLabelText(/password/i);
+ expect(loginInput).toBeInTheDocument();
+ expect(passwordInput).toBeInTheDocument();
+ });
-test('handles input change correctly', () => {
- renderComponent();
+ test('handles input change correctly', () => {
+ renderComponent();
- const loginInput: HTMLInputElement = screen.getByLabelText(/login/i);
- const passwordInput: HTMLInputElement = screen.getByLabelText(/password/i);
+ const loginInput: HTMLInputElement = screen.getByLabelText(/login/i);
+ const passwordInput: HTMLInputElement = screen.getByLabelText(/password/i);
- fireEvent.change(loginInput, { target: { value: 'testuser' } });
- fireEvent.change(passwordInput, { target: { value: 'testpassword' } });
+ fireEvent.change(loginInput, { target: { value: 'testuser' } });
+ fireEvent.change(passwordInput, { target: { value: 'testpassword' } });
- expect(loginInput.value).toBe('testuser');
- expect(passwordInput.value).toBe('testpassword');
-});
+ expect(loginInput.value).toBe('testuser');
+ expect(passwordInput.value).toBe('testpassword');
+ });
-test('submits form', () => {
- renderComponent();
+ test('submits form', () => {
+ renderComponent();
- const loginInput = screen.getByLabelText(/login/i);
- const passwordInput = screen.getByLabelText(/password/i);
- const submitButton = screen.getByText(/submit/i);
+ const loginInput = screen.getByLabelText(/login/i);
+ const passwordInput = screen.getByLabelText(/password/i);
+ const submitButton = screen.getByText(/submit/i);
- fireEvent.change(loginInput, { target: { value: 'testuser' } });
- fireEvent.change(passwordInput, { target: { value: 'testpassword' } });
- act(() => {
- submitButton.click();
+ fireEvent.change(loginInput, { target: { value: 'testuser' } });
+ fireEvent.change(passwordInput, { target: { value: 'testpassword' } });
+ act(() => {
+ submitButton.click();
+ });
+
+ expect(submitButton).toBeDisabled();
});
+ it('should fetch user overlays when login is successful', async () => {
+ mockedAxiosClient.onPost(apiPath.postLogin()).reply(HttpStatusCode.Ok, loginFixture);
+ mockedAxiosClient
+ .onGet(
+ apiPath.getAllUserOverlaysByCreatorQuery({
+ creator: loginFixture.login,
+ publicOverlay: false,
+ }),
+ )
+ .reply(HttpStatusCode.Ok, overlaysFixture);
+
+ const { store } = renderComponent();
+ const loginInput = screen.getByLabelText(/login/i);
+ const passwordInput = screen.getByLabelText(/password/i);
+ const submitButton = screen.getByText(/submit/i);
+
+ fireEvent.change(loginInput, { target: { value: loginFixture.login } });
+ fireEvent.change(passwordInput, { target: { value: 'testpassword' } });
+ act(() => {
+ submitButton.click();
+ });
- expect(submitButton).toBeDisabled();
+ await waitFor(() => {
+ expect(store.getState().user.loading).toBe('succeeded');
+ });
+
+ expect(store.getState().overlays.userOverlays.loading).toBe('succeeded');
+ expect(store.getState().overlays.userOverlays.data).toEqual(overlaysFixture);
+ });
});
diff --git a/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.tsx b/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.tsx
index 40ac94361133d1a08a9d31260dd277a28c7f35d6..3fa89a01282b34bd7a1dec3b1b3698f260ea16c8 100644
--- a/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.tsx
+++ b/src/components/FunctionalArea/Modal/LoginModal/LoginModal.component.tsx
@@ -1,5 +1,6 @@
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
+import { getAllUserOverlaysByCreator } from '@/redux/overlays/overlays.thunks';
import { loadingUserSelector } from '@/redux/user/user.selectors';
import { login } from '@/redux/user/user.thunks';
import { Button } from '@/shared/Button';
@@ -18,9 +19,10 @@ export const LoginModal: React.FC = () => {
setCredentials(prevCredentials => ({ ...prevCredentials, [name]: value }));
};
- const handleSubmit = (e: React.FormEvent<HTMLFormElement>): void => {
+ const handleSubmit = async (e: React.FormEvent<HTMLFormElement>): Promise<void> => {
e.preventDefault();
- dispatch(login(credentials));
+ await dispatch(login(credentials));
+ dispatch(getAllUserOverlaysByCreator());
};
return (
diff --git a/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.test.ts b/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.test.ts
index c0df892c5e7a03016d752a3d1ae78f208bb33ad9..55c6230d3e238a7a7595957d217c1025aafaaa65 100644
--- a/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.test.ts
+++ b/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.test.ts
@@ -1,3 +1,4 @@
+/* eslint-disable no-magic-numbers */
import { projectFixture } from '@/models/fixtures/projectFixture';
import { MODELS_MOCK_SHORT } from '@/models/mocks/modelsMock';
import {
@@ -15,6 +16,7 @@ import { OverviewImageLink } from '@/types/models';
import { getReduxStoreWithActionsListener } from '@/utils/testing/getReduxStoreActionsListener';
import { getReduxWrapperWithStore } from '@/utils/testing/getReduxWrapperWithStore';
import { renderHook } from '@testing-library/react';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import {
FIRST_ARRAY_ELEMENT,
NOOP,
@@ -303,4 +305,252 @@ describe('useOverviewImageLinkActions - hook', () => {
expect(NOOP).toBeCalled();
});
});
+ describe('plugin event bus', () => {
+ beforeEach(() => {
+ PluginsEventBus.events = [];
+ });
+ afterEach(() => {
+ jest.clearAllMocks();
+ });
+ it('should dispatch event if coordinates changed', () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+ const { Wrapper } = getReduxStoreWithActionsListener({
+ project: {
+ data: {
+ ...projectFixture,
+ overviewImageViews: [
+ {
+ ...PROJECT_OVERVIEW_IMAGE_MOCK,
+ height: 500,
+ width: 500,
+ },
+ ],
+ topOverviewImage: PROJECT_OVERVIEW_IMAGE_MOCK,
+ },
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ modal: {
+ ...MODAL_INITIAL_STATE_MOCK,
+ overviewImagesState: {
+ imageId: PROJECT_OVERVIEW_IMAGE_MOCK.idObject,
+ },
+ },
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: 5053,
+ },
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ openedMaps: openedMapsInitialValueFixture,
+ },
+ models: {
+ data: MODELS_MOCK_SHORT,
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ },
+ });
+
+ const {
+ result: {
+ current: { handleLinkClick },
+ },
+ } = renderHook(() => useOverviewImageLinkActions(), {
+ wrapper: Wrapper,
+ });
+
+ handleLinkClick(OVERVIEW_LINK_MODEL_MOCK);
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(2);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onZoomChanged', { modelId: 5053, zoom: 7 });
+ expect(dispatchEventMock).toHaveBeenCalledWith('onCenterChanged', {
+ modelId: 5053,
+ x: 15570,
+ y: 3016,
+ });
+ });
+ it('should not dispatch event if coordinates do not changed', () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+ const { Wrapper } = getReduxStoreWithActionsListener({
+ project: {
+ data: {
+ ...projectFixture,
+ overviewImageViews: [
+ {
+ ...PROJECT_OVERVIEW_IMAGE_MOCK,
+ height: 500,
+ width: 500,
+ },
+ ],
+ topOverviewImage: PROJECT_OVERVIEW_IMAGE_MOCK,
+ },
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: 5053,
+ position: {
+ initial: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ last: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ },
+ },
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ openedMaps: openedMapsInitialValueFixture,
+ },
+ models: {
+ data: MODELS_MOCK_SHORT,
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ },
+ });
+
+ const {
+ result: {
+ current: { handleLinkClick },
+ },
+ } = renderHook(() => useOverviewImageLinkActions(), {
+ wrapper: Wrapper,
+ });
+
+ handleLinkClick({
+ ...OVERVIEW_LINK_MODEL_MOCK,
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(0);
+ });
+ it('should dispatch event if new submap has different id than current opened map', () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+ const { Wrapper } = getReduxStoreWithActionsListener({
+ project: {
+ data: {
+ ...projectFixture,
+ overviewImageViews: [
+ {
+ ...PROJECT_OVERVIEW_IMAGE_MOCK,
+ height: 500,
+ width: 500,
+ },
+ ],
+ topOverviewImage: PROJECT_OVERVIEW_IMAGE_MOCK,
+ },
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: 5054,
+ position: {
+ initial: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ last: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ },
+ },
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ openedMaps: openedMapsInitialValueFixture,
+ },
+ models: {
+ data: MODELS_MOCK_SHORT,
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ },
+ });
+
+ const {
+ result: {
+ current: { handleLinkClick },
+ },
+ } = renderHook(() => useOverviewImageLinkActions(), {
+ wrapper: Wrapper,
+ });
+
+ handleLinkClick({
+ ...OVERVIEW_LINK_MODEL_MOCK,
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(2);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapClose', 5054);
+ expect(dispatchEventMock).toHaveBeenCalledWith('onSubmapOpen', 5053);
+ });
+ it('should not dispatch event if provided submap to open is already opened', () => {
+ const dispatchEventMock = jest.spyOn(PluginsEventBus, 'dispatchEvent');
+ const { Wrapper } = getReduxStoreWithActionsListener({
+ project: {
+ data: {
+ ...projectFixture,
+ overviewImageViews: [
+ {
+ ...PROJECT_OVERVIEW_IMAGE_MOCK,
+ height: 500,
+ width: 500,
+ },
+ ],
+ topOverviewImage: PROJECT_OVERVIEW_IMAGE_MOCK,
+ },
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ map: {
+ data: {
+ ...initialMapDataFixture,
+ modelId: 5053,
+ position: {
+ initial: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ last: {
+ x: 15570.0,
+ y: 3016.0,
+ z: 7,
+ },
+ },
+ },
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ openedMaps: openedMapsInitialValueFixture,
+ },
+ models: {
+ data: MODELS_MOCK_SHORT,
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ },
+ });
+
+ const {
+ result: {
+ current: { handleLinkClick },
+ },
+ } = renderHook(() => useOverviewImageLinkActions(), {
+ wrapper: Wrapper,
+ });
+
+ handleLinkClick({
+ ...OVERVIEW_LINK_MODEL_MOCK,
+ });
+
+ expect(dispatchEventMock).toHaveBeenCalledTimes(0);
+ });
+ });
});
diff --git a/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.ts b/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.ts
index 1388a45a82c05425f769e3d6fff4ce5d05b7c98b..8a8689aa8029ca6877508bd0c00bea85cc350571 100644
--- a/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.ts
+++ b/src/components/FunctionalArea/Modal/OverviewImagesModal/utils/useOverviewImageLinkActions.ts
@@ -1,12 +1,13 @@
import { NOOP } from '@/constants/common';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
-import { mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { mapDataLastPositionSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
import { openMapAndSetActive, setActiveMap, setMapPosition } from '@/redux/map/map.slice';
import { closeModal, setOverviewImageId } from '@/redux/modal/modal.slice';
-import { modelsDataSelector } from '@/redux/models/models.selectors';
+import { currentModelIdSelector, modelsDataSelector } from '@/redux/models/models.selectors';
import { projectOverviewImagesSelector } from '@/redux/project/project.selectors';
import { MapModel, OverviewImageLink, OverviewImageLinkModel } from '@/types/models';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import {
OverviewImageLinkImageHandler,
OverviewImageLinkModelHandler,
@@ -21,6 +22,8 @@ export const useOverviewImageLinkActions = (): UseOverviewImageLinkActionsResult
const openedMaps = useAppSelector(mapOpenedMapsSelector);
const models = useAppSelector(modelsDataSelector);
const overviewImages = useAppSelector(projectOverviewImagesSelector);
+ const currentMapModelId = useAppSelector(currentModelIdSelector);
+ const mapLastPosition = useAppSelector(mapDataLastPositionSelector);
const checkIfImageIsAvailable = (imageId: number): boolean =>
overviewImages.some(image => image.idObject === imageId);
@@ -35,6 +38,10 @@ export const useOverviewImageLinkActions = (): UseOverviewImageLinkActionsResult
const modelId = model.idObject;
const isMapOpened = checkIfMapAlreadyOpened(modelId);
+ if (currentMapModelId !== modelId) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentMapModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', modelId);
+ }
if (isMapOpened) {
dispatch(setActiveMap({ modelId }));
return;
@@ -44,11 +51,30 @@ export const useOverviewImageLinkActions = (): UseOverviewImageLinkActionsResult
};
const handleSetMapPosition = (link: OverviewImageLinkModel, model: MapModel): void => {
+ const zoom = link.zoomLevel + model.minZoom;
+ const { x } = link.modelPoint;
+ const { y } = link.modelPoint;
+
+ if (mapLastPosition.z !== zoom) {
+ PluginsEventBus.dispatchEvent('onZoomChanged', {
+ modelId: currentMapModelId,
+ zoom,
+ });
+ }
+
+ if (mapLastPosition.x !== x || mapLastPosition.y !== y) {
+ PluginsEventBus.dispatchEvent('onCenterChanged', {
+ modelId: currentMapModelId,
+ x,
+ y,
+ });
+ }
+
dispatch(
setMapPosition({
- x: link.modelPoint.x,
- y: link.modelPoint.y,
- z: link.zoomLevel + model.minZoom,
+ x,
+ y,
+ z: zoom,
}),
);
};
diff --git a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/UserOverlaysWithoutGroup.component.test.tsx b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/UserOverlaysWithoutGroup.component.test.tsx
index 1174b330a03faa1d38a7ae3b3fb93b4682bc0b3f..26ab204a4836efb4ca1d691a3de26f330ecd3cf4 100644
--- a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/UserOverlaysWithoutGroup.component.test.tsx
+++ b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/UserOverlaysWithoutGroup.component.test.tsx
@@ -81,7 +81,13 @@ describe('UserOverlaysWithoutGroup - component', () => {
error: DEFAULT_ERROR,
login: 'test',
},
- overlays: OVERLAYS_INITIAL_STATE_MOCK,
+ overlays: {
+ ...OVERLAYS_INITIAL_STATE_MOCK,
+ userOverlays: {
+ ...OVERLAYS_INITIAL_STATE_MOCK.userOverlays,
+ loading: 'pending',
+ },
+ },
});
expect(screen.getByText('Loading...')).toBeInTheDocument();
diff --git a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.test.ts b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.test.ts
index 230d5c13df247dd24c121257ad495dfa93a908f3..46f86e84158116f22a39a49dcbfe4425f5008f0a 100644
--- a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.test.ts
+++ b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.test.ts
@@ -1,6 +1,6 @@
/* eslint-disable no-magic-numbers */
import { getReduxStoreWithActionsListener } from '@/utils/testing/getReduxStoreActionsListener';
-import { renderHook, waitFor } from '@testing-library/react';
+import { renderHook } from '@testing-library/react';
import { DEFAULT_ERROR } from '@/constants/errors';
import { overlayFixture, overlaysFixture } from '@/models/fixtures/overlaysFixture';
import { mockNetworkResponse } from '@/utils/mockNetworkResponse';
@@ -13,40 +13,6 @@ import { useUserOverlays } from './useUserOverlays';
const mockedAxiosClient = mockNetworkResponse();
describe('useUserOverlays', () => {
- it('should fetch user overlays on mount if login exists', async () => {
- mockedAxiosClient
- .onGet(
- apiPath.getAllUserOverlaysByCreatorQuery({
- publicOverlay: false,
- creator: 'test',
- }),
- )
- .reply(HttpStatusCode.Ok, overlaysFixture);
-
- const { Wrapper, store } = getReduxStoreWithActionsListener({
- user: {
- authenticated: true,
- loading: 'succeeded',
- error: DEFAULT_ERROR,
- login: 'test',
- },
- overlays: OVERLAYS_INITIAL_STATE_MOCK,
- });
-
- renderHook(() => useUserOverlays(), {
- wrapper: Wrapper,
- });
-
- const actions = store.getActions();
- const firstAction = actions[0];
-
- expect(firstAction.meta.arg).toBe('test');
- expect(firstAction.type).toBe('overlays/getAllUserOverlaysByCreator/pending');
-
- await waitFor(() => {
- expect(actions[1].type).toBe('overlays/getAllUserOverlaysByCreator/fulfilled');
- });
- });
it('should not fetch user overlays on mount if login does not exist', async () => {
const { Wrapper, store } = getReduxStoreWithActionsListener({
user: {
@@ -196,9 +162,8 @@ describe('useUserOverlays', () => {
updateUserOverlaysOrder();
const actions = store.getActions();
- expect(actions[1].type).toBe('overlays/getAllUserOverlaysByCreator/fulfilled');
- const secondAction = actions[2];
- expect(secondAction.type).toBe('overlays/updateOverlays/pending');
+ const firstAction = actions[0];
+ expect(firstAction.type).toBe('overlays/updateOverlays/pending');
});
});
diff --git a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.ts b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.ts
index 2fe3ee559c9022bf6c05bd336dccbba7c8ae8bc2..7d0114eb7960626a20f034edff334cffafb03b8f 100644
--- a/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.ts
+++ b/src/components/Map/Drawer/OverlaysDrawer/UserOverlays/UserOverlaysWithoutGroup/hooks/useUserOverlays.ts
@@ -5,8 +5,7 @@ import {
loadingUserOverlaysSelector,
userOverlaysDataSelector,
} from '@/redux/overlays/overlays.selectors';
-import { getAllUserOverlaysByCreator, updateOverlays } from '@/redux/overlays/overlays.thunks';
-import { loginUserSelector } from '@/redux/user/user.selectors';
+import { updateOverlays } from '@/redux/overlays/overlays.thunks';
import { MapOverlay } from '@/types/models';
import { useEffect, useState } from 'react';
import { moveArrayElement } from '../UserOverlaysWithoutGroup.utils';
@@ -20,18 +19,11 @@ type UseUserOverlaysReturn = {
export const useUserOverlays = (): UseUserOverlaysReturn => {
const dispatch = useAppDispatch();
- const login = useAppSelector(loginUserSelector);
const [userOverlaysList, setUserOverlaysList] = useState<MapOverlay[]>([]);
const userOverlays = useAppSelector(userOverlaysDataSelector);
const loadingUserOverlays = useAppSelector(loadingUserOverlaysSelector);
const isPending = loadingUserOverlays === 'pending';
- useEffect(() => {
- if (login) {
- dispatch(getAllUserOverlaysByCreator(login));
- }
- }, [login, dispatch]);
-
useEffect(() => {
if (userOverlays) {
setUserOverlaysList(userOverlays);
diff --git a/src/components/Map/Drawer/OverlaysDrawer/hooks/useEmptyBackground.ts b/src/components/Map/Drawer/OverlaysDrawer/hooks/useEmptyBackground.ts
index 2536fa84e049dd7dc659040a96933d3287639436..fb2eae6c68e0e26cd2c240a3b2d17adaf75c266f 100644
--- a/src/components/Map/Drawer/OverlaysDrawer/hooks/useEmptyBackground.ts
+++ b/src/components/Map/Drawer/OverlaysDrawer/hooks/useEmptyBackground.ts
@@ -3,6 +3,7 @@ import { emptyBackgroundIdSelector } from '@/redux/backgrounds/background.select
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
import { setMapBackground } from '@/redux/map/map.slice';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
type UseEmptyBackgroundReturn = {
setBackgroundtoEmptyIfAvailable: () => void;
@@ -15,6 +16,8 @@ export const useEmptyBackground = (): UseEmptyBackgroundReturn => {
const setBackgroundtoEmptyIfAvailable = useCallback(() => {
if (emptyBackgroundId) {
dispatch(setMapBackground(emptyBackgroundId));
+
+ PluginsEventBus.dispatchEvent('onBackgroundOverlayChange', emptyBackgroundId);
}
}, [dispatch, emptyBackgroundId]);
diff --git a/src/components/Map/Drawer/OverlaysDrawer/hooks/useOverlay.ts b/src/components/Map/Drawer/OverlaysDrawer/hooks/useOverlay.ts
index 2016e292da4bb59d28659a4a0cff46535b1425a9..4c5fdcbe66ba761f34aac9f3a9e54f79d04d5f2f 100644
--- a/src/components/Map/Drawer/OverlaysDrawer/hooks/useOverlay.ts
+++ b/src/components/Map/Drawer/OverlaysDrawer/hooks/useOverlay.ts
@@ -8,6 +8,8 @@ import { removeOverlayBioEntityForGivenOverlay } from '@/redux/overlayBioEntity/
import { getOverlayBioEntityForAllModels } from '@/redux/overlayBioEntity/overlayBioEntity.thunk';
import { BASE_API_URL } from '@/constants';
import { apiPath } from '@/redux/apiPath';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
+import { overlaySelector, userOverlaySelector } from '@/redux/overlays/overlays.selectors';
import { useEmptyBackground } from './useEmptyBackground';
type UseOverlay = {
@@ -22,6 +24,20 @@ export const useOverlay = (overlayId: number): UseOverlay => {
const isOverlayActive = useAppSelector(state => isOverlayActiveSelector(state, overlayId));
const isOverlayLoading = useAppSelector(state => isOverlayLoadingSelector(state, overlayId));
const { setBackgroundtoEmptyIfAvailable } = useEmptyBackground();
+ const overlay = useAppSelector(state => overlaySelector(state, overlayId));
+ const userOverlay = useAppSelector(state => userOverlaySelector(state, overlayId));
+
+ const dispatchPluginEvents = (): void => {
+ const eventData = overlay || userOverlay;
+
+ if (!eventData) return;
+
+ if (isOverlayActive) {
+ PluginsEventBus.dispatchEvent('onHideOverlay', eventData);
+ } else {
+ PluginsEventBus.dispatchEvent('onShowOverlay', eventData);
+ }
+ };
const toggleOverlay = (): void => {
if (isOverlayActive) {
@@ -30,6 +46,8 @@ export const useOverlay = (overlayId: number): UseOverlay => {
setBackgroundtoEmptyIfAvailable();
dispatch(getOverlayBioEntityForAllModels({ overlayId }));
}
+
+ dispatchPluginEvents();
};
const downloadOverlay = (): void => {
diff --git a/src/components/Map/Drawer/SearchDrawerWrapper/GroupedSearchResults/BioEntitiesAccordion/BioEntitiesSubmapItem/BioEntitiesSubmapItem.component.tsx b/src/components/Map/Drawer/SearchDrawerWrapper/GroupedSearchResults/BioEntitiesAccordion/BioEntitiesSubmapItem/BioEntitiesSubmapItem.component.tsx
index cba96ef0a29207bd111abaf6511bc2cb10929bd2..483bf03b5cd68d898b3b539a97f204a24796365e 100644
--- a/src/components/Map/Drawer/SearchDrawerWrapper/GroupedSearchResults/BioEntitiesAccordion/BioEntitiesSubmapItem/BioEntitiesSubmapItem.component.tsx
+++ b/src/components/Map/Drawer/SearchDrawerWrapper/GroupedSearchResults/BioEntitiesAccordion/BioEntitiesSubmapItem/BioEntitiesSubmapItem.component.tsx
@@ -3,8 +3,9 @@ import { Icon } from '@/shared/Icon';
import { displayBioEntitiesList } from '@/redux/drawer/drawer.slice';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { BioEntityContent } from '@/types/models';
-import { mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
import { openMapAndSetActive, setActiveMap } from '@/redux/map/map.slice';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
export interface BioEntitiesSubmapItemProps {
mapName: string;
@@ -21,6 +22,7 @@ export const BioEntitiesSubmapItem = ({
}: BioEntitiesSubmapItemProps): JSX.Element => {
const dispatch = useAppDispatch();
const openedMaps = useAppSelector(mapOpenedMapsSelector);
+ const currentModelId = useAppSelector(mapModelIdSelector);
const isMapAlreadyOpened = (modelId: number): boolean =>
openedMaps.some(map => map.modelId === modelId);
@@ -31,6 +33,10 @@ export const BioEntitiesSubmapItem = ({
} else {
dispatch(openMapAndSetActive({ modelId: mapId, modelName: mapName }));
}
+ if (currentModelId !== mapId) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', mapId);
+ }
};
const onSubmapClick = (): void => {
diff --git a/src/components/Map/Drawer/SearchDrawerWrapper/ResultsList/PinsList/PinsListItem/PinsListItem.component.tsx b/src/components/Map/Drawer/SearchDrawerWrapper/ResultsList/PinsList/PinsListItem/PinsListItem.component.tsx
index 1f5ec270c52f3f3b55a3ab99055801c0e3deed67..394dbf49d764ef073aaf0ca5e2e0e3f151cbcadb 100644
--- a/src/components/Map/Drawer/SearchDrawerWrapper/ResultsList/PinsList/PinsListItem/PinsListItem.component.tsx
+++ b/src/components/Map/Drawer/SearchDrawerWrapper/ResultsList/PinsList/PinsListItem/PinsListItem.component.tsx
@@ -5,7 +5,8 @@ import { modelsDataSelector } from '@/redux/models/models.selectors';
import { SIZE_OF_EMPTY_ARRAY } from '@/constants/common';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { openMapAndSetActive, setActiveMap } from '@/redux/map/map.slice';
-import { mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { useSetBounds } from '@/utils/map/useSetBounds';
import { getListOfAvailableSubmaps, getPinColor } from './PinsListItem.component.utils';
import { AvailableSubmaps, PinTypeWithNone } from '../PinsList.types';
@@ -22,6 +23,7 @@ export const PinsListItem = ({ name, type, pin }: PinsListItemProps): JSX.Elemen
const openedMaps = useAppSelector(mapOpenedMapsSelector);
const models = useAppSelector(modelsDataSelector);
const availableSubmaps = getListOfAvailableSubmaps(pin, models);
+ const currentModelId = useAppSelector(mapModelIdSelector);
const coordinates = useVisiblePinsPolygonCoordinates(pin.targetElements);
const setBounds = useSetBounds();
@@ -34,6 +36,10 @@ export const PinsListItem = ({ name, type, pin }: PinsListItemProps): JSX.Elemen
} else {
dispatch(openMapAndSetActive({ modelId: map.modelId, modelName: map.name }));
}
+ if (currentModelId !== map.modelId) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', map.modelId);
+ }
};
const handleCenterMapToPin = (): void => {
diff --git a/src/components/Map/Drawer/SubmapsDrawer/SubmapsDrawer.tsx b/src/components/Map/Drawer/SubmapsDrawer/SubmapsDrawer.tsx
index a3b4bc1bc9e63c724abbe954915846275793bbc0..eb15bad6dc36b3d802de9ec7f45a942b11b813b6 100644
--- a/src/components/Map/Drawer/SubmapsDrawer/SubmapsDrawer.tsx
+++ b/src/components/Map/Drawer/SubmapsDrawer/SubmapsDrawer.tsx
@@ -4,12 +4,14 @@ import { DrawerHeading } from '@/shared/DrawerHeading';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { openMapAndSetActive, setActiveMap } from '@/redux/map/map.slice';
import { MapModel } from '@/types/models';
-import { mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { SubmpamItem } from './SubmapItem/SubmapItem.component';
export const SubmapsDrawer = (): JSX.Element => {
const models = useAppSelector(modelsDataSelector);
const openedMaps = useAppSelector(mapOpenedMapsSelector);
+ const currentModelId = useAppSelector(mapModelIdSelector);
const dispatch = useAppDispatch();
const isMapAlreadyOpened = (modelId: number): boolean =>
@@ -21,6 +23,10 @@ export const SubmapsDrawer = (): JSX.Element => {
} else {
dispatch(openMapAndSetActive({ modelId: model.idObject, modelName: model.name }));
}
+ if (currentModelId !== model.idObject) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', model.idObject);
+ }
};
return (
diff --git a/src/components/Map/MapAdditionalActions/utils/useAdditionalActions.ts b/src/components/Map/MapAdditionalActions/utils/useAdditionalActions.ts
index bf0e8527932ebaa94cb138568d7bb984dfc67fe5..209499399e2e28b88e311ca935895b0a1304e076 100644
--- a/src/components/Map/MapAdditionalActions/utils/useAdditionalActions.ts
+++ b/src/components/Map/MapAdditionalActions/utils/useAdditionalActions.ts
@@ -5,6 +5,8 @@ import { useDispatch } from 'react-redux';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
import { currentModelIdSelector, modelByIdSelector } from '@/redux/models/models.selectors';
import { DEFAULT_ZOOM } from '@/constants/map';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
+import { mapDataLastPositionSelector } from '@/redux/map/map.selectors';
import { useVisibleBioEntitiesPolygonCoordinates } from './useVisibleBioEntitiesPolygonCoordinates';
import { MAP_ZOOM_IN_DELTA, MAP_ZOOM_OUT_DELTA } from '../MappAdditionalActions.constants';
@@ -20,6 +22,7 @@ export const useAddtionalActions = (): UseAddtionalActionsResult => {
const polygonCoordinates = useVisibleBioEntitiesPolygonCoordinates();
const currentMapModelId = useAppSelector(currentModelIdSelector);
const currentModel = useAppSelector(state => modelByIdSelector(state, currentMapModelId));
+ const currentModelLastPostiion = useAppSelector(mapDataLastPositionSelector);
const zoomInToBioEntities = (): SetBoundsResult | undefined => {
if (polygonCoordinates) {
@@ -35,6 +38,24 @@ export const useAddtionalActions = (): UseAddtionalActionsResult => {
};
dispatch(setMapPosition(defaultPosition));
+
+ if (currentModelLastPostiion.z !== defaultPosition.z) {
+ PluginsEventBus.dispatchEvent('onZoomChanged', {
+ modelId: currentMapModelId,
+ zoom: defaultPosition.z,
+ });
+ }
+
+ if (
+ currentModelLastPostiion.x !== defaultPosition.x ||
+ currentModelLastPostiion.y !== defaultPosition.y
+ ) {
+ PluginsEventBus.dispatchEvent('onCenterChanged', {
+ modelId: currentMapModelId,
+ x: defaultPosition.x,
+ y: defaultPosition.y,
+ });
+ }
}
return undefined;
diff --git a/src/components/Map/MapAdditionalOptions/BackgroundsSelector/BackgroundsSelector.component.tsx b/src/components/Map/MapAdditionalOptions/BackgroundsSelector/BackgroundsSelector.component.tsx
index ca0dd73392f972a5285211dba89fb71d1a87a102..7b31ff35d5928f6e36482d9e7dbc92a7badc1f89 100644
--- a/src/components/Map/MapAdditionalOptions/BackgroundsSelector/BackgroundsSelector.component.tsx
+++ b/src/components/Map/MapAdditionalOptions/BackgroundsSelector/BackgroundsSelector.component.tsx
@@ -10,6 +10,7 @@ import { Icon } from '@/shared/Icon';
import { MapBackground } from '@/types/models';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { setMapBackground } from '@/redux/map/map.slice';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
const DEFAULT_TOGGLE_BUTTON_TEXT = 'Background';
@@ -22,6 +23,7 @@ export const BackgroundSelector = (): JSX.Element => {
const onItemSelect = (background: MapBackground | undefined | null): void => {
if (background) {
dispatch(setMapBackground(background.id));
+ PluginsEventBus.dispatchEvent('onBackgroundOverlayChange', background.id);
}
};
diff --git a/src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleSearchResultAction.ts b/src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleSearchResultAction.ts
index 648457ecab4fb03ddd75a8b69d324377d81d9c39..23ae912e98c9d24124f0c61be6ff6fa655ed6ca9 100644
--- a/src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleSearchResultAction.ts
+++ b/src/components/Map/MapViewer/utils/listeners/mapSingleClick/handleSearchResultAction.ts
@@ -1,6 +1,7 @@
import { FIRST_ARRAY_ELEMENT } from '@/constants/common';
import { AppDispatch } from '@/redux/store';
import { ElementSearchResult } from '@/types/models';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { handleAliasResults } from './handleAliasResults';
import { handleReactionResults } from './handleReactionResults';
@@ -21,4 +22,8 @@ export const handleSearchResultAction = async ({
}[type];
await action(dispatch)(closestSearchResult);
+
+ if (type === 'ALIAS') {
+ PluginsEventBus.dispatchEvent('onBioEntityClick', closestSearchResult);
+ }
};
diff --git a/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.test.ts b/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.test.ts
index 295b91d1aad607f60565dbb88c33f6bc043659a0..bc9228f024b01e1369e832ae32a93dcbf16c1b3d 100644
--- a/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.test.ts
+++ b/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.test.ts
@@ -16,6 +16,8 @@ const getEvent = (targetValues: ObjectEvent['target']['values_']): ObjectEvent =
/* eslint-disable no-magic-numbers */
describe('onMapPositionChange - util', () => {
+ const MAP_ID = 52;
+ const LAST_ZOOM = 4;
const cases: [MapSize, ObjectEvent['target']['values_'], Point][] = [
[
{
@@ -63,7 +65,7 @@ describe('onMapPositionChange - util', () => {
const dispatch = result.current;
const event = getEvent(targetValues);
- onMapPositionChange(mapSize, dispatch)(event);
+ onMapPositionChange(mapSize, dispatch, MAP_ID, LAST_ZOOM)(event);
const { position } = mapDataSelector(store.getState());
expect(position.last).toMatchObject(lastPosition);
diff --git a/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.ts b/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.ts
index 7102fec7fdecfd1f771295030dd82e30c42bc767..d49f6f3edfd3d4a108619cf890fbc45a90a68d56 100644
--- a/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.ts
+++ b/src/components/Map/MapViewer/utils/listeners/onMapPositionChange.ts
@@ -1,19 +1,33 @@
import { setMapPosition } from '@/redux/map/map.slice';
import { MapSize } from '@/redux/map/map.types';
import { AppDispatch } from '@/redux/store';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { latLngToPoint } from '@/utils/map/latLngToPoint';
import { toLonLat } from 'ol/proj';
import { ObjectEvent } from 'openlayers';
/* prettier-ignore */
export const onMapPositionChange =
- (mapSize: MapSize, dispatch: AppDispatch) =>
+ (mapSize: MapSize, dispatch: AppDispatch, modelId: number, mapLastZoomValue: number | undefined) =>
(e: ObjectEvent): void => {
// eslint-disable-next-line no-underscore-dangle
const { center, zoom } = e.target.values_;
const [lng, lat] = toLonLat(center);
const { x, y } = latLngToPoint([lat, lng], mapSize, { rounded: true });
+ if (mapLastZoomValue !== zoom) {
+ PluginsEventBus.dispatchEvent('onZoomChanged', {
+ modelId,
+ zoom,
+ });
+ }
+
+ PluginsEventBus.dispatchEvent('onCenterChanged', {
+ modelId,
+ x,
+ y
+ });
+
dispatch(
setMapPosition({
x,
diff --git a/src/components/Map/MapViewer/utils/listeners/useOlMapListeners.ts b/src/components/Map/MapViewer/utils/listeners/useOlMapListeners.ts
index 5d7631ff007bc82ddcc675b81e67bd5eb384fdf4..1742d6fa7304541ec8f13ba93f5811b7be0b8bde 100644
--- a/src/components/Map/MapViewer/utils/listeners/useOlMapListeners.ts
+++ b/src/components/Map/MapViewer/utils/listeners/useOlMapListeners.ts
@@ -1,6 +1,6 @@
import { OPTIONS } from '@/constants/map';
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
-import { mapDataSizeSelector } from '@/redux/map/map.selectors';
+import { mapDataLastZoomValue, mapDataSizeSelector } from '@/redux/map/map.selectors';
import { currentModelIdSelector } from '@/redux/models/models.selectors';
import { MapInstance } from '@/types/map';
import { View } from 'ol';
@@ -22,6 +22,7 @@ interface UseOlMapListenersInput {
export const useOlMapListeners = ({ view, mapInstance }: UseOlMapListenersInput): void => {
const mapSize = useSelector(mapDataSizeSelector);
const modelId = useSelector(currentModelIdSelector);
+ const mapLastZoomValue = useSelector(mapDataLastZoomValue);
const coordinate = useRef<Coordinate>([]);
const pixel = useRef<Pixel>([]);
const dispatch = useAppDispatch();
@@ -35,7 +36,7 @@ export const useOlMapListeners = ({ view, mapInstance }: UseOlMapListenersInput)
);
const handleChangeCenter = useDebouncedCallback(
- onMapPositionChange(mapSize, dispatch),
+ onMapPositionChange(mapSize, dispatch, modelId, mapLastZoomValue),
OPTIONS.queryPersistTime,
{ leading: false },
);
diff --git a/src/hooks/useOpenSubmaps.ts b/src/hooks/useOpenSubmaps.ts
index a0a6330475cb0663ea9277b670919e0e7a59d234..85956836f72bfc8e12ef93519e6a1a3cbd7b2e2a 100644
--- a/src/hooks/useOpenSubmaps.ts
+++ b/src/hooks/useOpenSubmaps.ts
@@ -1,8 +1,9 @@
import { useAppDispatch } from '@/redux/hooks/useAppDispatch';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
-import { mapOpenedMapsSelector } from '@/redux/map/map.selectors';
+import { mapModelIdSelector, mapOpenedMapsSelector } from '@/redux/map/map.selectors';
import { openMapAndSetActive, setActiveMap } from '@/redux/map/map.slice';
import { modelsDataSelector } from '@/redux/models/models.selectors';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { useCallback } from 'react';
type UseOpenSubmapProps = {
@@ -22,6 +23,7 @@ export const useOpenSubmap = ({
const openedMaps = useAppSelector(mapOpenedMapsSelector);
const models = useAppSelector(modelsDataSelector);
const dispatch = useAppDispatch();
+ const currentModelId = useAppSelector(mapModelIdSelector);
const isMapAlreadyOpened = openedMaps.some(map => map.modelId === modelId);
const isMapExist = models.some(model => model.idObject === modelId);
@@ -37,7 +39,12 @@ export const useOpenSubmap = ({
} else {
dispatch(openMapAndSetActive({ modelId, modelName }));
}
- }, [dispatch, isItPossibleToOpenMap, isMapAlreadyOpened, modelId, modelName]);
+
+ if (currentModelId !== modelId) {
+ PluginsEventBus.dispatchEvent('onSubmapClose', currentModelId);
+ PluginsEventBus.dispatchEvent('onSubmapOpen', modelId);
+ }
+ }, [dispatch, isItPossibleToOpenMap, isMapAlreadyOpened, modelId, modelName, currentModelId]);
return { openSubmap, isItPossibleToOpenMap: Boolean(isItPossibleToOpenMap) };
};
diff --git a/src/redux/map/map.reducers.ts b/src/redux/map/map.reducers.ts
index eef6f9324c56ef85ab70d4c61ccf5f9320f82fd6..de06329e34159742ad61042ffbcb0c658542fc83 100644
--- a/src/redux/map/map.reducers.ts
+++ b/src/redux/map/map.reducers.ts
@@ -1,6 +1,7 @@
import { ZERO } from '@/constants/common';
import { DEFAULT_ZOOM } from '@/constants/map';
import { ActionReducerMapBuilder } from '@reduxjs/toolkit';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { getPointMerged } from '../../utils/object/getPointMerged';
import { MAIN_MAP } from './map.constants';
import {
@@ -52,6 +53,13 @@ export const varyPositionZoomReducer = (
const newZ = currentZ + delta;
const newZLimited = Math.min(Math.max(newZ, minZoom), maxZoom);
+ if (state.data.position.last.z !== newZLimited) {
+ PluginsEventBus.dispatchEvent('onZoomChanged', {
+ modelId: state.data.modelId,
+ zoom: newZLimited,
+ });
+ }
+
state.data.position.last.z = newZLimited;
state.data.position.initial.z = newZLimited;
};
diff --git a/src/redux/map/map.selectors.ts b/src/redux/map/map.selectors.ts
index 3f9d9d869324b43b48093632cfd02a7e5e493ff0..ac398f90f79c9e7f7bb63ffeb626b4d7eaf56c48 100644
--- a/src/redux/map/map.selectors.ts
+++ b/src/redux/map/map.selectors.ts
@@ -27,3 +27,8 @@ export const mapDataLastPositionSelector = createSelector(
mapDataPositionSelector,
position => position.last,
);
+
+export const mapDataLastZoomValue = createSelector(
+ mapDataLastPositionSelector,
+ position => position.z,
+);
diff --git a/src/redux/map/map.thunks.ts b/src/redux/map/map.thunks.ts
index a52a86ca81c5add0e37978fe97890e4141db8fec..e9c3c7ae8703638ab1942c366cfb6ecc32006955 100644
--- a/src/redux/map/map.thunks.ts
+++ b/src/redux/map/map.thunks.ts
@@ -4,6 +4,7 @@ import { ZERO } from '@/constants/common';
import { QueryData } from '@/types/query';
import { DEFAULT_ZOOM } from '@/constants/map';
import { getPointMerged } from '@/utils/object/getPointMerged';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import type { AppDispatch, RootState } from '../store';
import {
InitMapBackgroundActionPayload,
@@ -33,6 +34,10 @@ export const getBackgroundId = (state: RootState, queryData: QueryData): number
const mainMapBackground = mainBackgroundsDataSelector(state);
const backgroundId = queryData?.backgroundId || mainMapBackground?.id || ZERO;
+ if (backgroundId !== mainMapBackground?.id) {
+ PluginsEventBus.dispatchEvent('onBackgroundOverlayChange', backgroundId);
+ }
+
return backgroundId;
};
@@ -58,6 +63,21 @@ export const getInitMapPosition = (state: RootState, queryData: QueryData): Posi
const mergedPosition = getPointMerged(position || {}, defaultPosition);
+ if (mergedPosition.z && mergedPosition.z !== defaultPosition.z) {
+ PluginsEventBus.dispatchEvent('onZoomChanged', {
+ modelId: currentModel.idObject,
+ zoom: mergedPosition.z,
+ });
+ }
+
+ if (mergedPosition.x !== defaultPosition.x || mergedPosition.y !== defaultPosition.y) {
+ PluginsEventBus.dispatchEvent('onCenterChanged', {
+ modelId: currentModel.idObject,
+ x: mergedPosition.x,
+ y: mergedPosition.y,
+ });
+ }
+
return {
last: mergedPosition,
initial: mergedPosition,
@@ -72,6 +92,10 @@ export const getInitMapSizeAndModelId = (
const modelId = queryData?.modelId || mainMapModel?.idObject || ZERO;
const currentModel = modelByIdSelector(state, modelId);
+ if (modelId !== mainMapModel?.idObject) {
+ PluginsEventBus.dispatchEvent('onSubmapOpen', modelId);
+ }
+
return {
modelId: currentModel?.idObject || ZERO,
size: {
diff --git a/src/redux/overlayBioEntity/overlayBioEntity.thunk.ts b/src/redux/overlayBioEntity/overlayBioEntity.thunk.ts
index 555c1c87e768169ccba7b2454b313314320c7c9d..1fed7a9709ff7807203437b18647776fbd667ee1 100644
--- a/src/redux/overlayBioEntity/overlayBioEntity.thunk.ts
+++ b/src/redux/overlayBioEntity/overlayBioEntity.thunk.ts
@@ -2,6 +2,7 @@ import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosInstanceNewAPI } from '@/services/api/utils/axiosInstance';
import { OverlayBioEntity } from '@/types/models';
import { OverlayBioEntityRender } from '@/types/OLrendering';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import {
getValidOverlayBioEntities,
parseOverlayBioEntityToOlRenderingFormat,
@@ -11,6 +12,7 @@ import { modelsIdsSelector } from '../models/models.selectors';
import type { RootState } from '../store';
import { setMapBackground } from '../map/map.slice';
import { emptyBackgroundIdSelector } from '../backgrounds/background.selectors';
+import { overlaySelector, userOverlaySelector } from '../overlays/overlays.selectors';
type GetOverlayBioEntityThunkProps = {
overlayId: number;
@@ -70,8 +72,19 @@ export const getInitOverlays = createAsyncThunk<void, GetInitOverlaysProps, { st
const emptyBackgroundId = emptyBackgroundIdSelector(state);
if (emptyBackgroundId) {
dispatch(setMapBackground(emptyBackgroundId));
+ PluginsEventBus.dispatchEvent('onBackgroundOverlayChange', emptyBackgroundId);
}
- overlaysId.forEach(id => dispatch(getOverlayBioEntityForAllModels({ overlayId: id })));
+ overlaysId.forEach(id => {
+ const userOverlay = userOverlaySelector(state, id);
+ const overlay = overlaySelector(state, id);
+ const eventData = userOverlay || overlay;
+
+ if (eventData) {
+ PluginsEventBus.dispatchEvent('onShowOverlay', eventData);
+ }
+
+ dispatch(getOverlayBioEntityForAllModels({ overlayId: id }));
+ });
},
);
diff --git a/src/redux/overlays/overlays.reducers.test.ts b/src/redux/overlays/overlays.reducers.test.ts
index 90ee7771f73590345e165b792ac9ad5cfd2385f8..f774974f526383c5ed83a27c9343f7a758e2478c 100644
--- a/src/redux/overlays/overlays.reducers.test.ts
+++ b/src/redux/overlays/overlays.reducers.test.ts
@@ -19,7 +19,6 @@ import overlaysReducer from './overlays.slice';
import {
addOverlay,
getAllPublicOverlaysByProjectId,
- getAllUserOverlaysByCreator,
removeOverlay,
updateOverlays,
} from './overlays.thunks';
@@ -163,44 +162,6 @@ describe('overlays reducer', () => {
expect(loading).toEqual('failed');
});
- it('should update store when getAllUserOverlaysByCreator is pending', async () => {
- mockedAxiosClient
- .onGet(apiPath.getAllUserOverlaysByCreatorQuery({ creator: 'test', publicOverlay: false }))
- .reply(HttpStatusCode.Ok, overlaysFixture);
-
- await store.dispatch(getAllUserOverlaysByCreator('test'));
- const { loading } = store.getState().overlays.userOverlays;
-
- waitFor(() => {
- expect(loading).toEqual('pending');
- });
- });
-
- it('should update store after successful getAllUserOverlaysByCreator', async () => {
- mockedAxiosClient
- .onGet(apiPath.getAllUserOverlaysByCreatorQuery({ creator: 'test', publicOverlay: false }))
- .reply(HttpStatusCode.Ok, overlaysFixture);
-
- const getUserOverlaysPromise = store.dispatch(getAllUserOverlaysByCreator('test'));
- const { loading } = store.getState().overlays.userOverlays;
- expect(loading).toBe('pending');
-
- await getUserOverlaysPromise;
-
- const { loading: loadingFulfilled, error } = store.getState().overlays.userOverlays;
- expect(loadingFulfilled).toEqual('succeeded');
- expect(error).toEqual({ message: '', name: '' });
- });
- it('should update store after failed getAllUserOverlaysByCreator', async () => {
- mockedAxiosClient
- .onGet(apiPath.getAllUserOverlaysByCreatorQuery({ creator: 'test', publicOverlay: false }))
- .reply(HttpStatusCode.NotFound, {});
-
- await store.dispatch(getAllUserOverlaysByCreator('test'));
- const { loading } = store.getState().overlays.userOverlays;
- expect(loading).toEqual('failed');
- });
-
it('should update store when updateOverlay is pending', async () => {
mockedAxiosClient
.onPatch(apiPath.updateOverlay(overlayFixture.idObject))
@@ -244,7 +205,6 @@ describe('overlays reducer', () => {
store.dispatch(
removeOverlay({
- login: 'test',
overlayId: overlayFixture.idObject,
}),
);
@@ -259,7 +219,6 @@ describe('overlays reducer', () => {
const removeUserOverlaysPromise = store.dispatch(
removeOverlay({
- login: 'test',
overlayId: overlayFixture.idObject,
}),
);
@@ -279,7 +238,6 @@ describe('overlays reducer', () => {
const removeUserOverlaysPromise = store.dispatch(
removeOverlay({
- login: 'test',
overlayId: overlayFixture.idObject,
}),
);
diff --git a/src/redux/overlays/overlays.reducers.ts b/src/redux/overlays/overlays.reducers.ts
index 50e75caab382672abb4551a077cc93a2f49f2021..d17af49ea7410d16dc3460553e2cb4a1236a9662 100644
--- a/src/redux/overlays/overlays.reducers.ts
+++ b/src/redux/overlays/overlays.reducers.ts
@@ -1,4 +1,4 @@
-import { ActionReducerMapBuilder } from '@reduxjs/toolkit';
+import type { ActionReducerMapBuilder } from '@reduxjs/toolkit';
import {
addOverlay,
getAllPublicOverlaysByProjectId,
@@ -6,7 +6,7 @@ import {
removeOverlay,
updateOverlays,
} from './overlays.thunks';
-import { OverlaysState } from './overlays.types';
+import type { OverlaysState } from './overlays.types';
export const getAllPublicOverlaysByProjectIdReducer = (
builder: ActionReducerMapBuilder<OverlaysState>,
diff --git a/src/redux/overlays/overlays.selectors.ts b/src/redux/overlays/overlays.selectors.ts
index 38ba856745080b3c00303ddb5d85eb881c1de478..87409b8e72d3566869b9c0525ee2c3bf89b4fd08 100644
--- a/src/redux/overlays/overlays.selectors.ts
+++ b/src/redux/overlays/overlays.selectors.ts
@@ -12,6 +12,11 @@ export const overlaysIdsAndOrderSelector = createSelector(overlaysDataSelector,
overlays.map(({ idObject, order }) => ({ idObject, order })),
);
+export const overlaySelector = createSelector(
+ [overlaysDataSelector, (_, overlayId: number): number => overlayId],
+ (overlays, overlayId) => overlays.find(overlay => overlay.idObject === overlayId),
+);
+
export const loadingAddOverlay = createSelector(
overlaysSelector,
state => state.addOverlay.loading,
@@ -28,3 +33,9 @@ export const userOverlaysDataSelector = createSelector(
userOverlaysSelector,
overlays => overlays.data,
);
+
+export const userOverlaySelector = createSelector(
+ [userOverlaysDataSelector, (_, userOverlayId: number): number => userOverlayId],
+ (userOverlays, userOverlayId) =>
+ userOverlays?.find(userOverlay => userOverlay.idObject === userOverlayId),
+);
diff --git a/src/redux/overlays/overlays.thunks.ts b/src/redux/overlays/overlays.thunks.ts
index 5335fa4d505dab679eab4e86262746569708c582..6e290d9f5577f134b68f7d99ef21d5b2d7b4a3cf 100644
--- a/src/redux/overlays/overlays.thunks.ts
+++ b/src/redux/overlays/overlays.thunks.ts
@@ -10,9 +10,11 @@ import { CreatedOverlay, CreatedOverlayFile, MapOverlay } from '@/types/models';
import { validateDataUsingZodSchema } from '@/utils/validateDataUsingZodSchema';
import { createAsyncThunk } from '@reduxjs/toolkit';
import { z } from 'zod';
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
import { apiPath } from '../apiPath';
import { CHUNK_SIZE } from './overlays.constants';
import { closeModal } from '../modal/modal.slice';
+import type { RootState } from '../store';
export const getAllPublicOverlaysByProjectId = createAsyncThunk(
'overlays/getAllPublicOverlaysByProjectId',
@@ -100,7 +102,7 @@ const creteOverlay = async ({
type,
name,
projectId,
-}: CreatedOverlayArgs): Promise<CreatedOverlay> => {
+}: CreatedOverlayArgs): Promise<CreatedOverlay | undefined> => {
const data = {
name,
description,
@@ -112,9 +114,15 @@ const creteOverlay = async ({
const overlay = new URLSearchParams(data);
- const response = await axiosInstance.post(apiPath.createOverlay(projectId), overlay, {
- withCredentials: true,
- });
+ const response = await axiosInstance.post<CreatedOverlay>(
+ apiPath.createOverlay(projectId),
+ overlay,
+ {
+ withCredentials: true,
+ },
+ );
+
+ PluginsEventBus.dispatchEvent('onAddDataOverlay', response.data);
const isDataValid = validateDataUsingZodSchema(response.data, createdOverlaySchema);
@@ -162,8 +170,12 @@ export const addOverlay = createAsyncThunk(
export const getAllUserOverlaysByCreator = createAsyncThunk(
'overlays/getAllUserOverlaysByCreator',
- async (creator: string): Promise<MapOverlay[]> => {
- const response = await axiosInstance(
+ async (_, { getState }): Promise<MapOverlay[]> => {
+ const state = getState() as RootState;
+ const creator = state.user.login;
+ if (!creator) return [];
+
+ const response = await axiosInstance<MapOverlay[]>(
apiPath.getAllUserOverlaysByCreatorQuery({
creator,
publicOverlay: false,
@@ -213,12 +225,13 @@ export const updateOverlays = createAsyncThunk(
export const removeOverlay = createAsyncThunk(
'overlays/removeOverlay',
- async ({ overlayId, login }: { overlayId: number; login: string }, thunkApi): Promise<void> => {
+ async ({ overlayId }: { overlayId: number }, thunkApi): Promise<void> => {
await axiosInstance.delete(apiPath.removeOverlay(overlayId), {
withCredentials: true,
});
- await thunkApi.dispatch(getAllUserOverlaysByCreator(login));
+ PluginsEventBus.dispatchEvent('onRemoveDataOverlay', overlayId);
+ await thunkApi.dispatch(getAllUserOverlaysByCreator());
thunkApi.dispatch(closeModal());
},
);
diff --git a/src/redux/root/init.thunks.ts b/src/redux/root/init.thunks.ts
index 557e87d96f6804aed9e108a81d9530a2cd93ccf2..fc1c0f25d4eefa4a7d1fc0e170a7b82770aed158 100644
--- a/src/redux/root/init.thunks.ts
+++ b/src/redux/root/init.thunks.ts
@@ -15,7 +15,10 @@ import {
} from '../map/map.thunks';
import { getModels } from '../models/models.thunks';
import { getInitOverlays } from '../overlayBioEntity/overlayBioEntity.thunk';
-import { getAllPublicOverlaysByProjectId } from '../overlays/overlays.thunks';
+import {
+ getAllPublicOverlaysByProjectId,
+ getAllUserOverlaysByCreator,
+} from '../overlays/overlays.thunks';
import { getAllPlugins, getInitPlugins } from '../plugins/plugins.thunks';
import { getProjectById } from '../project/project.thunks';
import { setPerfectMatch } from '../search/search.slice';
@@ -32,6 +35,15 @@ export const fetchInitialAppData = createAsyncThunk<
InitializeAppParams,
{ dispatch: AppDispatch }
>('appInit/fetchInitialAppData', async ({ queryData }, { dispatch }): Promise<void> => {
+ if (queryData.pluginsId) {
+ await dispatch(
+ getInitPlugins({
+ pluginsId: queryData.pluginsId,
+ setHashedPlugin: PluginsManager.setHashedPlugin,
+ }),
+ );
+ }
+
/** Fetch all data required for rendering map */
await Promise.all([
@@ -51,7 +63,7 @@ export const fetchInitialAppData = createAsyncThunk<
dispatch(initOpenedMaps({ queryData }));
// Check if auth token is valid
- dispatch(getSessionValid());
+ await dispatch(getSessionValid());
// Fetch data needed for export
dispatch(getStatisticsById(PROJECT_ID));
@@ -72,17 +84,9 @@ export const fetchInitialAppData = createAsyncThunk<
dispatch(openSearchDrawerWithSelectedTab(getDefaultSearchTab(queryData.searchValue)));
}
+ await dispatch(getAllUserOverlaysByCreator());
/** fetch overlays */
if (queryData.overlaysId) {
dispatch(getInitOverlays({ overlaysId: queryData.overlaysId }));
}
-
- if (queryData.pluginsId) {
- dispatch(
- getInitPlugins({
- pluginsId: queryData.pluginsId,
- setHashedPlugin: PluginsManager.setHashedPlugin,
- }),
- );
- }
});
diff --git a/src/redux/search/search.thunks.ts b/src/redux/search/search.thunks.ts
index ad39272c32f19b56ca32f4a3e764ac727e11cd39..05debcd0c57d9a3adc4872ef02b7bb5d876c8e0f 100644
--- a/src/redux/search/search.thunks.ts
+++ b/src/redux/search/search.thunks.ts
@@ -3,16 +3,20 @@ import { getMultiChemicals } from '@/redux/chemicals/chemicals.thunks';
import { getMultiDrugs } from '@/redux/drugs/drugs.thunks';
import { PerfectMultiSearchParams } from '@/types/search';
import { createAsyncThunk } from '@reduxjs/toolkit';
+import type { RootState } from '../store';
+import { dispatchPluginsEvents } from './search.thunks.utils';
type GetSearchDataProps = PerfectMultiSearchParams;
-export const getSearchData = createAsyncThunk(
+export const getSearchData = createAsyncThunk<void, GetSearchDataProps, { state: RootState }>(
'project/getSearchData',
- async ({ searchQueries, isPerfectMatch }: GetSearchDataProps, { dispatch }): Promise<void> => {
+ async ({ searchQueries, isPerfectMatch }, { dispatch, getState }): Promise<void> => {
await Promise.all([
dispatch(getMultiBioEntity({ searchQueries, isPerfectMatch })),
dispatch(getMultiDrugs(searchQueries)),
dispatch(getMultiChemicals(searchQueries)),
]);
+
+ dispatchPluginsEvents(searchQueries, getState());
},
);
diff --git a/src/redux/search/search.thunks.utils.ts b/src/redux/search/search.thunks.utils.ts
new file mode 100644
index 0000000000000000000000000000000000000000..0744617c819c6b4a18db01dc8062a80085e0ae01
--- /dev/null
+++ b/src/redux/search/search.thunks.utils.ts
@@ -0,0 +1,29 @@
+import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
+import type { RootState } from '../store';
+
+export const dispatchPluginsEvents = (searchQueries: string[], state: RootState): void => {
+ const bioEntities = state.bioEntity.data;
+ const bioEntitiesResults = bioEntities.map(bioEntity => (bioEntity.data ? bioEntity.data : []));
+
+ const drugs = state.drugs.data;
+ const drugsResults = drugs.map(drug => (drug.data ? drug.data : []));
+
+ const chemicals = state.chemicals.data;
+ const chemicalsResults = chemicals.map(chemical => (chemical.data ? chemical.data : []));
+
+ PluginsEventBus.dispatchEvent('onSearch', {
+ type: 'bioEntity',
+ searchValues: searchQueries,
+ results: bioEntitiesResults,
+ });
+ PluginsEventBus.dispatchEvent('onSearch', {
+ type: 'drugs',
+ searchValues: searchQueries,
+ results: drugsResults,
+ });
+ PluginsEventBus.dispatchEvent('onSearch', {
+ type: 'chemicals',
+ searchValues: searchQueries,
+ results: chemicalsResults,
+ });
+};
diff --git a/src/services/pluginsManager/pluginsEventBus/index.ts b/src/services/pluginsManager/pluginsEventBus/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..fed9f9e85d548844ab809c3064f4ba35556ce7fc
--- /dev/null
+++ b/src/services/pluginsManager/pluginsEventBus/index.ts
@@ -0,0 +1 @@
+export { PluginsEventBus } from './pluginsEventBus';
diff --git a/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.constants.ts b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.constants.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5fd9ea0a98a72dbfe3eacd96d8d708f81c3058bd
--- /dev/null
+++ b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.constants.ts
@@ -0,0 +1,27 @@
+const PLUGINS_EVENTS = {
+ overlay: {
+ onAddDataOverlay: 'onAddDataOverlay',
+ onRemoveDataOverlay: 'onRemoveDataOverlay',
+ onShowOverlay: 'onShowOverlay',
+ onHideOverlay: 'onHideOverlay',
+ },
+ background: {
+ onBackgroundOverlayChange: 'onBackgroundOverlayChange',
+ },
+ submap: {
+ onSubmapOpen: 'onSubmapOpen',
+ onSubmapClose: 'onSubmapClose',
+ onZoomChanged: 'onZoomChanged',
+ onCenterChanged: 'onCenterChanged',
+ onBioEntityClick: 'onBioEntityClick',
+ },
+ search: {
+ onSearch: 'onSearch',
+ },
+};
+
+export const ALLOWED_PLUGINS_EVENTS = Object.values(PLUGINS_EVENTS).flatMap(obj =>
+ Object.values(obj),
+);
+
+export const LISTENER_NOT_FOUND = -1;
diff --git a/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.test.ts b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.test.ts
new file mode 100644
index 0000000000000000000000000000000000000000..474b9d214ce9d920b94c2a473cf052201294b496
--- /dev/null
+++ b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.test.ts
@@ -0,0 +1,117 @@
+/* eslint-disable no-magic-numbers */
+import { createdOverlayFixture } from '@/models/fixtures/overlaysFixture';
+import { PluginsEventBus } from './pluginsEventBus';
+
+describe('PluginsEventBus', () => {
+ beforeEach(() => {
+ PluginsEventBus.events = [];
+ });
+ it('should store event listener', () => {
+ const callback = jest.fn();
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+
+ expect(PluginsEventBus.events).toEqual([
+ {
+ hash: '123',
+ type: 'onAddDataOverlay',
+ callback,
+ },
+ ]);
+ });
+
+ it('should dispatch event correctly', () => {
+ const callback = jest.fn();
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+ PluginsEventBus.dispatchEvent('onAddDataOverlay', createdOverlayFixture);
+
+ expect(callback).toHaveBeenCalled();
+ });
+
+ it('should throw error if event type is incorrect', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ expect(() => PluginsEventBus.dispatchEvent('onData' as any, createdOverlayFixture)).toThrow(
+ 'Invalid event type: onData',
+ );
+ });
+ it('should remove listener only for specific plugin, event type, and callback', () => {
+ const callback = (): void => {};
+
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+ PluginsEventBus.addListener('123', 'onBioEntityClick', callback);
+ PluginsEventBus.addListener('234', 'onBioEntityClick', callback);
+
+ expect(PluginsEventBus.events).toHaveLength(3);
+
+ PluginsEventBus.removeListener('123', 'onAddDataOverlay', callback);
+ expect(PluginsEventBus.events).toHaveLength(2);
+ expect(PluginsEventBus.events).toEqual([
+ {
+ callback,
+ hash: '123',
+ type: 'onBioEntityClick',
+ },
+ {
+ callback,
+ hash: '234',
+ type: 'onBioEntityClick',
+ },
+ ]);
+ });
+ it('should throw if listener is not defined by plugin', () => {
+ const callback = (): void => {};
+
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+ PluginsEventBus.addListener('123', 'onBioEntityClick', callback);
+ PluginsEventBus.addListener('234', 'onBioEntityClick', callback);
+
+ expect(PluginsEventBus.events).toHaveLength(3);
+
+ expect(() => PluginsEventBus.removeListener('123', 'onHideOverlay', callback)).toThrow(
+ "Listener doesn't exist",
+ );
+ expect(PluginsEventBus.events).toHaveLength(3);
+ });
+ it('should not remove listener when event with the same event type is defined by the same plugin but with different callback', () => {
+ const callback = (): void => {};
+ const secondCallback = (): void => {};
+
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', secondCallback);
+
+ PluginsEventBus.removeListener('123', 'onAddDataOverlay', callback);
+
+ expect(PluginsEventBus.events).toHaveLength(1);
+ expect(PluginsEventBus.events).toEqual([
+ {
+ callback: secondCallback,
+ hash: '123',
+ type: 'onAddDataOverlay',
+ },
+ ]);
+ });
+ it('should remove all listeners defined by specific plugin', () => {
+ const callback = (): void => {};
+ PluginsEventBus.addListener('123', 'onAddDataOverlay', callback);
+ PluginsEventBus.addListener('123', 'onBackgroundOverlayChange', callback);
+ PluginsEventBus.addListener('251', 'onSubmapOpen', callback);
+ PluginsEventBus.addListener('123', 'onHideOverlay', callback);
+ PluginsEventBus.addListener('123', 'onSubmapOpen', callback);
+ PluginsEventBus.addListener('992', 'onSearch', callback);
+
+ PluginsEventBus.removeAllListeners('123');
+
+ expect(PluginsEventBus.events).toHaveLength(2);
+ expect(PluginsEventBus.events).toEqual([
+ {
+ callback,
+ hash: '251',
+ type: 'onSubmapOpen',
+ },
+ {
+ callback,
+ hash: '992',
+ type: 'onSearch',
+ },
+ ]);
+ });
+});
diff --git a/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.ts b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5227eabbdc6e6ea1f43b84d809fe6718af2fcc4c
--- /dev/null
+++ b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.ts
@@ -0,0 +1,64 @@
+/* eslint-disable no-magic-numbers */
+import { CreatedOverlay, MapOverlay } from '@/types/models';
+import { ALLOWED_PLUGINS_EVENTS, LISTENER_NOT_FOUND } from './pluginsEventBus.constants';
+import type {
+ CenteredCoordinates,
+ ClickedBioEntity,
+ Events,
+ EventsData,
+ PluginsEventBusType,
+ SearchData,
+ ZoomChanged,
+} from './pluginsEventBus.types';
+
+export function dispatchEvent(type: 'onAddDataOverlay', createdOverlay: CreatedOverlay): void;
+export function dispatchEvent(type: 'onRemoveDataOverlay', overlayId: number): void;
+export function dispatchEvent(type: 'onShowOverlay', overlay: MapOverlay): void;
+export function dispatchEvent(type: 'onHideOverlay', overlay: MapOverlay): void;
+export function dispatchEvent(type: 'onBackgroundOverlayChange', backgroundId: number): void;
+export function dispatchEvent(type: 'onSubmapOpen', submapId: number): void;
+export function dispatchEvent(type: 'onSubmapClose', submapId: number): void;
+export function dispatchEvent(type: 'onZoomChanged', data: ZoomChanged): void;
+export function dispatchEvent(type: 'onCenterChanged', data: CenteredCoordinates): void;
+export function dispatchEvent(type: 'onBioEntityClick', data: ClickedBioEntity): void;
+export function dispatchEvent(type: 'onSearch', data: SearchData): void;
+export function dispatchEvent(type: Events, data: EventsData): void {
+ if (!ALLOWED_PLUGINS_EVENTS.includes(type)) throw new Error(`Invalid event type: ${type}`);
+
+ // eslint-disable-next-line no-restricted-syntax, no-use-before-define
+ for (const event of PluginsEventBus.events) {
+ if (event.type === type) {
+ event.callback(data);
+ }
+ }
+}
+
+export const PluginsEventBus: PluginsEventBusType = {
+ events: [],
+
+ addListener: (hash: string, type: Events, callback: (data: unknown) => void) => {
+ PluginsEventBus.events.push({
+ hash,
+ type,
+ callback,
+ });
+ },
+
+ removeListener: (hash: string, type: Events, callback: unknown) => {
+ const eventIndex = PluginsEventBus.events.findIndex(
+ event => event.hash === hash && event.type === type && event.callback === callback,
+ );
+
+ if (eventIndex !== LISTENER_NOT_FOUND) {
+ PluginsEventBus.events.splice(eventIndex, 1);
+ } else {
+ throw new Error("Listener doesn't exist");
+ }
+ },
+
+ removeAllListeners: (hash: string) => {
+ PluginsEventBus.events = PluginsEventBus.events.filter(event => event.hash !== hash);
+ },
+
+ dispatchEvent,
+};
diff --git a/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.types.ts b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.types.ts
new file mode 100644
index 0000000000000000000000000000000000000000..7679bb0af514be8208c15a0a23c55c3de096aafe
--- /dev/null
+++ b/src/services/pluginsManager/pluginsEventBus/pluginsEventBus.types.ts
@@ -0,0 +1,76 @@
+import { BioEntityContent, Chemical, CreatedOverlay, Drug, MapOverlay } from '@/types/models';
+import { dispatchEvent } from './pluginsEventBus';
+
+export type BackgroundEvents = 'onBackgroundOverlayChange';
+export type OverlayEvents =
+ | 'onAddDataOverlay'
+ | 'onRemoveDataOverlay'
+ | 'onShowOverlay'
+ | 'onHideOverlay';
+export type SubmapEvents =
+ | 'onSubmapOpen'
+ | 'onSubmapClose'
+ | 'onZoomChanged'
+ | 'onCenterChanged'
+ | 'onBioEntityClick';
+export type SearchEvents = 'onSearch';
+
+export type Events = OverlayEvents | BackgroundEvents | SubmapEvents | SearchEvents;
+
+export type ZoomChanged = {
+ zoom: number;
+ modelId: number;
+};
+
+export type CenteredCoordinates = {
+ modelId: number;
+ x: number;
+ y: number;
+};
+
+export type ClickedBioEntity = {
+ id: number;
+ type: string;
+ modelId: number;
+};
+
+export type SearchDataBioEntity = {
+ type: 'bioEntity';
+ searchValues: string[];
+ results: BioEntityContent[][];
+};
+
+export type SearchDataDrugs = {
+ type: 'drugs';
+ searchValues: string[];
+ results: Drug[][];
+};
+
+export type SearchDataChemicals = {
+ type: 'chemicals';
+ searchValues: string[];
+ results: Chemical[][];
+};
+
+export type SearchData = SearchDataBioEntity | SearchDataDrugs | SearchDataChemicals;
+
+export type EventsData =
+ | CreatedOverlay
+ | number
+ | MapOverlay
+ | ZoomChanged
+ | CenteredCoordinates
+ | ClickedBioEntity
+ | SearchData;
+
+export type PluginsEventBusType = {
+ events: {
+ hash: string;
+ type: Events;
+ callback: (data: unknown) => void;
+ }[];
+ addListener: (hash: string, type: Events, callback: (data: unknown) => void) => void;
+ removeListener: (hash: string, type: Events, callback: unknown) => void;
+ removeAllListeners: (hash: string) => void;
+ dispatchEvent: typeof dispatchEvent;
+};
diff --git a/src/services/pluginsManager/pluginsManager.ts b/src/services/pluginsManager/pluginsManager.ts
index fce5756903a9a6b69434e782cca705d9d6ccc23e..f8de68422b7484c961e37996570a277287105ffe 100644
--- a/src/services/pluginsManager/pluginsManager.ts
+++ b/src/services/pluginsManager/pluginsManager.ts
@@ -5,6 +5,7 @@ import md5 from 'crypto-js/md5';
import { bioEntitiesMethods } from './bioEntities';
import type { PluginsManagerType } from './pluginsManager.types';
import { configurationMapper } from './pluginsManager.utils';
+import { PluginsEventBus } from './pluginsEventBus';
export const PluginsManager: PluginsManagerType = {
hashedPlugins: {},
@@ -58,6 +59,11 @@ export const PluginsManager: PluginsManagerType = {
return {
element,
+ events: {
+ addListener: PluginsEventBus.addListener.bind(this, hash),
+ removeListener: PluginsEventBus.removeListener.bind(this, hash),
+ removeAllListeners: PluginsEventBus.removeAllListeners.bind(this, hash),
+ },
};
},
createAndGetPluginContent({ hash }) {