@servicetitan/web-components 29.0.0 → 30.1.0

package/src/__tests__/event-bus-types.test.ts

@@ -0,0 +1,507 @@
+import { symbolToken } from '@servicetitan/react-ioc';
+import { EventBus } from '../event-bus';
+
+jest.mock('../event-bus', () => {
+    return {
+        EventBus: jest.fn().mockImplementation(() => {
+            return {
+                job: {
+                    emit: jest.fn(),
+                    on: jest.fn(),
+                    off: jest.fn(),
+                },
+                emit: jest.fn(),
+                on: jest.fn(),
+                off: jest.fn(),
+            };
+        }),
+    };
+});
+
+describe(`[web-components] ${EventBus.name}`, () => {
+    describe('type definitions', () => {
+        describe('EventBus<T>', () => {
+            test('rejects invalid data type', () => {
+                // @ts-expect-error Types of property 'foo' are incompatible.
+                eventBus = EventBus<{ foo: () => void }>;
+            });
+        });
+
+        describe('when eventBus is not typed', () => {
+            const eventBus = new EventBus();
+
+            describe('emit', () => {
+                test('accepts valid event with valid data', () => {
+                    eventBus.emit('foo', '');
+                    eventBus.emit('bar', { value: 1 });
+                    eventBus.emit(Symbol(), '');
+                    eventBus.emit(123, '');
+                });
+
+                test('accepts event with no data', () => {
+                    eventBus.emit('foo');
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '() => void' is not assignable to parameter of type 'string | number | symbol | SymbolToken<any>'.
+                    eventBus.emit(() => {}, '');
+
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'string | number | symbol | SymbolToken<any>'.
+                    eventBus.emit(new Date(), '');
+
+                    // @ts-expect-error Argument of type 'boolean' is not assignable to parameter of type 'string | number | symbol | SymbolToken<any>'.
+                    eventBus.emit(true, '');
+                });
+
+                test('rejects invalid data', () => {
+                    // @ts-expect-error Argument of type '() => void' is not assignable to parameter of type 'JSON | JSONPrimitive'
+                    eventBus.emit('foo', () => {});
+
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.emit('foo', new Date());
+
+                    eventBus.emit('foo', {
+                        value: 1,
+                        // @ts-expect-error Type '() => void' is not assignable to type 'JSON | JSONPrimitive | JSON[]'.
+                        otherValue: () => {},
+                    });
+                });
+            });
+
+            describe('on', () => {
+                test('accepts valid event with any handler', () => {
+                    eventBus.on('foo', () => {});
+                    eventBus.on('bar', (_value: string) => {});
+                    eventBus.on('baz', ({ value: _value }: { value: Date }) => {});
+                    eventBus.on(Symbol(), () => {});
+                    eventBus.on(123, () => {});
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.on(new Date(), () => {});
+                });
+            });
+
+            describe('off', () => {
+                test('accepts valid event with any handler', () => {
+                    eventBus.off('foo', () => {});
+                    eventBus.off('bar', (_value: string) => {});
+                    eventBus.off('baz', ({ value: _value }: { value: Date }) => {});
+                    eventBus.off(Symbol(), () => {});
+                    eventBus.off(123, () => {});
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.off(new Date(), () => {});
+                });
+            });
+
+            describe('job.emit', () => {
+                test('accepts valid event', () => {
+                    eventBus.job.emit('foo');
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.job.emit(new Date());
+                });
+            });
+
+            describe('job.on', () => {
+                test('accepts valid event with valid handler', () => {
+                    eventBus.job.on('foo', () => {});
+                    eventBus.job.on('foo', ({ resolve }) => resolve({ value: '' }));
+                    eventBus.job.on('foo', ({ reject }) => reject(new Error('Oops!')));
+                    eventBus.job.on('foo', ({ reject }) => reject('Oops!'));
+                    eventBus.job.on(Symbol(), () => {});
+                    eventBus.job.on(123, () => {});
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.job.on(new Date(), () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    eventBus.job.on('foo', ({ reject }) => {
+                        // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                        reject(123);
+                    });
+                });
+            });
+
+            describe('job.off', () => {
+                test('accepts valid event with valid handler', () => {
+                    eventBus.job.off('foo', () => {});
+                    eventBus.job.off('foo', ({ resolve }) => resolve({ value: '' }));
+                    eventBus.job.off('foo', ({ reject }) => reject(new Error('Oops!')));
+                    eventBus.job.off('foo', ({ reject }) => reject('Oops!'));
+                    eventBus.job.off(Symbol(), () => {});
+                    eventBus.job.off(123, () => {});
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type 'Date' is not assignable to parameter of type 'JSON | JSONPrimitive'.
+                    eventBus.job.off(new Date(), () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    eventBus.job.off('foo', ({ reject }) => {
+                        // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                        reject(123);
+                    });
+                });
+            });
+
+            describe('when event is symbolToken', () => {
+                const token = symbolToken<{ value: number }>('token');
+                const optionalPayloadToken = symbolToken<{ value: number } | undefined>(
+                    'optionalToken'
+                );
+
+                describe('emit', () => {
+                    test('accepts valid data', () => {
+                        eventBus.emit(token, { value: 1 });
+                        eventBus.emit(optionalPayloadToken, { value: 1 });
+                        eventBus.emit(optionalPayloadToken);
+                    });
+
+                    test('rejects invalid data', () => {
+                        // @ts-expect-error Type 'string' is not assignable to type 'number'
+                        eventBus.emit(token, { value: '' });
+                    });
+
+                    test('rejects missing data', () => {
+                        // @ts-expect-error Expected 2 arguments, but got 1
+                        eventBus.emit(token);
+                    });
+
+                    test('rejects invalid data type', () => {
+                        const token = symbolToken<{ value: () => void }>('token');
+
+                        // @ts-expect-error Argument of type 'SymbolToken<{ value: () => void; }>' is not assignable to parameter of type ...
+                        eventBus.emit(token, { value: () => {} });
+                    });
+                });
+
+                describe('on', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.on(token, () => {});
+                        eventBus.on(token, data => data.value++);
+                    });
+
+                    test('rejects invalid handler', () => {
+                        // @ts-expect-error Argument of type '(_: number) => void' is not assignable to parameter of type ...
+                        eventBus.on(token, (_: number) => {});
+
+                        // @ts-expect-error Argument of type '(data: { value: string; }) => number' is not assignable to parameter of type ...
+                        eventBus.on(token, (data: { value: string }) => data.value.split(''));
+                    });
+                });
+
+                describe('off', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.off(token, () => {});
+                        eventBus.off(token, (data: { value: number }) => data.value++);
+                    });
+
+                    test('rejects invalid handler', () => {
+                        // @ts-expect-error Argument of type '(_: number) => void' is not assignable to parameter of type ...
+                        eventBus.off(token, (_: number) => {});
+
+                        // @ts-expect-error Argument of type '(data: { value: string; }) => number' is not assignable to parameter of type ...
+                        eventBus.off(token, (data: { value: string }) => data.value.split(''));
+                    });
+                });
+
+                describe('job.emit', () => {
+                    test('accepts token', () => {
+                        eventBus.job.emit(token);
+                    });
+                });
+
+                describe('job.on', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.job.on(token, ({ resolve }) => resolve({ value: 1 }));
+                        eventBus.job.on(token, ({ reject }) => reject(new Error('Oops!')));
+                        eventBus.job.on(token, ({ reject }) => reject('Oops!'));
+                        eventBus.job.on(optionalPayloadToken, ({ resolve }) =>
+                            resolve({ value: 1 })
+                        );
+                        eventBus.job.on(optionalPayloadToken, ({ resolve }) => resolve());
+                    });
+
+                    test('rejects invalid handler', () => {
+                        eventBus.job.on(token, ({ resolve }) => {
+                            // @ts-expect-error Type 'string' is not assignable to type 'number'.ts(2322)
+                            resolve({ value: '' });
+                        });
+                        eventBus.job.on(token, ({ reject }) => {
+                            // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                            reject(123);
+                        });
+                    });
+                });
+
+                describe('job.off', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.job.off(token, ({ resolve }) => resolve({ value: 1 }));
+                        eventBus.job.off(token, ({ reject }) => reject(new Error('Oops!')));
+                        eventBus.job.off(token, ({ reject }) => reject('Oops!'));
+                    });
+
+                    test('rejects invalid handler', () => {
+                        eventBus.job.off(token, ({ resolve }) => {
+                            // @ts-expect-error Type 'string' is not assignable to type 'number'.ts(2322)
+                            resolve({ value: '' });
+                        });
+                        eventBus.job.off(token, ({ reject }) => {
+                            // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                            reject(123);
+                        });
+                    });
+                });
+            });
+        });
+
+        describe('when eventBus is typed', () => {
+            interface TestEvents {
+                'number-event': { value: number };
+                'string-event': { value: string };
+                'optional-payload-event': { value: number } | undefined;
+            }
+
+            const eventBus = new EventBus<TestEvents>();
+
+            describe('emit', () => {
+                test('accepts valid events and data', () => {
+                    eventBus.emit('number-event', { value: 1 });
+                    eventBus.emit('string-event', { value: '' });
+                    eventBus.emit('optional-payload-event', { value: 1 });
+                    eventBus.emit('optional-payload-event');
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error '"foo"' is not assignable to parameter of type 'keyof TestEvents'
+                    eventBus.emit('foo', { value: 1 });
+                });
+
+                test('rejects invalid data', () => {
+                    // @ts-expect-error Type 'string' is not assignable to type 'number'
+                    eventBus.emit('number-event', { value: '' });
+
+                    // @ts-expect-error 'foo' does not exist in type '{ value: number; }'
+                    eventBus.emit('number-event', { foo: 1 });
+                });
+
+                test('rejects missing data', () => {
+                    // @ts-expect-error Expected 2 arguments, but got 1
+                    eventBus.emit('number-event');
+                });
+
+                test('accepts event with no data', () => {
+                    new EventBus<{ foo: never }>().emit('foo');
+                    new EventBus<{ foo: undefined }>().emit('foo');
+                });
+            });
+
+            describe('on', () => {
+                test('accepts valid event and handler', () => {
+                    eventBus.on('number-event', () => {});
+                    eventBus.on('number-event', data => data.value++);
+                    eventBus.on('string-event', data => data.value.split(''));
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '"foo"' is not assignable to parameter of type 'keyof TestEvents'
+                    eventBus.on('foo', () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    // @ts-expect-error Property 'split' does not exist on type 'number'.
+                    eventBus.on('number-event', data => data.value.split(''));
+
+                    // @ts-expect-error An arithmetic operand must be of type 'any', 'number', 'bigint' or an enum type.
+                    eventBus.on('string-event', data => data.value++);
+                });
+            });
+
+            describe('off', () => {
+                test('accepts valid event and handler', () => {
+                    eventBus.off('number-event', () => {});
+                    eventBus.off('number-event', data => data.value++);
+                    eventBus.off('string-event', data => data.value.split(''));
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '"foo"' is not assignable to parameter of type 'keyof TestEvents'
+                    eventBus.off('foo', () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    // @ts-expect-error Property 'split' does not exist on type 'number'.
+                    eventBus.off('number-event', data => data.value.split(''));
+
+                    // @ts-expect-error An arithmetic operand must be of type 'any', 'number', 'bigint' or an enum type.
+                    eventBus.off('string-event', data => data.value++);
+                });
+            });
+
+            describe('job.emit', () => {
+                test('accepts valid event', () => {
+                    eventBus.job.emit('number-event');
+                    eventBus.job.emit('string-event');
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '"foo"' is not assignable to parameter of type 'keyof TestEvents'.
+                    eventBus.job.emit('foo');
+                });
+            });
+
+            describe('job.on', () => {
+                test('accepts valid event and handler', () => {
+                    eventBus.job.on('number-event', () => {});
+                    eventBus.job.on('number-event', ({ resolve }) => resolve({ foo: 1 }));
+                    eventBus.job.on('string-event', ({ resolve }) => resolve({ foo: 1 }));
+                    eventBus.job.on('string-event', ({ reject }) => reject(new Error('Oops!')));
+                    eventBus.job.on('number-event', ({ reject }) => reject('Oops!'));
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '"foo"' is not assignable to parameter of type 'keyof TestEvents'.
+                    eventBus.job.on('foo', () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'
+                    eventBus.job.on('number-event', ({ reject }) => reject(123));
+                });
+            });
+
+            describe('job.off', () => {
+                test('accepts valid event and handler', () => {
+                    eventBus.job.off('number-event', () => {});
+                    eventBus.job.off('number-event', ({ resolve }) => resolve({ foo: 1 }));
+                    eventBus.job.off('string-event', ({ resolve }) => resolve({ foo: 1 }));
+                    eventBus.job.off('string-event', ({ reject }) => reject(new Error('Oops!')));
+                    eventBus.job.off('number-event', ({ reject }) => reject('Oops!'));
+                });
+
+                test('rejects invalid event', () => {
+                    // @ts-expect-error Argument of type '"foo"' is not assignable to parameter of type 'keyof TestEvents'.
+                    eventBus.job.off('foo', () => {});
+                });
+
+                test('rejects invalid handler', () => {
+                    // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'
+                    eventBus.job.off('number-event', ({ reject }) => reject(123));
+                });
+            });
+
+            describe('when event is symbolToken', () => {
+                const token = symbolToken<{ value: number }>('token');
+                const optionalPayloadToken = symbolToken<{ value: number } | undefined>(
+                    'optionalToken'
+                );
+
+                const eventBus = new EventBus<TestEvents>();
+
+                describe('emit', () => {
+                    test('accepts valid data', () => {
+                        eventBus.emit(token, { value: 1 });
+                        eventBus.emit(optionalPayloadToken, { value: 1 });
+                        eventBus.emit(optionalPayloadToken);
+                    });
+
+                    test('rejects invalid data', () => {
+                        // @ts-expect-error Type 'string' is not assignable to type 'number'
+                        eventBus.emit(token, { value: '' });
+                    });
+
+                    test('rejects missing value', () => {
+                        // @ts-expect-error Expected 2 arguments, but got 1
+                        eventBus.emit(token);
+                    });
+                });
+
+                describe('on', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.on(token, () => {});
+                        eventBus.on(token, data => data.value++);
+                    });
+
+                    test('rejects invalid handler', () => {
+                        // @ts-expect-error Argument of type '(_: number) => void' is not assignable to parameter of type ...
+                        eventBus.on(token, (_: number) => {});
+
+                        // @ts-expect-error Argument of type '(data: { value: string; }) => number' is not assignable to parameter of type ...
+                        eventBus.on(token, (data: { value: string }) => data.value.split(''));
+                    });
+                });
+
+                describe('off', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.off(token, () => {});
+                        eventBus.off(token, data => data.value++);
+                    });
+
+                    test('rejects invalid handler', () => {
+                        // @ts-expect-error Argument of type '(_: number) => void' is not assignable to parameter of type ...
+                        eventBus.off(token, (_: number) => {});
+
+                        // @ts-expect-error Argument of type '(data: { value: string; }) => number' is not assignable to parameter of type ...
+                        eventBus.off(token, (data: { value: string }) => data.value.split(''));
+                    });
+                });
+
+                describe('job.emit', () => {
+                    test('accepts token', () => {
+                        eventBus.job.emit(token);
+                    });
+                });
+
+                describe('job.on', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.job.on(token, ({ resolve }) => resolve({ value: 1 }));
+                        eventBus.job.on(token, ({ reject }) => reject(new Error('Oops!')));
+                        eventBus.job.on(token, ({ reject }) => reject('Oops!'));
+                        eventBus.job.on(optionalPayloadToken, ({ resolve }) => resolve());
+                    });
+
+                    test('rejects invalid handler', () => {
+                        eventBus.job.on(token, ({ resolve }) => {
+                            // @ts-expect-error Type 'string' is not assignable to type 'number'.ts(2322)
+                            resolve({ value: '' });
+                        });
+                        eventBus.job.on(token, ({ reject }) => {
+                            // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                            reject(123);
+                        });
+                    });
+                });
+
+                describe('job.off', () => {
+                    test('accepts valid handler', () => {
+                        eventBus.job.off(token, ({ resolve }) => resolve({ value: 1 }));
+                        eventBus.job.off(token, ({ reject }) => reject(new Error('Oops!')));
+                        eventBus.job.off(token, ({ reject }) => reject('Oops!'));
+                    });
+
+                    test('rejects invalid handler', () => {
+                        eventBus.job.off(token, ({ resolve }) => {
+                            // @ts-expect-error Type 'string' is not assignable to type 'number'.ts(2322)
+                            resolve({ value: '' });
+                        });
+                        eventBus.job.off(token, ({ reject }) => {
+                            // @ts-expect-error Argument of type '123' is not assignable to parameter of type 'string | Error | undefined'.
+                            reject(123);
+                        });
+                    });
+                });
+            });
+        });
+    });
+});

