@lukoweb/apitogo 0.1.50 → 0.1.51

package/src/config/local-manifest.ts

@@ -1,17 +1,26 @@
 import { access, readFile } from "node:fs/promises";
 import path from "node:path";
 import { z } from "zod";
+import {
+  APITOGO_CONFIG_FILENAME,
+  extractManifest,
+  loadApitogoConfig,
+} from "./apitogo-config-loader.js";
 
-/** @deprecated Use {@link APITOGO_MANIFEST_ENV_FILES.development} — kept for external consumers. */
+/** @deprecated Use {@link APITOGO_CONFIG_FILENAME}. */
 export const DEV_PORTAL_MANIFEST_FILENAME = "apitogo.local.json";
 
+/** @deprecated Use {@link APITOGO_CONFIG_FILENAME}. */
 export const APITOGO_MANIFEST_BASE_FILENAME = "apitogo.json";
 
+/** @deprecated Per-environment manifest overrides were replaced by apitogo.config.json + .env. */
 export const APITOGO_MANIFEST_ENV_FILES = {
   development: "apitogo.local.json",
   production: "apitogo.prod.json",
 } as const;
 
+export { APITOGO_CONFIG_FILENAME };
+
 export type ApitogoManifestEnv = keyof typeof APITOGO_MANIFEST_ENV_FILES;
 
 const BillingPeriodSchema = z.enum(["month", "year", "monthly", "annual"]);
@@ -40,6 +49,11 @@ export const DevPortalLocalManifestSchema = z.object({
       enabled: z.boolean().optional(),
     })
     .optional(),
