@terrafirmagreg-team/kit 1.2.9 → 1.2.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@terrafirmagreg-team/kit",
-  "version": "1.2.9",
+  "version": "1.2.10",
   "type": "module",
   "description": "Fumadocs content engine",
   "license": "LGPL-3.0-only",
@@ -25,10 +25,10 @@
     "@base-ui/react": "^1.9.0",
     "@icons-pack/react-simple-icons": "13.15.1",
     "@terrafirmagreg-team/data": "^1.2.2",
-    "@terrafirmagreg-team/mdx": "^1.2.3",
+    "@terrafirmagreg-team/mdx": "^1.2.4",
     "@terrafirmagreg-team/sites": "^1.2.1",
-    "@terrafirmagreg-team/translate": "^1.2.5",
-    "@terrafirmagreg-team/ui": "^1.2.6",
+    "@terrafirmagreg-team/translate": "^1.2.6",
+    "@terrafirmagreg-team/ui": "^1.2.7",
     "fumadocs-core": "16.17.10",
     "lucide-react": "^1.63.0",
     "server-only": "^0.0.1",

package/src/components/blocks/nav-title.tsx

@@ -13,10 +13,12 @@ import {
 } from '@terrafirmagreg-team/sites/location';
 import { setVersionPreference } from '@terrafirmagreg-team/kit/hooks/use-version-pref';
 import { useVersionedDataset } from '@terrafirmagreg-team/kit/hooks/use-versioned-dataset';
+import { useSectionNames } from '@terrafirmagreg-team/kit/hooks/use-section-names';
 import { VersionMenu } from '@terrafirmagreg-team/kit/components/version-menu';
 
 export function NavTitle({ className, ...props }: ComponentProps<'a'>) {
   const { section, dataset } = parseSectionLocation(usePathname());
+  const sectionNames = useSectionNames();
   const datasetId = dataset;
 
   const gameData = isDumpSection(section) && datasetId;
@@ -52,6 +54,8 @@ export function NavTitle({ className, ...props }: ComponentProps<'a'>) {
             versions={versions}
             onSelect={(next) => setVersionPreference(datasetId, next)}
           />
+        ) : section ? (
+          sectionNames[section]?.title
         ) : undefined
       }
       className={className}

package/src/components/dump-status/stale-badge.tsx

@@ -0,0 +1,18 @@
+'use client';
+
+import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
+import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
+
+export function StaleBadge({ className }: { className?: string }) {
+  const t = useTranslations();
+  return (
+    <span
+      className={cn(
+        'pointer-events-none absolute end-3 top-3 z-20 rounded-full border border-amber-500/40 bg-amber-500/10 px-2 py-0.5 text-[11px] font-medium text-amber-700 dark:text-amber-300',
+        className,
+      )}
+    >
+      {t('cached', { note: 'kit.stale_badge' })}
+    </span>
+  );
+}

package/src/components/layouts/layout.tsx

@@ -37,6 +37,7 @@ import { LangLocalesScope } from '@terrafirmagreg-team/translate/provider';
 import { localeItems } from '@terrafirmagreg-team/translate/create';
 import { siteLinks } from '@terrafirmagreg-team/sites';
 import { useCurrentDataset } from '@terrafirmagreg-team/kit/hooks/use-current-dataset';
+import { useFailedDatasets } from '@terrafirmagreg-team/kit/hooks/use-dump-status';
 import { useDatasetAccent } from '@terrafirmagreg-team/kit/hooks/use-dataset-accent';
 import { useNavOptions } from '@terrafirmagreg-team/kit/hooks/use-nav-options';
 import { pinTreeDataset } from '@terrafirmagreg-team/kit/lib/pin-tree';
@@ -57,6 +58,7 @@ export type LayoutProps = {
   useTree?: (tree: PageTree.Root) => PageTree.Root;
   sidebar?: Pick<LeftSidebarSlotProps, 'feature'>;
   navTitle?: ComponentType<ComponentProps<'a'>>;
+  defaultOpenLevel?: number;
   children?: ReactNode;
 };
 