package/src/__tests__/event-bus.test.ts

@@ -1,6 +1,5 @@
 import * as mitt from 'mitt';
-import { renderHook } from '@testing-library/react';
-import { useEventBus, EventBus } from '../event-bus';
+import { EventBus, typedEventBusToken, EVENT_BUS_TOKEN } from '../event-bus';
 
 jest.mock('mitt', () => jest.fn());
 
@@ -126,22 +125,10 @@ describe(`[web-components] ${EventBus.name}`, () => {
     });
 });
 
-describe(`[web-components] ${useEventBus.name}`, () => {
-    function subject() {
-        return renderHook(() => useEventBus());
-    }
+describe(`[web-components] ${typedEventBusToken.name}`, () => {
+    const subject = () => typedEventBusToken<any>();
 
-    test('provides an event bus instance', () => {
-        expect(subject().result.current).toBeInstanceOf(EventBus);
-    });
-
-    test('when the component using useEventBus is re-rendered, useEventBus provides the same event bus instance', () => {
-        const { result, rerender } = subject();
-
-        const firstInstance = result.current;
-        rerender();
-
-        const secondInstance = result.current;
-        expect(firstInstance).toBe(secondInstance);
+    test('returns EVENT_BUS_TOKEN', () => {
+        expect(subject()).toBe(EVENT_BUS_TOKEN);
     });
 });

package/src/__tests__/get-value-for-environment.test.ts

@@ -6,14 +6,7 @@ import {
 
 describe(`[web-components] ${getValueForEnvironment.name}`, () => {
     const originalLocation = window.location;
-    const values: EnvironmentValues = {
-        dev: 'dev-value',
-        go: 'go-value',
-        next: 'next-value',
-        qa: 'qa-value',
-        stage: 'stage-value',
-        test: 'test-value',
-    };
+    let values: EnvironmentValues & { [key: string]: string };
     let hostname: string | undefined;
     let defaultEnvironment: Environment | undefined;
 
@@ -33,14 +26,19 @@ describe(`[web-components] ${getValueForEnvironment.name}`, () => {
     });
 
     beforeEach(() => {
+        values = { dev: 'dev-value', qa: 'qa-value', test: 'test-value' };
         hostname = undefined;
         defaultEnvironment = undefined;
         process.env.NODE_ENV = 'production';
     });
 
-    test('returns id for "qa" environment', () => {
-        expect(subject()).toBe(values.qa);
-    });
+    function itReturnsQAEnvironment() {
+        test('returns id for "qa" environment', () => {
+            expect(subject()).toBe(values.qa);
+        });
+    }
+
+    itReturnsQAEnvironment();
 
     describe('when in test environment', () => {
         beforeEach(() => (process.env.NODE_ENV = 'test'));
@@ -58,20 +56,40 @@ describe(`[web-components] ${getValueForEnvironment.name}`, () => {
         });
     });
 
-    describe.each([
-        { host: '127.0.0.1', key: 'dev' },
-        { host: 'localhost', key: 'dev' },
-        { host: 'go.servicetitan.com', key: 'go' },
-        { host: 'next.servicetitan.com', key: 'next' },
-        { host: 'stage.servicetitan.com', key: 'stage' },
-    ] as {
-        host: string;
-        key: Environment;
-    }[])('when hostname contains "$host"', ({ host, key }) => {
+    describe.each(['127.0.0.1', 'localhost'])('when hostname contains "%s"', host => {
         beforeEach(() => (hostname = host));
 
-        test(`returns id for "${key}" environment`, () => {
+        test('returns id for "dev" environment', () => {
+            expect(subject()).toBe(values.dev);
+        });
+    });
+
+    describe('when hostname contains "{key}.servicetitan.com"', () => {
+        const key = 'foo-bar';
+
+        beforeEach(() => {
+            hostname = `${key}.servicetitan.com`;
+            values = { [key]: 'key-value' };
+        });
+
+        test('returns key value', () => {
             expect(subject()).toBe(values[key]);
         });
     });
+
+    describe('when hostname contains ".st.dev"', () => {
+        beforeEach(() => (hostname = 'foo-bar-stage.st.dev'));
+
+        itReturnsQAEnvironment();
+
+        describe('when key matches ".st.dev" domain', () => {
+            const key = 'stage.st.dev';
+
+            beforeEach(() => (values = { [key]: 'key-value' }));
+
+            test('returns key value', () => {
+                expect(subject()).toBe(values[key]);
+            });
+        });
+    });
 });

package/src/contexts/mfe-data-context.ts

@@ -3,18 +3,9 @@
  */
 
 import { createContext, useContext } from 'react';
-import { JSON, JSONPrimitive } from '../types';
+import { JSON, Serializable } from '../types';
 
-// Type complexity below is required to support Interfaces being used
-export type MFEContextData<T> = {
-    [P in keyof T]: T[P] extends JSONPrimitive
-        ? T[P]
-        : T[P] extends (infer U)[]
-          ? MFEContextData<U>[]
-          : T[P] extends JSON
-            ? MFEContextData<T[P]>
-            : never;
-};
+export type MFEContextData<T> = Serializable<T>;
 
 export const MFEDataContext = createContext<JSON>({});
 

package/src/contexts/tests/mfe-data-context.test.tsx

@@ -7,7 +7,7 @@ describe(`[web-components] ${useMFEDataContext.name}`, () => {
 
     describe('when the MFEDataContext is provided by a parent', () => {
         const data = { foo: 'bar' };
-        const Wrapper: FC<PropsWithChildren<{}>> = ({ children }) => {
+        const Wrapper: FC<PropsWithChildren> = ({ children }) => {
             return <MFEDataContext.Provider value={data}>{children}</MFEDataContext.Provider>;
         };
 
@@ -17,7 +17,7 @@ describe(`[web-components] ${useMFEDataContext.name}`, () => {
     });
 
     describe('when the MFEDataContext is not provided by a parent', () => {
-        const Wrapper: FC<PropsWithChildren<{}>> = ({ children }) => {
+        const Wrapper: FC<PropsWithChildren> = ({ children }) => {
             return <div>{children}</div>;
         };