fix: PluginSlot props are now required and tests are added

src/plugins/PluginSlot.jsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { getPlugin, subscribe } from './pluginRegistry';
 
-const PluginSlot = ({ scope, props: componentProps }) => {
+const PluginSlot = ({ scope, props: componentProps = {} }) => {
     const [Component, setComponent] = useState(() => getPlugin(scope));
 
     useEffect(() => subscribe(() => setComponent(() => getPlugin(scope))), [scope]);

tests/MarkerPopup/LocationDetailsBox.test.jsx

@@ -90,6 +90,18 @@ describe('should render marker popup correctly', () => {
                 ).not.toThrow();
             });
         });
+
+        describe('should handle plugin fields', () => {
+            it('renders the field label for a scoped plugin field even when plugin is not loaded', () => {
+                const placeWithPlugin = {
+                    ...correctMarkerData,
+                    data: [['promocode', { scope: 'promocode', code: 'U1VN', text: 'Get it' }]],
+                    metadata: { uuid: 'test-uuid' },
+                };
+                render(<LocationDetailsBox place={placeWithPlugin} />);
+                expect(screen.getByText('promocode')).toBeInTheDocument();
+            });
+        });
     });
 });
 

tests/plugins/PluginSlot.test.jsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import '@testing-library/jest-dom';
+import { render, screen, act } from '@testing-library/react';
+import PluginSlot from '../../src/plugins/PluginSlot';
+import { registerPlugin } from '../../src/plugins/pluginRegistry';
+
+describe('PluginSlot', () => {
+    it('renders nothing when plugin is not registered', () => {
+        const { container } = render(<PluginSlot scope="unregistered-scope" props={{}} />);
+        expect(container).toBeEmptyDOMElement();
+    });
+
+    it('renders the registered component with given props', () => {
+        const TestComponent = ({ message }) => <span>{message}</span>;
+        TestComponent.propTypes = { message: PropTypes.string.isRequired };
+        act(() => registerPlugin('test-scope', TestComponent));
+
+        render(<PluginSlot scope="test-scope" props={{ message: 'hello plugin' }} />);
+        expect(screen.getByText('hello plugin')).toBeInTheDocument();
+    });
+});