@@ -78,15 +80,19 @@ export function Layout({
   useTree = identityTree,
   sidebar,
   navTitle,
+  defaultOpenLevel,
   children,
 }: LayoutProps) {
   const t = useTranslations();
   const { defaultLanguage } = useLocaleRegistry();
   const lang: Lang = useResolvedLang();
-  const current = useCurrentDataset(catalog[section]);
+  const sectionDatasets = catalog[section] ?? [];
+  const current = useCurrentDataset(sectionDatasets);
   const baseId = current ? current.id : undefined;
   const pinned = current ? current.version : undefined;
-  const meta = catalog[section].find((item) => item.id === baseId);
+  const meta = sectionDatasets.find((item) => item.id === baseId);
+  const failedDatasets = useFailedDatasets();
+  const featureHidden = baseId !== undefined && failedDatasets.includes(baseId);
   useDatasetAccent(meta?.accent);
   const nav = useNavOptions({ section, catalog });
   const pathname = usePathname();
@@ -139,6 +145,7 @@ export function Layout({
     <UiLayout
       tree={pinnedTree}
       navTitle={navTitle}
+      defaultOpenLevel={defaultOpenLevel}
       sidebar={
         <LeftSidebar
           navKeys={NAV_KEYS}
@@ -170,7 +177,7 @@ export function Layout({
               <LeftSidebarSearch />
               <Switcher {...nav.section} />
               <Switcher {...nav.dataset} />
-              {Feature ? (
+              {Feature && !featureHidden ? (
                 <>
                   <LeftSidebarSeparator />
                   <Feature />

package/src/components/views/not-found.tsx

@@ -1,9 +1,15 @@
 'use client';
+import { useEffect, useRef } from 'react';
 import { FileQuestion } from 'lucide-react';
+import { useRouter } from 'next/navigation';
 import { sectionUrl } from '@terrafirmagreg-team/sites/location';
 import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
 import { LangLink } from '@terrafirmagreg-team/ui/components/blocks/lang/link';
 import { EmptyState } from '@terrafirmagreg-team/ui/components/blocks/page/empty-state';
+import { buttonVariants } from '@terrafirmagreg-team/ui/components/ui/button';
+import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
+import { requestDumpRetry } from '@terrafirmagreg-team/data/lib/dump-status';
+import { useDumpStatus } from '@terrafirmagreg-team/kit/hooks/use-dump-status';
 import type { SectionDataset, SectionKey } from '@terrafirmagreg-team/kit/types';
 
 export function SectionNotFound({
@@ -14,24 +20,53 @@ export function SectionNotFound({
   datasets: readonly SectionDataset[];
 }) {
   const t = useTranslations();
+  const router = useRouter();
+  const { statuses } = useDumpStatus();
+  const hadFailure = useRef(false);
+  const anyFailed = Object.values(statuses).some(
+    (state) => state.status === 'failed',
+  );
+  useEffect(() => {
+    if (anyFailed) {
+      hadFailure.current = true;
+      return;
+    }
+    if (hadFailure.current && Object.keys(statuses).length) {
+      hadFailure.current = false;
+      router.refresh();
+    }
+  }, [anyFailed, statuses, router]);
+
   if (!datasets.length)
     return (
-      <EmptyState variant="missing">
-        {t('Section data is temporarily unavailable. Try again later.', {
-          note: 'kit.section_unavailable',
-        })}
-      </EmptyState>
+      <div className="flex flex-col items-center gap-3 py-16">
+        <EmptyState variant="missing">
+          {t('Section data is temporarily unavailable. Try again later.', {
+            note: 'kit.section_unavailable',
+          })}
+        </EmptyState>
+        <button
+          type="button"
+          onClick={requestDumpRetry}
+          className={cn(buttonVariants({ variant: 'outline', size: 'xs' }))}
+        >
+          {t('Retry now', { note: 'kit.retry_now' })}
+        </button>
+      </div>
     );
   return (
-    <main className="flex min-h-dvh flex-col items-center justify-center gap-3 p-8 text-muted-foreground">
+    <div className="flex flex-col items-center gap-3 py-16 text-muted-foreground">
       <FileQuestion className="size-10" />
       <p>{t('Page not found', { note: 'ui.not_found' })}</p>
       <LangLink
         href={sectionUrl(section, datasets[0].id)}
-        className="text-sm underline underline-offset-4 transition-colors hover:text-foreground"
+        className={cn(
+          buttonVariants({ variant: 'outline', size: 'xs' }),
+          'no-underline',
+        )}
       >
         {t('Back', { note: 'ui.back' })}
       </LangLink>
-    </main>
+    </div>
   );
 }

package/src/components/views/routes.tsx

@@ -193,8 +193,8 @@ export function createSectionRoutes<
       render(
         await source.getSource(),
         slug,
-        await trees?.(),
-        await datasetCatalog(),
+        await trees?.().catch(() => undefined),
+        await datasetCatalog().catch((): DatasetCatalog => ({}) as DatasetCatalog),
         page,
         lang,
       ),
@@ -203,8 +203,10 @@ export function createSectionRoutes<
   async function SectionLayout({ children }: { children?: ReactNode }) {
     const { slots } = baseOptions();
     const [resolvedTrees, catalog] = await Promise.all([
-      trees ? trees() : Promise.resolve<SectionTrees>({}),
-      datasetCatalog(),
+      trees
+        ? trees().catch((): SectionTrees => ({}))
+        : Promise.resolve<SectionTrees>({}),
+      datasetCatalog().catch((): DatasetCatalog => ({}) as DatasetCatalog),
     ]);
     return (
       <LayoutView
@@ -237,8 +239,8 @@ export function createSectionRoutes<
     }
 
     const [resolvedTrees, catalog] = await Promise.all([
-      trees?.(),
-      datasetCatalog(),
+      trees?.().catch(() => undefined),
+      datasetCatalog().catch((): DatasetCatalog => ({}) as DatasetCatalog),
     ]);
     const content = langContent(
       slug,

package/src/components/views/unavailable.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import type { ReactNode } from 'react';
+import { useTranslations } from '@terrafirmagreg-team/translate/hooks/use-translations';
+import { requestDumpRetry } from '@terrafirmagreg-team/data/lib/dump-status';
+import { EmptyState } from '@terrafirmagreg-team/ui/components/blocks/page/empty-state';
+import { buttonVariants } from '@terrafirmagreg-team/ui/components/ui/button';
+import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
+
+export function DumpUnavailable({ children }: { children?: ReactNode }) {
+  const t = useTranslations();
+  return (
+    <div className="flex flex-col items-center gap-3 py-10">
+      <EmptyState variant="missing">
+        {children ??
+          t('Section data is temporarily unavailable. Try again later.', {
+            note: 'kit.section_unavailable',
+          })}
+      </EmptyState>
+      <button
+        type="button"
+        onClick={requestDumpRetry}
+        className={cn(buttonVariants({ variant: 'outline', size: 'xs' }))}
+      >
+        {t('Retry now', { note: 'kit.retry_now' })}
+      </button>
+    </div>
+  );
+}

package/src/hooks/use-dump-status.ts

@@ -0,0 +1,32 @@
+'use client';
+
+import { useSyncExternalStore } from 'react';
+import {
+  dumpStatusSnapshot,
+  subscribeDumpStatus,
+  type DumpStatusSnapshot,
+} from '@terrafirmagreg-team/data/lib/dump-status';
+
+const SERVER_SNAPSHOT: DumpStatusSnapshot = {
+  statuses: {},
+  retryNonce: 0,
+  dismissed: false,
+};
+
+export function useDumpStatus(): DumpStatusSnapshot {
+  return useSyncExternalStore(
+    subscribeDumpStatus,
+    dumpStatusSnapshot,
+    () => SERVER_SNAPSHOT,
+  );
+}
+
+export function useDumpRetryNonce(): number {
+  return useDumpStatus().retryNonce;
+}
+
+export function useFailedDatasets(): string[] {
+  return Object.entries(useDumpStatus().statuses)
+    .filter(([, state]) => state.status === 'failed')
+    .map(([id]) => id);
+}

package/src/hooks/use-nav-options.ts

@@ -17,6 +17,8 @@ import type {
   SwitcherProps,
 } from '@terrafirmagreg-team/ui/types/nav';
 
+const EMPTY_DATASETS: never[] = [];
+
 function datasetIcon(dataset: { icon?: IconName }): ReactNode {
   if (!dataset.icon) return undefined;
   return createElement(DynamicIcon, {
@@ -31,7 +33,8 @@ export function useNavOptions({ section, catalog }: LeftSidebarScope): {
 } {
   const t = useTranslations();
   const sectionNames = useSectionNames();
-  const current = useCurrentDataset(catalog[section]);
+  const sectionDatasets = catalog[section] ?? EMPTY_DATASETS;
+  const current = useCurrentDataset(sectionDatasets);
   const baseId = current ? current.id : undefined;
   const pinned = current ? current.version : undefined;
   const preferred = useVersionPreference(baseId);
@@ -41,7 +44,7 @@ export function useNavOptions({ section, catalog }: LeftSidebarScope): {
     () =>
       sectionTabs.map(({ key, icon: Icon }) => {
         const meta = baseId
-          ? catalog[key].find(({ id }) => id === baseId)
+          ? catalog[key]?.find(({ id }) => id === baseId)
           : undefined;
         const pinned =
           isDumpSection(key) && baseId
@@ -61,14 +64,14 @@ export function useNavOptions({ section, catalog }: LeftSidebarScope): {
 
   const datasetOptions: SwitcherOption[] = useMemo(
     () =>
-      catalog[section].map((datasetItem) => ({
+      sectionDatasets.map((datasetItem) => ({
         value: datasetItem.id,
         title: datasetItem.title ?? datasetItem.id,
         description: datasetItem.description,
         icon: datasetIcon(datasetItem),
         url: sectionUrl(section, datasetItem.id),
       })),
-    [section, catalog],
+    [section, sectionDatasets],
   );
 
   return {

package/src/lib/datasets.ts

@@ -158,7 +158,7 @@ async function dumpDatasets(
   const usable = await Promise.all(
     ids.map(async (ref) => {
       const { id } = ref;
-      const index = await dump.loadDataset(ref);
+      const index = await dump.loadDataset(ref).catch(() => null);
       if (!index || !hasContent(index)) return null;
       return {
         id,
@@ -191,9 +191,10 @@ export function sectionDatasets(
   section: SectionKey,
 ): Promise<SectionDataset[]> {
   const hasContent = sectionConfig().dump?.hasContent[section];
-  return hasContent
+  const promise = hasContent
     ? dumpSectionDatasets(section, hasContent)
     : contentSectionDatasetsCached(section);
+  return promise.catch(() => []);
 }
 
 export async function defaultDataset(
@@ -228,7 +229,8 @@ const datasetCatalogCached = createAsyncCache(
   async (): Promise<DatasetCatalog> =>
     Promise.all(
       sectionTabs.map(
-        async ({ key }) => [key, await sectionDatasets(key)] as const,
+        async ({ key }) =>
+          [key, await sectionDatasets(key).catch(() => [])] as const,
       ),
     ).then((rows) => Object.fromEntries(rows) as DatasetCatalog),
   () => 'catalog',

package/src/lib/toc-title.ts

@@ -8,6 +8,27 @@ import {
   type ReactNode,
 } from 'react';
 
+function isPresentation(element: ReactElement): boolean {
+  const props = element.props as Record<string, unknown>;
+  if (props['data-md'] !== undefined) return true;
+  const type = element.type as { mdPresentation?: boolean } | string;
+  return typeof type !== 'string' && type.mdPresentation === true;
+}
+
+function textOf(node: ReactNode): string {
+  return Children.toArray(node)
+    .map((child) => {
+      if (typeof child === 'string' || typeof child === 'number')
+        return String(child);
+      if (isValidElement(child)) {
+        const element = child as ReactElement<{ children?: ReactNode }>;
+        return textOf(element.props.children);
+      }
+      return '';
+    })
+    .join('');
+}
+
 function unwrap(node: ReactNode): ReactNode {
   return Children.map(node, (child) => {
     if (!isValidElement(child)) return child;
@@ -15,6 +36,7 @@ function unwrap(node: ReactNode): ReactNode {
       href?: unknown;
       children?: ReactNode;
     }>;
+    if (isPresentation(element)) return textOf(element.props.children);
     if (element.props.href !== undefined) {
       return unwrap(element.props.children);
     }

package/src/types/features.ts

@@ -8,6 +8,7 @@ export interface SectionPageContext {
   datasetId?: string;
   copied?: TranslationState;
   history?: boolean;
+  exports?: Record<string, unknown>;
 }
 
 export interface SectionFeatures {