Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | import type {IComponent} from '@feasibleone/blong';
import {useEffect} from 'react';
import {Portal} from '../components/Portal/Portal.js';
import {useBlong} from '../index.js';
import {useAppStore} from '../state/appStore.js';
import type {ITab} from '../types/portal.js';
export function Model({
componentName,
params,
}: {
componentName: string;
params?: Record<string, unknown>;
}) {
const {handler} = useBlong();
useEffect(() => {
// Reset first to avoid bleed-through from previous stories
useAppStore.setState({portal: {tabs: [], activeTabId: null, portalConfig: null}});
const store = useAppStore.getState();
store.setPermissions(true);
void (async () => {
try {
const component = await (handler[`component/${componentName}`]({}, {}) as Promise<IComponent>);
const tab: ITab = {
id: 'test-tab',
actionName: 'test-action',
params,
title: componentName,
component: (await component?.component(params)) as React.ComponentType,
};
store.openTab(tab);
} catch {}
})();
return () => {
useAppStore.setState({portal: {tabs: [], activeTabId: null, portalConfig: null}});
};
// eslint-disable-next-line @eslint-react/exhaustive-deps -- run once on mount
}, []);
return <Portal />;
}
|