+  authentication: z
+    .object({
+      enabled: z.boolean().optional(),
+    })
+    .optional(),
   plans: z.array(ManifestPlanInputSchema).optional(),
   backend: z
     .object({
@@ -83,6 +97,7 @@ export type DevPortalPreviewPlan = {
 
 export type DevPortalPreviewPlanCatalog = {
   pricingEnabled: boolean;
+  authenticationEnabled: boolean;
   plans: DevPortalPreviewPlan[];
 };
 
@@ -92,6 +107,12 @@ export function isPricingEnabled(
   return manifest?.pricing?.enabled === true;
 }
 
+export function isAuthenticationEnabled(
+  manifest: DevPortalLocalManifest | null | undefined,
+): boolean {
+  return manifest?.authentication?.enabled === true;
+}
+
 export function manifestToPreviewCatalog(
   manifest: DevPortalLocalManifest | null | undefined,
 ): DevPortalPreviewPlanCatalog {
@@ -99,6 +120,7 @@ export function manifestToPreviewCatalog(
   const catalog = plansToPreviewCatalog(plans);
   return {
     pricingEnabled: isPricingEnabled(manifest),
+    authenticationEnabled: isAuthenticationEnabled(manifest),
     plans: catalog.plans,
   };
 }
@@ -170,6 +192,12 @@ export function mergeManifest(
   if (override.pricing) {
     merged.pricing = { ...base.pricing, ...override.pricing };
   }
+  if (override.authentication) {
+    merged.authentication = {
+      ...base.authentication,
+      ...override.authentication,
+    };
+  }
   if (override.backend) {
     merged.backend = { ...base.backend, ...override.backend };
   }
@@ -192,16 +220,15 @@ export function manifestFilePath(rootDir: string, filename?: string): string {
 
 export function manifestPathsForEnv(
   rootDir: string,
-  env: ApitogoManifestEnv,
+  _env: ApitogoManifestEnv,
 ): { basePath: string; overridePath: string; watchPaths: string[] } {
   const resolvedRoot = path.resolve(rootDir);
-  const basePath = path.join(resolvedRoot, APITOGO_MANIFEST_BASE_FILENAME);
-  const overridePath = path.join(resolvedRoot, APITOGO_MANIFEST_ENV_FILES[env]);
+  const configPath = path.join(resolvedRoot, APITOGO_CONFIG_FILENAME);
 
   return {
-    basePath,
-    overridePath,
-    watchPaths: [basePath, overridePath],
+    basePath: configPath,
+    overridePath: configPath,
+    watchPaths: [configPath],
   };
 }
 
@@ -243,11 +270,36 @@ export async function readManifestFile(
   }
 }
 
+function parseManifestRecord(
+  manifest: ReturnType<typeof extractManifest>,
+): DevPortalLocalManifest | null {
+  if (!manifest) {
+    return null;
+  }
+
+  const result = DevPortalLocalManifestSchema.safeParse(manifest);
+  return result.success ? result.data : null;
+}
+
 export async function readEffectiveManifest(
   rootDir: string,
   env: ApitogoManifestEnv,
 ): Promise<DevPortalLocalManifest | null> {
-  const { basePath, overridePath } = manifestPathsForEnv(rootDir, env);
+  try {
+    const config = loadApitogoConfig(rootDir);
+    return parseManifestRecord(extractManifest(config));
+  } catch {
+    return readLegacyEffectiveManifest(rootDir, env);
+  }
+}
+
+async function readLegacyEffectiveManifest(
+  rootDir: string,
+  env: ApitogoManifestEnv,
+): Promise<DevPortalLocalManifest | null> {
+  const resolvedRoot = path.resolve(rootDir);
+  const basePath = path.join(resolvedRoot, APITOGO_MANIFEST_BASE_FILENAME);
+  const overridePath = path.join(resolvedRoot, APITOGO_MANIFEST_ENV_FILES[env]);
   const hasBase = await fileExists(basePath);
   const hasOverride = await fileExists(overridePath);
 

package/src/index.ts

@@ -71,4 +71,11 @@ export {
   type ProblemJson,
   throwIfProblemJson,
 } from "./lib/util/problemJson.js";
-export type { MdxComponentsType } from "./lib/util/MdxComponents.js";
+export { buildApitogoConfig } from "./config/build-apitogo-config.js";
+export {
+  APITOGO_CONFIG_FILENAME,
+  applyEnvOverrides,
+  extractManifest,
+  extractSiteConfig,
+  loadApitogoConfig,
+} from "./config/apitogo-config-loader.js";

package/src/lib/authentication/auth-header-nav.ts

@@ -0,0 +1,56 @@
+import type { HeaderNavigation } from "../../config/validators/HeaderNavigationSchema.js";
+import type { ZudokuConfig } from "../../config/validators/ZudokuConfig.js";
+
+export const LOGIN_NAV_PATH = "/signin";
+
+export const LOGIN_HEADER_NAV_ITEM = {
+  label: "Login",
+  to: LOGIN_NAV_PATH,
+  display: "anon" as const,
+};
+
+export function withoutLoginNavigation(
+  navigation: HeaderNavigation,
+): HeaderNavigation {
+  return navigation.filter(
+    (item) => !("to" in item && item.to === LOGIN_NAV_PATH),
+  );
+}
+
+export function applyAuthenticationHeaderNav<T extends ZudokuConfig>(
+  config: T,
+): T {
+  if (!config.authentication) {
+    return config;
+  }
+
+  const authNavEnabled = config.__meta?.authenticationEnabled === true;
+  const navigation = config.header?.navigation ?? [];
+
+  if (!authNavEnabled) {
+    const filtered = withoutLoginNavigation(navigation);
+    if (filtered.length === navigation.length) {
+      return config;
+    }
+
+    return {
+      ...config,
+      header: {
+        ...config.header,
+        navigation: filtered,
+      },
+    };
+  }
+
+  if (navigation.some((item) => "to" in item && item.to === LOGIN_NAV_PATH)) {
+    return config;
+  }
+
+  return {
+    ...config,
+    header: {
+      ...config.header,
+      navigation: [...navigation, LOGIN_HEADER_NAV_ITEM],
+    },
+  };
+}

package/src/lib/components/Header.tsx

@@ -1,5 +1,4 @@
 import { Button } from "@lukoweb/apitogo/ui/Button.js";
-import { Skeleton } from "@lukoweb/apitogo/ui/Skeleton.js";
 import { LogOutIcon } from "lucide-react";
 import { lazy, memo, Suspense } from "react";
 import { Link } from "react-router";
@@ -20,7 +19,6 @@ import {
 import { cn } from "../util/cn.js";
 import { joinUrl } from "../util/joinUrl.js";
 import { Banner } from "./Banner.js";
-import { ClientOnly } from "./ClientOnly.js";
 import { useZudoku } from "./context/ZudokuContext.js";
 import { MobileTopNavigation } from "./MobileTopNavigation.js";
 import { PageProgress } from "./PageProgress.js";
@@ -73,68 +71,58 @@ const ProfileMenu = () => {
   const context = useZudoku();
   const profileItems = context.getProfileMenuItems();
   const auth = useAuth();
-  const { isAuthEnabled, isAuthenticated, isPending, profile } = auth;
+  const { isAuthEnabled, isAuthenticated, profile } = auth;
 
-  if (!isAuthEnabled) return null;
+  if (!isAuthEnabled || !isAuthenticated) return null;
 
   return (
-    <ClientOnly fallback={<Skeleton className="rounded-sm h-5 w-24 mr-4" />}>
-      {isPending ? (
-        <Skeleton className="rounded-sm h-9 w-24" />
-      ) : !isAuthenticated ? (
-        <Button size="lg" variant="ghost" onClick={() => auth.login()}>
-          Login
+    <DropdownMenu modal={false}>
+      <DropdownMenuTrigger asChild>
+        <Button size="lg" variant="ghost">
+          {profile?.name ?? "My Account"}
         </Button>
-      ) : (
-        <DropdownMenu modal={false}>
-          <DropdownMenuTrigger asChild>
-            <Button size="lg" variant="ghost">
-              {profile?.name ?? "My Account"}
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent className="w-56">
-            <DropdownMenuLabel>
-              {profile?.name ?? "My Account"}
-              {profile?.email && profile.email !== profile?.name && (
-                <div className="font-normal text-muted-foreground">
-                  {profile.email}
-                </div>
-              )}
-            </DropdownMenuLabel>
-            {profileItems.filter((i) => i.category === "top").length > 0 && (
-              <DropdownMenuSeparator />
-            )}
-            {profileItems
-              .filter((i) => i.category === "top")
-              .map((i) => (
-                <RecursiveMenu key={i.label} item={i} />
-              ))}
-            {profileItems.filter((i) => !i.category || i.category === "middle")
-              .length > 0 && <DropdownMenuSeparator />}
-            {profileItems
-              .filter((i) => !i.category || i.category === "middle")
-              .map((i) => (
-                <RecursiveMenu key={i.label} item={i} />
-              ))}
-            {profileItems.filter((i) => i.category === "bottom").length > 0 && (
-              <DropdownMenuSeparator />
-            )}
-            {profileItems
-              .filter((i) => i.category === "bottom")
-              .map((i) => (
-                <RecursiveMenu key={i.label} item={i} />
-              ))}
-            <DropdownMenuSeparator />
-            <Link to="/signout">
-              <DropdownMenuItem className="flex gap-2">
-                <LogOutIcon size={16} strokeWidth={1} absoluteStrokeWidth />
-                Logout
-              </DropdownMenuItem>
-            </Link>
-          </DropdownMenuContent>
-        </DropdownMenu>
-      )}
-    </ClientOnly>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent className="w-56">
+        <DropdownMenuLabel>
+          {profile?.name ?? "My Account"}
+          {profile?.email && profile.email !== profile?.name && (
+            <div className="font-normal text-muted-foreground">
+              {profile.email}
+            </div>
+          )}
+        </DropdownMenuLabel>
+        {profileItems.filter((i) => i.category === "top").length > 0 && (
+          <DropdownMenuSeparator />
+        )}
+        {profileItems
+          .filter((i) => i.category === "top")
+          .map((i) => (
+            <RecursiveMenu key={i.label} item={i} />
+          ))}
+        {profileItems.filter((i) => !i.category || i.category === "middle")
+          .length > 0 && <DropdownMenuSeparator />}
+        {profileItems
+          .filter((i) => !i.category || i.category === "middle")
+          .map((i) => (
+            <RecursiveMenu key={i.label} item={i} />
+          ))}
+        {profileItems.filter((i) => i.category === "bottom").length > 0 && (
+          <DropdownMenuSeparator />
+        )}
+        {profileItems
+          .filter((i) => i.category === "bottom")
+          .map((i) => (
+            <RecursiveMenu key={i.label} item={i} />
+          ))}
+        <DropdownMenuSeparator />
+        <Link to="/signout">
+          <DropdownMenuItem className="flex gap-2">
+            <LogOutIcon size={16} strokeWidth={1} absoluteStrokeWidth />
+            Logout
+          </DropdownMenuItem>
+        </Link>
+      </DropdownMenuContent>
+    </DropdownMenu>
   );
 };
 export const Header = memo(function HeaderInner() {

package/src/lib/components/MobileTopNavigation.tsx

@@ -1,6 +1,5 @@
 import { Button } from "@lukoweb/apitogo/ui/Button.js";
 import { Separator } from "@lukoweb/apitogo/ui/Separator.js";
-import { Skeleton } from "@lukoweb/apitogo/ui/Skeleton.js";
 import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
 import { deepEqual } from "fast-equals";
 import {
@@ -28,7 +27,6 @@ import {
   DrawerTitle,
   DrawerTrigger,
 } from "../ui/Drawer.js";
-import { ClientOnly } from "./ClientOnly.js";
 import { useCurrentNavigation, useZudoku } from "./context/ZudokuContext.js";
 import { PoweredByZudoku } from "./navigation/PoweredByZudoku.js";
 import { getFirstMatchingPath, shouldShowItem } from "./navigation/utils.js";
@@ -130,7 +128,7 @@ export const MobileTopNavigation = () => {
     getProfileMenuItems,
   } = context;
   const headerNavigation = header?.navigation ?? [];
-  const { isAuthenticated, profile, isAuthEnabled, isPending } = authState;
+  const { isAuthenticated, profile, isAuthEnabled } = authState;
   const [drawerOpen, setDrawerOpen] = useState(false);
 
   const accountItems = getProfileMenuItems();
@@ -195,9 +193,7 @@ export const MobileTopNavigation = () => {
                 );
               })}
               {isAuthEnabled && isAuthenticated && (
-                <ClientOnly
-                  fallback={<Skeleton className="rounded-sm h-5 w-24" />}
-                >
+                <>
                   <Separator className="my-2" />
                   <li className="py-2">
                     <div className="text-base font-medium">
@@ -226,45 +222,38 @@ export const MobileTopNavigation = () => {
                       </Link>
                     </li>
                   ))}
-                </ClientOnly>
+                </>
               )}
             </ul>
           </div>
           <div className="border-t shadow-[0_-4px_6px_-1px_rgba(0,0,0,0.05)] px-4 pt-3 flex flex-col gap-2">
             <div className="flex items-center justify-between">
-              {isAuthEnabled && (
-                <ClientOnly
-                  fallback={<Skeleton className="rounded-sm h-8 w-16" />}
-                >
-                  {isPending ? (
-                    <Skeleton className="rounded-sm h-8 w-16" />
-                  ) : isAuthenticated ? (
-                    <Button asChild variant="outline">
-                      <Link
-                        to="/signout"
-                        onClick={() => setDrawerOpen(false)}
-                        className="flex items-center gap-2"
-                      >
-                        <LogOutIcon
-                          size={16}
-                          strokeWidth={1}
-                          absoluteStrokeWidth
-                        />
-                        Logout
-                      </Link>
-                    </Button>
-                  ) : (
-                    <Button asChild variant="outline">
-                      <Link
-                        to={`/signin?redirect=${encodeURIComponent(location.pathname)}`}
-                        onClick={() => setDrawerOpen(false)}
-                      >
-                        Login
-                      </Link>
-                    </Button>
-                  )}
-                </ClientOnly>
-              )}
+              {isAuthEnabled &&
+                (isAuthenticated ? (
+                  <Button asChild variant="outline">
+                    <Link
+                      to="/signout"
+                      onClick={() => setDrawerOpen(false)}
+                      className="flex items-center gap-2"
+                    >
+                      <LogOutIcon
+                        size={16}
+                        strokeWidth={1}
+                        absoluteStrokeWidth
+                      />
+                      Logout
+                    </Link>
+                  </Button>
+                ) : (
+                  <Button asChild variant="outline">
+                    <Link
+                      to={`/signin?redirect=${encodeURIComponent(location.pathname)}`}
+                      onClick={() => setDrawerOpen(false)}
+                    >
+                      Login
+                    </Link>
+                  </Button>
+                ))}
               <ThemeSwitch />
             </div>
             {site?.showPoweredBy !== false && (