@notionx/create-notionx-app 1.0.0 → 2.0.1

package/dist/templates/lib/site/settings.ts.tmpl

@@ -1,10 +1,12 @@
 // Notion-backed site settings loader.
 //
-// Reads the singleton row from the `site-settings` Notion data
-// source (declared in `lib/content/models.ts`) and merges it with
-// the static fallback in `./config.ts`. The result has the same
-// shape as `siteConfig` so call sites don't need to know which
-// source actually answered.
+// Reads multiple rows from the `site-settings` Notion data source
+// (declared in `lib/content/models.ts`) and aggregates them into a
+// single `SiteConfig`. Each row is one setting item keyed by the
+// `Key` field; the runtime loader builds a `Record<string, string>`
+// and maps known keys to the `SiteConfig` structure. The result is
+// merged with the static fallback in `./config.ts` so any missing
+// row falls back gracefully.
 //
 // Caching strategy:
 //   - One KV read per request. On miss, fetch from Notion, cache
@@ -20,7 +22,7 @@
 //      the KV entry. The endpoint re-uses
 //      `@notionx/core/auth/routes/viewer` to authorize the caller.
 //
-// If the Notion data source is empty or the row can't be read,
+// If the Notion data source is empty or the rows can't be read,
 // `fallbackSiteConfig` from `./config.ts` is returned unchanged.
 // The fallback is also what `getStaticSiteSettings()` returns
 // synchronously — useful for places that can't `await` (e.g.
@@ -31,6 +33,7 @@ import {
   hasNotionModelConfig,
   listGenericNotionContent,
 } from "@notionx/core/notion";
+import { listGenericNotionContentForLocale } from "@notionx/core";
 import { siteSettingsSource } from "../content/models";
 import { fallbackSiteConfig, type SiteConfig } from "./config";
 
@@ -47,70 +50,22 @@ function readKv(): KVNamespace | null {
   return getRequestEnv()?.CONTENT_CACHE ?? null;
 }
 
+// Mirrors `SiteConfig["navigation"]["main"]`: the JSON stored in
+// Notion's "Nav" field should include `modelId` for each item.
 type RawNavItem = {
   label: string;
   href: string;
+  modelId: string;
   children?: RawNavItem[];
 };
 
