@lukoweb/apitogo 0.1.50 → 0.1.53

package/src/config/loader.ts

@@ -10,9 +10,25 @@ import {
 } from "vite";
 import { logger } from "../cli/common/logger.js";
 import { getZudokuRootDir } from "../cli/common/package-json.js";
+import { applyAuthenticationHeaderNav } from "../lib/authentication/auth-header-nav.js";
 import { runPluginTransformConfig } from "../lib/core/transform-config.js";
 import invariant from "../lib/util/invariant.js";
+import {
+  isBillingEnabled,
+  loadApitogoConfig,
+  readPlanCatalogItems,
+} from "./apitogo-config-loader.js";
 import { fileExists } from "./file-exists.js";
+import {
+  isAuthenticationEnabled,
+  manifestPathsForEnv,
+  manifestToPreviewCatalog,
+  plansToPreviewCatalog,
+  readEffectiveManifest,
+  resolveManifestEnv,
+  type DevPortalPreviewPlan,
+  type ManifestPlanInput,
+} from "./local-manifest.js";
 import { resolveModulesConfig } from "./resolve-modules.js";
 import type { ResolvedModulesConfig } from "./validators/ModulesSchema.js";
 import type { ZudokuConfig } from "./validators/ZudokuConfig.js";
@@ -25,6 +41,9 @@ export type ConfigWithMeta = ZudokuConfig & {
     configPath: string;
     mode: typeof process.env.ZUDOKU_ENV;
     dependencies: string[];
+    pricingEnabled?: boolean;
+    authenticationEnabled?: boolean;
+    previewPlans?: DevPortalPreviewPlan[];
   };
   __resolvedModules: ResolvedModulesConfig;
 };
@@ -157,8 +176,17 @@ function isWatchableConfigDependency(depPath: string): boolean {
 }
 
 function getWatchableConfigDependencies(config: ConfigWithMeta): string[] {
+  const manifestEnv = resolveManifestEnv(
+    config.__meta.mode === "production" ? "production" : "development",
+  );
+  const { watchPaths } = manifestPathsForEnv(
+    config.__meta.rootDir,
+    manifestEnv,
+  );
+
   return [
     config.__meta.configPath,
+    ...watchPaths,
     ...config.__meta.dependencies.filter(isWatchableConfigDependency),
   ];
 }
