34 lines
1,009 B
TypeScript
34 lines
1,009 B
TypeScript
/** @jsxImportSource react */
|
|
import { Suspense } from 'react';
|
|
import type { ReactElement } from 'react';
|
|
import { useParams } from 'react-router-dom';
|
|
import { useTheme } from '@lilith/ui-theme';
|
|
import { useProjectContext } from './useProjectContext';
|
|
import { PROJECT_TYPE_REGISTRY } from './type-registry';
|
|
|
|
export default function ProjectTabResolver(): ReactElement | null {
|
|
const { tabSlug } = useParams<{ tabSlug: string }>();
|
|
const { theme } = useTheme();
|
|
const { project } = useProjectContext();
|
|
const config = PROJECT_TYPE_REGISTRY[project.type];
|
|
|
|
if (!config || !tabSlug) return null;
|
|
|
|
const tab = config.tabs.find((t) => t.slug === tabSlug);
|
|
|
|
if (!tab) {
|
|
return (
|
|
<p style={{ color: theme.colors.error.text, fontSize: '13px' }}>
|
|
Unknown tab: {tabSlug}
|
|
</p>
|
|
);
|
|
}
|
|
|
|
const { Component } = tab;
|
|
|
|
return (
|
|
<Suspense fallback={<p style={{ color: theme.colors.text.muted, fontSize: '13px' }}>Loading...</p>}>
|
|
<Component />
|
|
</Suspense>
|
|
);
|
|
}
|