-type RawSiteSettings = {
-  name?: string;
-  tagline?: string;
-  description?: string;
-  defaultLocale?: string;
-  socialImageUrl?: string;
-  ogImageUrl?: string;
-  seo?: { title?: string; description?: string };
-  navigation?: {
-    main?: RawNavItem[];
-    cta?: { label: string; href: string } | null;
-  };
-  theme?: { primary?: string; accent?: string; font?: string };
-  footer?: {
-    columns?: Array<{ label: string; items: Array<{ label: string; href: string }> }>;
-    social?: Array<{ label: string; href: string }>;
-    tagline?: string;
-    copyright?: string;
-  };
-};
-
-function readRichText(
-  properties: Record<string, unknown>,
-  field: string
-): string {
-  const prop = properties[field] as
-    | { rich_text?: Array<{ plain_text?: string }> }
-    | undefined;
-  if (!prop?.rich_text?.length) return "";
-  return prop.rich_text.map((t) => t.plain_text ?? "").join("").trim();
-}
-
-function readUrl(
-  properties: Record<string, unknown>,
-  field: string
-): string | null {
-  const prop = properties[field] as
-    | { url?: string | null }
-    | undefined;
-  return prop?.url ?? null;
-}
-
-function readSelect(
-  properties: Record<string, unknown>,
-  field: string
-): string {
-  const prop = properties[field] as
-    | { select?: { name?: string } | null }
-    | undefined;
-  return prop?.select?.name?.trim() ?? "";
+function readString(value: unknown): string {
+  if (typeof value === "string") return value;
+  if (Array.isArray(value)) return value.join("");
+  return "";
 }
 
-function readJson<T>(
-  properties: Record<string, unknown>,
-  field: string,
-  fallback: T
-): T {
-  const raw = readRichText(properties, field);
+function parseJson<T>(raw: string, fallback: T): T {
   if (!raw) return fallback;
   try {
     return JSON.parse(raw) as T;
@@ -132,8 +87,8 @@ export function getStaticSiteSettings(): SiteConfig {
  * Resolve the current site settings.
  *
  * Order of precedence for each field:
- *   1. Notion row (if `site-settings` data source is reachable and
- *      contains a row)
+ *   1. Notion rows (if `site-settings` data source is reachable and
+ *      contains published rows)
  *   2. `fallbackSiteConfig` (so a Notion outage never breaks the
  *      home page or SEO metadata)
  *
@@ -141,14 +96,14 @@ export function getStaticSiteSettings(): SiteConfig {
  * `site-settings:v1` for 5 minutes per process. Bump the cache key
  * suffix to invalidate globally after a breaking schema change.
  */
-export async function getSiteSettings(): Promise<SiteConfig> {
+export async function getSiteSettings(locale?: string): Promise<SiteConfig> {
   const kv = readKv();
   if (kv) {
     const cached = await kv.get<SiteConfig>(CACHE_KEY, "json");
     if (cached) return cached;
   }
 
-  const merged = await loadFromNotion();
+  const merged = await loadFromNotion(locale);
 
   if (kv) {
     // Best-effort write. KV failure shouldn't break the page.
@@ -160,7 +115,7 @@ export async function getSiteSettings(): Promise<SiteConfig> {
   return merged;
 }
 
-async function loadFromNotion(): Promise<SiteConfig> {
+async function loadFromNotion(locale?: string): Promise<SiteConfig> {
   // `hasNotionModelConfig` reads the env from the active request
   // context. If Notion isn't configured we return the fallback
   // untouched — never throw, so the home page can't 500 because of
@@ -179,7 +134,9 @@ async function loadFromNotion(): Promise<SiteConfig> {
     ReturnType<typeof listGenericNotionContent<typeof siteSettingsSource.source.fields>>
   >;
   try {
-    items = await listGenericNotionContent(siteSettingsSource);
+    items = locale
+      ? await listGenericNotionContentForLocale(siteSettingsSource, locale)
+      : await listGenericNotionContent(siteSettingsSource);
   } catch {
     return fallbackSiteConfig;
   }
@@ -187,124 +144,87 @@ async function loadFromNotion(): Promise<SiteConfig> {
     return fallbackSiteConfig;
   }
 
-  // The first published row wins. If the operator has multiple
-  // rows they can pick the active one by checking `Published` in
-  // Notion; we deliberately don't try to be clever about which row
-  // is "active" beyond that to keep the model predictable.
-  const row = items[0];
-  if (!row) return fallbackSiteConfig;
-
-  const raw: RawSiteSettings = {
-    name: row.title || undefined,
-    tagline: row.properties.tagline
-      ? Array.isArray(row.properties.tagline)
-        ? row.properties.tagline[0]
-        : (row.properties.tagline as string)
-      : undefined,
-    description: row.description || undefined,
-    socialImageUrl: row.coverImage || undefined,
-  };
-
-  // The Notion mapper doesn't know about every field we expose
-  // (e.g. `defaultLocale` lives in a `Select` column). Read it
-  // straight off the raw Notion page object that
-  // `listGenericNotionContent` returns — its `properties` map
-  // includes everything Notion sent us, not just the mapped ones.
-  const extra = (row as unknown as { properties?: Record<string, unknown> })
-    .properties;
-  if (extra && typeof extra === "object") {
-    const defaultLocale = readSelect(extra, "Default Locale");
-    if (defaultLocale) raw.defaultLocale = defaultLocale;
-    const tagline = readRichText(extra, "Tagline");
-    if (tagline) raw.tagline = tagline;
-    const socialImage = readUrl(extra, "Social Image");
-    if (socialImage) raw.socialImageUrl = socialImage;
-
-    // SEO
-    const metaTitle = readRichText(extra, "Meta Title");
-    const metaDescription = readRichText(extra, "Meta Description");
-    if (metaTitle || metaDescription) {
-      raw.seo = {
-        title: metaTitle || raw.name,
-        description: metaDescription || raw.description,
-      };
+  // Aggregate rows into a key-value map keyed by the `Key` field.
+  // Each row carries one setting item; the runtime loader merges
+  // them into a single `SiteConfig`.
+  const settingsMap: Record<string, string> = {};
+  for (const item of items) {
+    const key = readString(item.properties.key);
+    const value = readString(item.properties.value);
+    if (key) {
+      settingsMap[key] = value;
     }
-    const ogImage = readUrl(extra, "OG Image");
-    if (ogImage) raw.ogImageUrl = ogImage;
+  }
 
-    // Navigation
-    const nav = readJson<RawNavItem[]>(extra, "Nav", []);
-    const cta = readJson<{ label: string; href: string } | null>(
-      extra,
-      "Nav CTA",
-      null
-    );
-    raw.navigation = { main: nav, cta };
+  // Map known keys to the SiteConfig structure. Missing keys fall
+  // back to `fallbackSiteConfig`.
+  const name = settingsMap.name ?? fallbackSiteConfig.name;
+  const tagline = settingsMap.tagline ?? fallbackSiteConfig.tagline;
+  const description = settingsMap.description ?? fallbackSiteConfig.description;
+  const socialImageUrl = settingsMap.socialImage ?? fallbackSiteConfig.socialImageUrl;
+  const ogImageUrl = settingsMap.ogImage ?? socialImageUrl ?? fallbackSiteConfig.ogImageUrl;
+
+  const metaTitle = settingsMap.metaTitle ?? "";
+  const metaDescription = settingsMap.metaDescription ?? "";
+  const seo = {
+    title: metaTitle.trim() || fallbackSiteConfig.seo.title,
+    description: metaDescription.trim() || fallbackSiteConfig.seo.description,
+  };
 
-    // Theme
-    const primary = readSelect(extra, "Primary Color");
-    const accent = readSelect(extra, "Accent Color");
-    const font = readSelect(extra, "Font Family");
-    if (primary || accent || font) {
-      raw.theme = { primary, accent, font };
-    }
+  const navItems = parseJson<RawNavItem[]>(
+    settingsMap.items ?? "[]",
+    fallbackSiteConfig.navigation.main as RawNavItem[]
+  );
+  const navCta = parseJson<{ label: string; href: string } | null>(
+    settingsMap.cta ?? "null",
+    fallbackSiteConfig.navigation.cta
+  );
+  const navigation = {
+    ...fallbackSiteConfig.navigation,
+    main: navItems.length ? navItems : fallbackSiteConfig.navigation.main,
+    cta: navCta ?? fallbackSiteConfig.navigation.cta,
+  };
 
-    // Footer
-    type FooterColumn = {
-      label: string;
-      items: Array<{ label: string; href: string }>;
-    };
-    const columns = readJson<FooterColumn[]>(extra, "Footer Columns", []);
-    const social = readJson<Array<{ label: string; href: string }>>(
-      extra,
-      "Footer Social Links",
-      []
-    );
-    const taglineFooter = readRichText(extra, "Footer Tagline");
-    const copyright = readRichText(extra, "Footer Copyright");
-    raw.footer = { columns, social, tagline: taglineFooter, copyright };
-  }
+  const primary = (settingsMap.primaryColor as SiteConfig["theme"]["primary"]) ||
+    fallbackSiteConfig.theme.primary;
+  const accent = (settingsMap.accentColor as SiteConfig["theme"]["accent"]) ||
+    fallbackSiteConfig.theme.accent;
+  const font = (settingsMap.fontFamily as SiteConfig["theme"]["font"]) ||
+    fallbackSiteConfig.theme.font;
+  const theme = { primary, accent, font };
+
+  type FooterColumn = {
+    label: string;
+    items: Array<{ label: string; href: string }>;
+  };
+  const footerColumns = parseJson<FooterColumn[]>(
+    settingsMap.columns ?? "[]",
+    fallbackSiteConfig.footer.columns as FooterColumn[]
+  );
+  const footerSocial = parseJson<Array<{ label: string; href: string }>>(
+    settingsMap.socialLinks ?? "[]",
+    fallbackSiteConfig.footer.social
+  );
+  const footerTagline = settingsMap.footerTagline ?? fallbackSiteConfig.footer.tagline;
+  const footerCopyright = settingsMap.copyright ?? fallbackSiteConfig.footer.copyright;
+  const footer = {
+    columns: footerColumns,
+    social: footerSocial,
+    tagline: footerTagline,
+    copyright: footerCopyright,
+  };
 
   return {
     ...fallbackSiteConfig,
-    name: raw.name?.trim() || fallbackSiteConfig.name,
-    tagline: raw.tagline?.trim() || raw.name?.trim() || fallbackSiteConfig.tagline,
-    description:
-      raw.description?.trim() || fallbackSiteConfig.description,
-    socialImageUrl: raw.socialImageUrl ?? fallbackSiteConfig.socialImageUrl,
-    ogImageUrl: raw.ogImageUrl ?? raw.socialImageUrl ?? fallbackSiteConfig.ogImageUrl,
-    defaultLocale:
-      raw.defaultLocale?.trim() || fallbackSiteConfig.defaultLocale,
-    seo: {
-      title: raw.seo?.title?.trim() || fallbackSiteConfig.seo.title,
-      description:
-        raw.seo?.description?.trim() || fallbackSiteConfig.seo.description,
-    },
-    navigation: {
-      ...fallbackSiteConfig.navigation,
-      main: raw.navigation?.main?.length
-        ? raw.navigation.main
-        : fallbackSiteConfig.navigation.main,
-      cta: raw.navigation?.cta ?? fallbackSiteConfig.navigation.cta,
-    },
-    theme: {
-      primary:
-        (raw.theme?.primary as SiteConfig["theme"]["primary"]) ??
-        fallbackSiteConfig.theme.primary,
-      accent:
-        (raw.theme?.accent as SiteConfig["theme"]["accent"]) ??
-        fallbackSiteConfig.theme.accent,
-      font:
-        (raw.theme?.font as SiteConfig["theme"]["font"]) ??
-        fallbackSiteConfig.theme.font,
-    },
-    footer: {
-      columns: raw.footer?.columns ?? fallbackSiteConfig.footer.columns,
-      social: raw.footer?.social ?? fallbackSiteConfig.footer.social,
-      tagline: raw.footer?.tagline ?? fallbackSiteConfig.footer.tagline,
-      copyright:
-        raw.footer?.copyright ?? fallbackSiteConfig.footer.copyright,
-    },
+    name: name.trim() || fallbackSiteConfig.name,
+    tagline: tagline.trim() || name.trim() || fallbackSiteConfig.tagline,
+    description: description.trim() || fallbackSiteConfig.description,
+    socialImageUrl: socialImageUrl ?? fallbackSiteConfig.socialImageUrl,
+    ogImageUrl: ogImageUrl ?? fallbackSiteConfig.ogImageUrl,
+    seo,
+    navigation,
+    theme,
+    footer,
   };
 }
 

package/dist/templates/lib/site/translations.ts.tmpl

@@ -1,22 +1,24 @@
-// Locale-aware site settings merge. The `site-settings` Notion row
-// holds the global config; the `site-settings-translations` row
-// holds locale-specific copy. Missing locale copy falls back to the
-// default-locale translation.
+// Locale-aware site settings merge. The `site-settings` Notion rows
+// hold the global config (key-value pairs grouped by section); the
+// `site-settings-translations` rows hold locale-specific `Value`
+// overrides. `Section`, `Key`, and `Type` are the same across
+// locales — only `Value` is translated. Missing locale copy falls
+// back to the default-locale translation.
 
+import {
+  mapNotionPageToLocalizedContentTranslation,
+  listGenericNotionContentForLocale,
+} from "@notionx/core";
 import { i18n } from "@/lib/i18n";
 import { siteSettingsContract } from "@/lib/locale-contract";
+import { siteSettingsTranslationsSource } from "@/lib/content/models";
+import type { NotionPageLike } from "@notionx/core";
 
 export type SiteSettingsTranslation = {
   pageId: string;
   sourcePageId: string;
   locale: string;
-  tagline: string;
-  description: string;
-  seoTitle: string;
-  seoDescription: string;
-  navLabels: Record<string, string>;
-  footerLabels: Record<string, string>;
-  globalFallbackCopy: string;
+  value: string;
   published: boolean;
 };
 
@@ -28,3 +30,24 @@ export function pickSiteSettingsTranslation(
   if (direct) return direct;
   return rows.find((row) => row.locale === i18n.defaultLocale) ?? null;
 }
+
+export async function listSiteSettingsTranslations(
+  locale: string
+): Promise<SiteSettingsTranslation[]> {
+  if (!siteSettingsTranslationsSource) return [];
+  const pages = await listGenericNotionContentForLocale(siteSettingsTranslationsSource, locale);
+  return pages
+    .map((p) => mapNotionPageToLocalizedContentTranslation<SiteSettingsTranslation>(p as unknown as NotionPageLike, {
+      fields: {
+        title: "Title",
+        source: "Source",
+        locale: "Locale",
+        slug: "Title",
+        published: "Published",
+      },
+      extraFields: {
+        value: "Value",
+      },
+    }))
+    .filter((row): row is SiteSettingsTranslation => row !== null);
+}

package/dist/templates/middleware.ts.tmpl

@@ -0,0 +1,56 @@
+// Locale prefix middleware. Parses the `/{locale}` path prefix for
+// non-default locales, sets `x-notionx-locale` on the request so
+// server components and data loaders can read it, and rewrites the
+// URL to strip the prefix so the App Router matches the same route
+// handlers for every locale.
+//
+// Default locale (`{{defaultLocale}}`) stays unprefixed — `/blog`
+// serves the default locale, `/{{defaultLocale}}/blog` redirects to
+// `/blog` to avoid duplicate-content URLs.
+
+import { NextResponse, type NextRequest } from "next/server";
+
+const SUPPORTED_LOCALES = {{supportedLocalesJson}} as readonly string[];
+const DEFAULT_LOCALE = "{{defaultLocale}}";
+
+export function middleware(request: NextRequest) {
+  const { pathname } = request.nextUrl;
+  const segments = pathname.split("/").filter(Boolean);
+  const firstSegment = segments[0];
+
+  // No locale prefix — default locale.
+  if (!firstSegment || !SUPPORTED_LOCALES.includes(firstSegment)) {
+    const requestHeaders = new Headers(request.headers);
+    requestHeaders.set("x-notionx-locale", DEFAULT_LOCALE);
+    return NextResponse.next({
+      request: { headers: requestHeaders },
+    });
+  }
+
+  // Default locale with explicit prefix — redirect to unprefixed URL
+  // to keep canonical URLs clean.
+  if (firstSegment === DEFAULT_LOCALE) {
+    const url = request.nextUrl.clone();
+    url.pathname = pathname.replace(`/${DEFAULT_LOCALE}`, "") || "/";
+    return NextResponse.redirect(url, 308);
+  }
+
+  // Non-default locale — strip the prefix and pass the locale via header.
+  const locale = firstSegment;
+  const stripped = pathname.replace(`/${locale}`, "") || "/";
+  const url = request.nextUrl.clone();
+  url.pathname = stripped;
+  const requestHeaders = new Headers(request.headers);
+  requestHeaders.set("x-notionx-locale", locale);
+  return NextResponse.rewrite(url, {
+    request: { headers: requestHeaders },
+  });
+}
+
+export const config = {
+  // Match all paths except static assets, API routes, Next.js
+  // internals, and admin (admin is single-locale by design).
+  matcher: [
+    "/((?!api|_next/static|_next/image|favicon.ico|admin|.*\\.).*)",
+  ],
+};

package/dist/templates/worker/index.ts.tmpl

@@ -43,10 +43,19 @@ export default {
     // `getRequestEnv()`. See `lib/site/request-env.ts` for the
     // rationale — we cannot use `cloudflare:workers.getRequestContext`
     // because that module does not export it.
-    return runWithRequestEnv(env, async () => {
-      const notionxResponse = await notionx.fetch(request, env, ctx);
-      if (notionxResponse) return notionxResponse;
-      return handler.fetch(request, env, ctx);
-    });
+    //
+    // The locale prefix middleware (Next.js middleware) sets the
+    // `x-notionx-locale` header on every request. Thread it into
+    // the request env so data loaders can read it via
+    // `getRequestLocale()` without reaching into headers themselves.
+    const locale = request.headers.get("x-notionx-locale") ?? undefined;
+    return runWithRequestEnv(
+      { ...env, ...(locale ? { NOTIONX_LOCALE: locale } : {}) },
+      async () => {
+        const notionxResponse = await notionx.fetch(request, env, ctx);
+        if (notionxResponse) return notionxResponse;
+        return handler.fetch(request, env, ctx);
+      }
+    );
   },
 };

package/dist/templates/wrangler.jsonc.tmpl

@@ -39,6 +39,10 @@
   "vars": {
     "SITE_URL": "https://{{projectNameLower}}.example.com",
     "NOTION_BLOCKS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_BLOCKS_DATA_SOURCE_ID",
-    "NOTION_SITE_SETTINGS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_SITE_SETTINGS_DATA_SOURCE_ID"
+    "NOTION_SITE_SETTINGS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_SITE_SETTINGS_DATA_SOURCE_ID",
+    "NOTION_BLOG_TRANSLATIONS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_BLOG_TRANSLATIONS_DATA_SOURCE_ID",
+    "NOTION_PAGES_TRANSLATIONS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_PAGES_TRANSLATIONS_DATA_SOURCE_ID",
+    "NOTION_BLOCKS_TRANSLATIONS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_BLOCKS_TRANSLATIONS_DATA_SOURCE_ID",
+    "NOTION_SITE_SETTINGS_TRANSLATIONS_DATA_SOURCE_ID": "REPLACE_WITH_NOTION_SITE_SETTINGS_TRANSLATIONS_DATA_SOURCE_ID"
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@notionx/create-notionx-app",
-  "version": "1.0.0",
+  "version": "2.0.1",
   "description": "Scaffold a new vinext (Next.js on Cloudflare Workers + D1 + R2) project backed by @notionx/core, with one-step provisioning of D1 / KV / R2 / Turnstile / Notion / Resend / Google OAuth.",
   "type": "module",
   "bin": {