@@ -171,6 +199,10 @@ async function hasConfigChanged() {
   try {
     const hasChanged = await Promise.all(
       files.map(async (depPath) => {
+        if (!(await fileExists(depPath))) {
+          return false;
+        }
+
         const depStat = await stat(depPath);
         const cachedMtime = modifiedTimes?.get(depPath);
         return !cachedMtime || depStat.mtimeMs !== cachedMtime;
@@ -192,6 +224,10 @@ async function updateModifiedTimes() {
 
   await Promise.all(
     files.map(async (depPath) => {
+      if (!(await fileExists(depPath))) {
+        return;
+      }
+
       const depStat = await stat(depPath);
       modifiedTimes?.set(depPath, depStat.mtimeMs);
     }),
@@ -225,9 +261,33 @@ export async function loadZudokuConfig(
 
   try {
     const loadedConfig = await loadZudokuConfigWithMeta(rootDir);
-    const transformedConfig = await runPluginTransformConfig(loadedConfig);
+    const manifestEnv = resolveManifestEnv(configEnv.mode);
+    const manifest = await readEffectiveManifest(rootDir, manifestEnv);
+    const previewCatalog = manifestToPreviewCatalog(manifest);
+    const jsonConfig = loadApitogoConfig(rootDir);
+    const previewPlans = previewCatalog.plans.length
+      ? previewCatalog.plans
+      : plansToPreviewCatalog(
+          readPlanCatalogItems(jsonConfig) as ManifestPlanInput[],
+        ).plans;
+    const configWithManifestMeta: ConfigWithMeta = {
+      ...loadedConfig,
+      __meta: {
+        ...loadedConfig.__meta,
+        pricingEnabled: isBillingEnabled(jsonConfig),
+        authenticationEnabled: isAuthenticationEnabled(manifest),
+        previewPlans,
+      },
+    };
+    const transformedConfig = applyAuthenticationHeaderNav(
+      await runPluginTransformConfig(configWithManifestMeta),
+    );
     config = {
       ...transformedConfig,
+      __meta: {
+        ...transformedConfig.__meta,
+        ...configWithManifestMeta.__meta,
+      },
       __resolvedModules: resolveModulesConfig(transformedConfig),
     };
 

package/src/config/local-manifest.ts

@@ -1,17 +1,25 @@
 import { access, readFile } from "node:fs/promises";
 import path from "node:path";
 import { z } from "zod";
-
-/** @deprecated Use {@link APITOGO_MANIFEST_ENV_FILES.development} — kept for external consumers. */
-export const DEV_PORTAL_MANIFEST_FILENAME = "apitogo.local.json";
-
+import {
+  APITOGO_CONFIG_FILENAME,
+  extractManifest,
+  isBillingEnabled,
+  loadApitogoConfig,
+  readPlanCatalogItems,
+} from "./apitogo-config-loader.js";
+
+/** @deprecated Legacy manifest filenames — apitogo.config.json is the only supported source. */
 export const APITOGO_MANIFEST_BASE_FILENAME = "apitogo.json";
 
+/** @deprecated Legacy per-environment manifest overrides. */
 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"]);
@@ -19,14 +27,18 @@ const BillingPeriodSchema = z.enum(["month", "year", "monthly", "annual"]);
 export const ManifestPlanInputSchema = z.object({
   sku: z.string().min(1),
   displayName: z.string().min(1),
-  isFree: z.boolean(),
-  priceAmount: z.number().optional(),
+  priceAmount: z.number().default(0),
   priceCurrency: z.string().optional(),
   billingPeriod: BillingPeriodSchema.optional(),
   limitsJson: z.string().optional(),
   includedActionKeys: z.array(z.string()).optional(),
 });
 
+/** Free plans have zero price; paid plans have priceAmount greater than zero. */
+export function isPlanFree(plan: { priceAmount?: number }): boolean {
+  return (plan.priceAmount ?? 0) <= 0;
+}
+
 export const DevPortalLocalManifestSchema = z.object({
   siteName: z.string().optional(),
   branding: z
@@ -40,6 +52,13 @@ export const DevPortalLocalManifestSchema = z.object({
       enabled: z.boolean().optional(),
     })
     .optional(),
+  authentication: z
+    .object({
+      enabled: z.boolean().optional(),
+      type: z.string().optional(),
+      apiBaseUrl: z.string().optional(),
+    })
+    .optional(),
   plans: z.array(ManifestPlanInputSchema).optional(),
   backend: z
     .object({
@@ -62,7 +81,6 @@ export const DevPortalLocalManifestSchema = z.object({
     })
     .optional(),
   projectId: z.string().optional(),
-  projectName: z.string().optional(),
 });
 
 export type ManifestPlanInput = z.infer<typeof ManifestPlanInputSchema>;
@@ -73,7 +91,6 @@ export type DevPortalLocalManifest = z.infer<
 export type DevPortalPreviewPlan = {
   sku: string;
   displayName: string;
-  isFree: boolean;
   priceAmount: number;
   priceCurrency: string;
   billingPeriod: string;
@@ -83,6 +100,7 @@ export type DevPortalPreviewPlan = {
 
 export type DevPortalPreviewPlanCatalog = {
   pricingEnabled: boolean;
+  authenticationEnabled: boolean;
   plans: DevPortalPreviewPlan[];
 };
 
@@ -92,6 +110,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 +123,7 @@ export function manifestToPreviewCatalog(
   const catalog = plansToPreviewCatalog(plans);
   return {
     pricingEnabled: isPricingEnabled(manifest),
+    authenticationEnabled: isAuthenticationEnabled(manifest),
     plans: catalog.plans,
   };
 }
@@ -129,7 +154,6 @@ export function plansToPreviewCatalog(
     plans: plans.map((plan) => ({
       sku: plan.sku,
       displayName: plan.displayName,
-      isFree: plan.isFree,
       priceAmount: plan.priceAmount ?? 0,
       priceCurrency: plan.priceCurrency ?? "usd",
       billingPeriod: normalizeBillingPeriod(plan.billingPeriod),
@@ -170,6 +194,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 };
   }
@@ -184,24 +214,20 @@ export function mergeManifest(
 }
 
 export function manifestFilePath(rootDir: string, filename?: string): string {
-  return path.join(
-    path.resolve(rootDir),
-    filename ?? DEV_PORTAL_MANIFEST_FILENAME,
-  );
+  return path.join(path.resolve(rootDir), filename ?? APITOGO_CONFIG_FILENAME);
 }
 
 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,48 +269,42 @@ 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,
+  _env: ApitogoManifestEnv,
 ): Promise<DevPortalLocalManifest | null> {
-  const { basePath, overridePath } = manifestPathsForEnv(rootDir, env);
-  const hasBase = await fileExists(basePath);
-  const hasOverride = await fileExists(overridePath);
-
-  if (!hasBase) {
-    const legacy = await readManifestFile(
-      rootDir,
-      APITOGO_MANIFEST_ENV_FILES.development,
-    );
-    if (legacy) {
-      return legacy;
+  try {
+    const config = loadApitogoConfig(rootDir);
+    const manifest = parseManifestRecord(extractManifest(config));
+    if (!manifest) {
+      return null;
     }
 
-    if (hasOverride) {
-      return readManifestFile(rootDir, APITOGO_MANIFEST_ENV_FILES[env]);
+    if (!manifest.plans?.length) {
+      const items = readPlanCatalogItems(config);
+      if (items.length) {
+        manifest.plans = items as ManifestPlanInput[];
+      }
     }
 
+    return {
+      ...manifest,
+      pricing: { ...manifest.pricing, enabled: isBillingEnabled(config) },
+    };
+  } catch {
     return null;
   }
-
-  const base = await readManifestFile(rootDir, APITOGO_MANIFEST_BASE_FILENAME);
-  if (!base) {
-    return null;
-  }
-
-  if (!hasOverride) {
-    return base;
-  }
-
-  const override = await readManifestFile(
-    rootDir,
-    APITOGO_MANIFEST_ENV_FILES[env],
-  );
-  if (!override) {
-    return base;
-  }
-
-  return mergeManifest(base, override);
 }
 
 export async function readLocalManifest(

package/src/config/resolve-modules.ts

@@ -141,10 +141,14 @@ export const resolveModulesConfig = (
     : !!config.authentication;
 
   const apiKeysEnabled = explicit
-    ? (apiKeysModuleConfig?.enabled ?? config.apiKeys?.enabled ?? false)
-    : (config.apiKeys?.enabled ?? false);
+    ? (apiKeysModuleConfig?.enabled ?? false)
+    : false;
 
-  const plansEnabled = plansConfig?.enabled ?? false;
+  const billingEnabled =
+    (config as { __meta?: { pricingEnabled?: boolean } }).__meta
+      ?.pricingEnabled === true || plansConfig?.enabled === true;
+
+  const plansEnabled = billingEnabled;
 
   const userPanelEnabled =
     userPanelModule?.enabled ??
@@ -158,11 +162,10 @@ export const resolveModulesConfig = (
   return {
     docs: {
       enabled: docsEnabled,
-      files: docsModule?.files ?? config.docs?.files,
-      publishMarkdown:
-        docsModule?.publishMarkdown ?? config.docs?.publishMarkdown,
-      defaultOptions: docsModule?.defaultOptions ?? config.docs?.defaultOptions,
-      llms: docsModule?.llms ?? config.docs?.llms,
+      files: docsModule?.files,
+      publishMarkdown: docsModule?.publishMarkdown,
+      defaultOptions: docsModule?.defaultOptions,
+      llms: docsModule?.llms,
     },
     landing: {
       enabled: landingEnabled,
@@ -203,6 +206,7 @@ export const resolveModulesConfig = (
         enabled: plansEnabled,
         path: joinPanelPath(basePath, plansConfig?.path ?? "plans"),
         content: resolvePlansContent(plansConfig?.content),
+        items: plansConfig?.items,
       },
     },
   };
@@ -242,11 +246,10 @@ export const getEffectiveDocsConfig = (
   }
 
   return {
-    files: resolved.docs.files ?? config.docs?.files ?? [DEFAULT_DOCS_FILES],
-    publishMarkdown:
-      resolved.docs.publishMarkdown ?? config.docs?.publishMarkdown ?? false,
-    defaultOptions: resolved.docs.defaultOptions ?? config.docs?.defaultOptions,
-    llms: resolved.docs.llms ?? config.docs?.llms,
+    files: resolved.docs.files ?? [DEFAULT_DOCS_FILES],
+    publishMarkdown: resolved.docs.publishMarkdown ?? false,
+    defaultOptions: resolved.docs.defaultOptions,
+    llms: resolved.docs.llms,
   };
 };
 

package/src/config/validators/ModulesSchema.ts

@@ -154,6 +154,16 @@ export const ApiKeysModuleSchema = ModuleToggleSchema.extend({
     .describe("Route path for API key management."),
 });
 
+const PlanCatalogItemSchema = z.object({
+  sku: z.string(),
+  displayName: z.string(),
+  priceAmount: z.number().default(0),
+  priceCurrency: z.string().optional(),
+  billingPeriod: z.string().optional(),
+  limitsJson: z.string().optional(),
+  includedActionKeys: z.array(z.string()).optional(),
+});
+
 export const PlansModuleSchema = ModuleToggleSchema.extend({
   path: z
     .string()
@@ -164,6 +174,12 @@ export const PlansModuleSchema = ModuleToggleSchema.extend({
   content: PlansContentSchema.describe(
     "Default plans page content when no custom component is provided.",
   ),
+  items: z
+    .array(PlanCatalogItemSchema)
+    .optional()
+    .describe(
+      "Gateway plan catalog for /pricing preview and publish (canonical storage).",
+    ),
 });
 
 export const DashboardModuleSchema = ModuleToggleSchema.extend({
@@ -288,6 +304,7 @@ export type ResolvedPlansModule = {
   enabled: boolean;
   path: string;
   content: ResolvedPlansContent;
+  items?: z.infer<typeof PlanCatalogItemSchema>[];
 };
 
 export type ResolvedDashboardModule = {

package/src/index.ts

@@ -71,4 +71,12 @@ 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,
+  normalizeApitogoConfig,
+  resolveProjectDisplayName,
+} from "./config/apitogo-config-core.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/authentication/providers/dev-portal-utils.ts

@@ -5,6 +5,8 @@ import {
   type EndUserMeResponse,
 } from "./dev-portal-constants.js";
 
+declare const VITE_APITOGO_AUTHENTICATION_API_BASE_URL: string | undefined;
+/** @deprecated Use {@link VITE_APITOGO_AUTHENTICATION_API_BASE_URL}. */
 declare const VITE_APITOGO_DEV_PORTAL_API_URL: string | undefined;
 
 export function resolveDevPortalApiBaseUrl(
@@ -16,9 +18,12 @@ export function resolveDevPortalApiBaseUrl(
   }
 
   const fromEnv =
-    typeof VITE_APITOGO_DEV_PORTAL_API_URL === "string"
+    (typeof VITE_APITOGO_AUTHENTICATION_API_BASE_URL === "string"
+      ? VITE_APITOGO_AUTHENTICATION_API_BASE_URL.trim()
+      : "") ||
+    (typeof VITE_APITOGO_DEV_PORTAL_API_URL === "string"
       ? VITE_APITOGO_DEV_PORTAL_API_URL.trim()
-      : "";
+      : "");
 
   return fromEnv ? fromEnv.replace(/\/+$/, "") : undefined;
 }

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() {