@terrafirmagreg-team/kit 1.2.10 → 1.2.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@terrafirmagreg-team/kit",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "type": "module",
   "description": "Fumadocs content engine",
   "license": "LGPL-3.0-only",
@@ -24,11 +24,11 @@
   "dependencies": {
     "@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.4",
-    "@terrafirmagreg-team/sites": "^1.2.1",
-    "@terrafirmagreg-team/translate": "^1.2.6",
-    "@terrafirmagreg-team/ui": "^1.2.7",
+    "@terrafirmagreg-team/data": "^1.2.3",
+    "@terrafirmagreg-team/mdx": "^1.2.5",
+    "@terrafirmagreg-team/sites": "^1.2.2",
+    "@terrafirmagreg-team/translate": "^1.2.7",
+    "@terrafirmagreg-team/ui": "^1.2.8",
     "fumadocs-core": "16.17.10",
     "lucide-react": "^1.63.0",
     "server-only": "^0.0.1",

package/src/components/layouts/layout.tsx

@@ -21,6 +21,7 @@ import {
 } from '@terrafirmagreg-team/ui/components/blocks/nav/site-menu';
 import { buttonVariants } from '@terrafirmagreg-team/ui/components/ui/button';
 import { cn } from '@terrafirmagreg-team/ui/lib/utils/cn';
+import { skeletonTree } from '@terrafirmagreg-team/ui/lib/tree';
 import { Globe } from 'lucide-react';
 import {
   SiCurseforge,
@@ -92,7 +93,7 @@ export function Layout({
   const pinned = current ? current.version : undefined;
   const meta = sectionDatasets.find((item) => item.id === baseId);
   const failedDatasets = useFailedDatasets();
-  const featureHidden = baseId !== undefined && failedDatasets.includes(baseId);
+  const datasetFailed = baseId !== undefined && failedDatasets.includes(baseId);
   useDatasetAccent(meta?.accent);
   const nav = useNavOptions({ section, catalog });
   const pathname = usePathname();
@@ -110,12 +111,14 @@ export function Layout({
     $id: `${section}:empty`,
   };
   const tree = useTree(serverTree);
+  const effectiveTree =
+    datasetFailed && !tree.children.length ? skeletonTree() : tree;
   const pinnedTree = useMemo(
     () =>
       pinned && baseId
-        ? pinTreeDataset(tree, section, baseId, pinned)
-        : tree,
-    [tree, section, baseId, pinned],
+        ? pinTreeDataset(effectiveTree, section, baseId, pinned)
+        : effectiveTree,
+    [effectiveTree, section, baseId, pinned],
   );
   const locales = meta?.languages ? localeItems(meta.languages) : undefined;
   const links = baseId
@@ -177,7 +180,7 @@ export function Layout({
               <LeftSidebarSearch />
               <Switcher {...nav.section} />
               <Switcher {...nav.dataset} />
-              {Feature && !featureHidden ? (
+              {Feature ? (
                 <>
                   <LeftSidebarSeparator />
                   <Feature />

package/src/components/page-features.tsx

@@ -0,0 +1,30 @@
+import type {
+  SectionFeatures,
+  SectionPageContext,
+} from '../types/features.ts';
+import type { ReactNode } from 'react';
+
+export function pageFeatureNodes(
+  ctx: SectionPageContext,
+  features: SectionFeatures,
+  body: ReactNode,
+): {
+  actionsRight: ReactNode;
+  body: ReactNode;
+  footer: ReactNode;
+  comments: ReactNode;
+} {
+  const wrapped = features.wrapBody ? (
+    features.wrapBody(body, ctx)
+  ) : (
+    <div data-md-root className="contents">
+      {body}
+    </div>
+  );
+  return {
+    actionsRight: features.actionsRight?.(ctx),
+    body: wrapped,
+    footer: features.footer?.(ctx),
+    comments: features.comments?.(ctx),
+  };
+}

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

@@ -1,8 +1,7 @@
 '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 { usePathname, useRouter } from 'next/navigation';
+import { isSectionKey, 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';
@@ -10,6 +9,7 @@ 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 { useSectionCatalog } from '@terrafirmagreg-team/kit/hooks/use-catalog';
 import type { SectionDataset, SectionKey } from '@terrafirmagreg-team/kit/types';
 
 export function SectionNotFound({
@@ -39,7 +39,7 @@ export function SectionNotFound({
 
   if (!datasets.length)
     return (
-      <div className="flex flex-col items-center gap-3 py-16">
+      <div className="mx-2 flex min-w-0 flex-1 flex-col items-center justify-center gap-3 bg-background [grid-area:main] md:my-2 md:overflow-clip md:rounded-2xl md:border md:shadow-sm">
         <EmptyState variant="missing">
           {t('Section data is temporarily unavailable. Try again later.', {
             note: 'kit.section_unavailable',
@@ -55,13 +55,27 @@ export function SectionNotFound({
       </div>
     );
   return (
-    <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>
+    <div className="mx-2 flex min-w-0 flex-1 flex-col items-center justify-center gap-6 bg-background [grid-area:main] md:my-2 md:overflow-clip md:rounded-2xl md:border md:shadow-sm">
+      <div className="flex flex-col items-center gap-2 text-center">
+        <span
+          aria-hidden
+          className="select-none text-6xl leading-none font-semibold tracking-tighter text-muted-foreground/25"
+        >
+          404
+        </span>
+        <p className="font-medium text-foreground">
+          {t('Page not found', { note: 'ui.not_found' })}
+        </p>
+        <p className="max-w-sm text-sm text-balance text-muted-foreground">
+          {t("The page you're looking for doesn't exist or was moved.", {
+            note: 'ui.not_found_description',
+          })}
+        </p>
+      </div>
       <LangLink
         href={sectionUrl(section, datasets[0].id)}
         className={cn(
-          buttonVariants({ variant: 'outline', size: 'xs' }),
+          buttonVariants({ variant: 'outline', size: 'sm' }),
           'no-underline',
         )}
       >
@@ -70,3 +84,55 @@ export function SectionNotFound({
     </div>
   );
 }
+
+export function RootNotFound() {
+  const pathname = usePathname();
+  const catalog = useSectionCatalog();
+  const t = useTranslations();
+  const parts = pathname.split('/').filter(Boolean);
+  const section = isSectionKey(parts[0]) ? parts[0] : undefined;
+  const datasets = section ? catalog[section] : undefined;
+  const known = datasets?.some((dataset) => dataset.id === parts[1]);
+  const href =
+    section && datasets?.length
+      ? `/${section}/${known ? parts[1] : datasets[0].id}`
+      : '/';
+
+  return (
+    <main className="flex min-h-dvh flex-col items-center justify-center gap-8 p-8">
+      <div className="flex flex-col items-center gap-3 text-center">
+        <span
+          aria-hidden
+          className="select-none bg-gradient-to-b from-muted-foreground/40 to-muted-foreground/10 bg-clip-text text-[8rem] leading-none font-semibold tracking-tighter text-transparent"
+        >
+          404
+        </span>
+        <h1 className="text-xl font-semibold text-foreground">
+          {t('Page not found', { note: 'ui.not_found' })}
+        </h1>
+        <p className="max-w-sm text-sm text-balance text-muted-foreground">
+          {t("The page you're looking for doesn't exist or was moved.", {
+            note: 'ui.not_found_description',
+          })}
+        </p>
+      </div>
+      <div className="flex items-center gap-2">
+        <LangLink
+          href={href}
+          className={cn(buttonVariants({ size: 'sm' }), 'no-underline')}
+        >
+          {t('Back', { note: 'ui.back' })}
+        </LangLink>
+        <LangLink
+          href="/"
+          className={cn(
+            buttonVariants({ variant: 'ghost', size: 'sm' }),
+            'no-underline',
+          )}
+        >
+          {t('Go home', { note: 'ui.go_home' })}
+        </LangLink>
+      </div>
+    </main>
+  );
+}

package/src/components/views/unavailable.tsx

@@ -1,22 +1,23 @@
 'use client';
 
 import type { ReactNode } from 'react';
+import { CloudOff } from 'lucide-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">
+    <div className="pointer-events-auto flex max-w-xs flex-col items-center gap-2.5 rounded-lg border border-border bg-popover px-5 py-4 text-center shadow-lg">
+      <CloudOff className="size-5 text-muted-foreground" />
+      <p className="text-sm text-muted-foreground">
         {children ??
           t('Section data is temporarily unavailable. Try again later.', {
             note: 'kit.section_unavailable',
           })}
-      </EmptyState>
+      </p>
       <button
         type="button"
         onClick={requestDumpRetry}
@@ -27,3 +28,11 @@ export function DumpUnavailable({ children }: { children?: ReactNode }) {
     </div>
   );
 }
+
+export function DumpUnavailableOverlay({ children }: { children?: ReactNode }) {
+  return (
+    <div className="pointer-events-none absolute inset-0 z-20 flex items-center justify-center p-6">
+      {children ?? <DumpUnavailable />}
+    </div>
+  );
+}

package/src/lib/config.ts

@@ -43,6 +43,7 @@ export type SectionConfigInput = {
         url: string;
         icon?: string;
       }[];
+      sections?: readonly SectionKey[];
       guide?: { bookOrder?: readonly string[] };
     }
   >;

package/src/lib/datasets.ts

@@ -4,6 +4,7 @@ import { sectionConfig } from './config';
 import { sections } from './sources';
 import { datasetId } from './tree';
 import { createAsyncCache } from '@terrafirmagreg-team/data/lib/async-cache';
+import { dumpStatusSnapshot } from '@terrafirmagreg-team/data/lib/dump-status';
 import { loadLocaleRegistry, sortLangCodes } from '@terrafirmagreg-team/translate/server';
 import type { DatasetRef } from '@terrafirmagreg-team/sites/location';
 import { sectionTabs } from '@terrafirmagreg-team/sites/sections';
@@ -79,6 +80,30 @@ async function datasetMeta(
   return meta ? metaFields(meta) : {};
 }
 
+async function sectionDatasetMeta(
+  section: SectionKey,
+  id: string,
+): Promise<Omit<SectionDataset, 'id' | 'languages'>> {
+  const meta = await datasetMeta(section, id);
+  return Object.values(meta).some((value) => value !== undefined)
+    ? meta
+    : datasetMeta('docs', id);
+}
+
+const lastGoodDatasets = new Map<SectionKey, Map<string, SectionDataset>>();
+
+function rememberDataset(section: SectionKey, row: SectionDataset) {
+  let good = lastGoodDatasets.get(section);
+  if (!good) lastGoodDatasets.set(section, (good = new Map()));
+  good.set(row.id, row);
+}
+
+function datasetMembership(section: SectionKey, id: string): boolean {
+  const declared = sectionConfig().datasetConfig[id]?.sections;
+  if (declared) return declared.includes(section);
+  return lastGoodDatasets.get(section)?.has(id) === true;
+}
+
 function metaFields(
   meta: Record<string, unknown>,
 ): Omit<SectionDataset, 'id' | 'languages'> {
@@ -144,47 +169,59 @@ async function dumpDatasets(
 ): Promise<SectionDataset[]> {
   const dump = sectionConfig().dump;
   if (!dump) return [];
-  const refs = await dump.discoverDatasets();
+  const refs = await dump.discoverDatasets().catch(() => [] as DatasetRef[]);
   const versions = new Map<string, string[]>();
-  for (const ref of refs) {
-    const { id, version } = ref;
-    if (version) {
-      const list = versions.get(id) ?? [];
-      list.push(version);
-      versions.set(id, list);
+  const ids: string[] = [];
+  if (refs.length) {
+    for (const ref of refs) {
+      const { id, version } = ref;
+      if (version) {
+        const list = versions.get(id) ?? [];
+        list.push(version);
+        versions.set(id, list);
+      } else {
+        ids.push(id);
+      }
+    }
+  } else {
+    for (const id of Object.keys(sectionConfig().datasetConfig)) {
+      if (datasetMembership(section, id)) ids.push(id);
     }
   }
-  const ids = refs.filter((ref) => !ref.version);
-  const usable = await Promise.all(
-    ids.map(async (ref) => {
-      const { id } = ref;
-      const index = await dump.loadDataset(ref).catch(() => null);
-      if (!index || !hasContent(index)) return null;
-      return {
-        id,
-        languages: datasetLanguages(index.manifest.languages ?? []),
-      };
-    }),
-  );
   return (
     await Promise.all(
-      usable
-        .filter((row): row is { id: string; languages: Lang[] } => row !== null)
-        .map(async ({ id, languages }) => ({
+      ids.map(async (id): Promise<SectionDataset | null> => {
+        const index = await dump.loadDataset({ id }).catch(() => null);
+        if (!index) {
+          if (dumpStatusSnapshot().statuses[id]?.status !== 'failed')
+            return null;
+          const good = lastGoodDatasets.get(section)?.get(id);
+          if (good) return good;
+          if (!datasetMembership(section, id)) return null;
+          return {
+            id,
+            languages: datasetLanguages([]),
+            ...(await sectionDatasetMeta(section, id)),
+            ...datasetAppearance(id),
+          };
+        }
+        if (!hasContent(index)) return null;
+        const row: SectionDataset = {
           id,
-          languages,
+          languages: datasetLanguages(index.manifest.languages ?? []),
           ...(versions.get(id)?.length
             ? { versions: versions.get(id)!.sort(compareVersions).reverse() }
             : {}),
-          ...(await datasetMeta(section, id).then((meta) =>
-            Object.values(meta).some((value) => value !== undefined)
-              ? meta
-              : datasetMeta('docs', id),
-          )),
+          ...(await sectionDatasetMeta(section, id)),
           ...datasetAppearance(id),
-        })),
-      )
-  ).sort(datasetOrder);
+        };
+        rememberDataset(section, row);
+        return row;
+      }),
+    )
+  )
+    .filter((row): row is SectionDataset => row !== null)
+    .sort(datasetOrder);
 }
 
 export function sectionDatasets(

package/src/lib/urls.ts

@@ -15,3 +15,12 @@ export function getDatasetImageUrl(section: string, dataset: string) {
   };
 }
 
+export function createGitFileUrl(git: {
+  user: string;
+  repo: string;
+  branch: string;
+}) {
+  return (filePath: string) =>
+    `https://github.com/${git.user}/${git.repo}/blob/${git.branch}/${filePath}`;
+}
+