feat: add grouped TechLog route contracts

src/contracts/route-runtime-contract.ts

@@ -1,4 +1,19 @@
-export type RouteCodecId = "none" | "NotFoundSplat";
+export type RouteCodecId =
+  | "none"
+  | "NotFoundSplat"
+  | "ReferenceResourceParams"
+  | "ReferenceResourceListQuery"
+  | "TechLogExploreKindParams"
+  | "TechLogSlugParams"
+  | "TechLogVersionParams"
+  | "TechLogDocumentIdParams"
+  | "TechLogPublicationEventIdParams"
+  | "TechLogStudioSplat"
+  | "TechLogHomeSearch"
+  | "TechLogExploreSearch"
+  | "TechLogExploreKindSearch"
+  | "TechLogSearchQuery"
+  | "TechLogCaseStateSearch";
 export type RouteRuntimeDefinition = Readonly<{
   routeId: string;
   moduleId: string;

src/contracts/routes.ts

@@ -1,6 +1,9 @@
+export type RouteLayoutGroup = "PUBLIC" | "STUDIO";
+
 export type RouteDefinition = Readonly<{
   routeId: string;
   path: string;
+  layoutGroup: RouteLayoutGroup;
   paramsSchema: string | null;
   searchSchema: string | null;
   access: "public" | "session-required";
@@ -20,6 +23,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   APP_HOME: route({
     routeId: "APP_HOME",
     path: "/",
+    layoutGroup: "PUBLIC",
     paramsSchema: null,
     searchSchema: null,
     access: "public",
@@ -33,6 +37,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   EXAMPLES_PLATFORM: route({
     routeId: "EXAMPLES_PLATFORM",
     path: "/examples/platform",
+    layoutGroup: "PUBLIC",
     paramsSchema: null,
     searchSchema: null,
     access: "public",
@@ -46,6 +51,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   EXAMPLES_UI: route({
     routeId: "EXAMPLES_UI",
     path: "/examples/ui",
+    layoutGroup: "PUBLIC",
     paramsSchema: null,
     searchSchema: null,
     access: "public",
@@ -59,6 +65,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   EXAMPLES_STATES: route({
     routeId: "EXAMPLES_STATES",
     path: "/examples/states",
+    layoutGroup: "PUBLIC",
     paramsSchema: null,
     searchSchema: null,
     access: "public",
@@ -72,6 +79,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   EXAMPLES_AUTH: route({
     routeId: "EXAMPLES_AUTH",
     path: "/examples/auth",
+    layoutGroup: "PUBLIC",
     paramsSchema: null,
     searchSchema: null,
     access: "public",
@@ -85,6 +93,7 @@ export const PLATFORM_ROUTE_REGISTRY = Object.freeze({
   NOT_FOUND: route({
     routeId: "NOT_FOUND",
     path: "*",
+    layoutGroup: "PUBLIC",
     paramsSchema: "NotFoundSplat",
     searchSchema: null,
     access: "public",

src/features/installed-feature-contracts.ts

@@ -1,5 +1,7 @@
 import { PLATFORM_ROUTE_RUNTIME_CONTRACT } from "../contracts/route-runtime-contract.ts";
+import type { RouteRuntimeDefinition } from "../contracts/route-runtime-contract.ts";
 import { PLATFORM_ROUTE_REGISTRY } from "../contracts/routes.ts";
+import type { RouteDefinition } from "../contracts/routes.ts";
 import {
   composeSchemaRegistry,
   PLATFORM_SCHEMA_REGISTRY,
@@ -20,11 +22,11 @@ export const INSTALLED_FEATURE_CONTRACTS = Object.freeze([
 export const ROUTE_REGISTRY = Object.freeze({
   ...PLATFORM_ROUTE_REGISTRY,
   ...REFERENCE_FEATURE_CONTRACT.routes,
-});
+}) satisfies Readonly<Record<string, RouteDefinition>>;
 export const ROUTE_RUNTIME_CONTRACT = Object.freeze({
   ...PLATFORM_ROUTE_RUNTIME_CONTRACT,
   ...REFERENCE_FEATURE_CONTRACT.routeRuntimeContracts,
-});
+}) satisfies Readonly<Record<string, RouteRuntimeDefinition>>;
 export const API_OPERATIONS = composeApiOperations(
   INSTALLED_FEATURE_CONTRACTS.map((contract) => contract.apiOperations),
 );

src/features/installed-feature-runtimes.tsx

@@ -4,10 +4,12 @@ import {
   REFERENCE_FEATURE_ROUTE_CODECS,
   REFERENCE_FEATURE_ROUTE_RUNTIME,
 } from "./reference-feature/presentation/reference-feature-runtime.tsx";
+import { TECH_LOG_ROUTE_CODECS } from "./tech-log/presentation/tech-log-route-codecs.ts";
 
 export const ROUTE_CODECS = Object.freeze({
   ...PLATFORM_ROUTE_CODECS,
   ...REFERENCE_FEATURE_ROUTE_CODECS,
+  ...TECH_LOG_ROUTE_CODECS,
 });
 
 export const ROUTE_RUNTIME = Object.freeze({

src/features/reference-feature/contracts/reference-feature-contract.ts

@@ -76,6 +76,7 @@ export const REFERENCE_FEATURE_CONTRACT = Object.freeze({
     REFERENCE_RESOURCE_LIST: Object.freeze({
       routeId: "REFERENCE_RESOURCE_LIST",
       path: "/examples/reference-resources",
+      layoutGroup: "PUBLIC",
       paramsSchema: null,
       searchSchema: "ReferenceResourceListQuery",
       access: "session-required",
@@ -89,6 +90,7 @@ export const REFERENCE_FEATURE_CONTRACT = Object.freeze({
     REFERENCE_RESOURCE_DETAIL: Object.freeze({
       routeId: "REFERENCE_RESOURCE_DETAIL",
       path: "/examples/reference-resources/:resourceId",
+      layoutGroup: "PUBLIC",
       paramsSchema: "ReferenceResourceParams",
       searchSchema: null,
       access: "session-required",
@@ -102,6 +104,7 @@ export const REFERENCE_FEATURE_CONTRACT = Object.freeze({
     REFERENCE_RESOURCE_FORM: Object.freeze({
       routeId: "REFERENCE_RESOURCE_FORM",
       path: "/examples/reference-resources/new",
+      layoutGroup: "PUBLIC",
       paramsSchema: null,
       searchSchema: null,
       access: "session-required",
@@ -115,6 +118,7 @@ export const REFERENCE_FEATURE_CONTRACT = Object.freeze({
     REFERENCE_RESOURCE_STATUS: Object.freeze({
       routeId: "REFERENCE_RESOURCE_STATUS",
       path: "/examples/reference-resources/status",
+      layoutGroup: "PUBLIC",
       paramsSchema: null,
       searchSchema: null,
       access: "session-required",

src/features/tech-log/contracts/tech-log-message-catalog.ts

@@ -0,0 +1,24 @@
+import {
+  TECH_LOG_ROUTE_REGISTRY,
+  type TechLogRouteId,
+} from "./tech-log-route-contract.ts";
+
+export type TechLogRouteMessageKey =
+  | `route.${TechLogRouteId}.title`
+  | `route.${TechLogRouteId}.navigation`;
+
+function createCatalog(): Readonly<Record<TechLogRouteMessageKey, string>> {
+  return Object.freeze(
+    Object.fromEntries(
+      Object.values(TECH_LOG_ROUTE_REGISTRY).flatMap((definition) => [
+        [`route.${definition.routeId}.title`, definition.title],
+        [`route.${definition.routeId}.navigation`, definition.title],
+      ]),
+    ),
+  ) as Readonly<Record<TechLogRouteMessageKey, string>>;
+}
+
+export const TECH_LOG_MESSAGE_CATALOGS = Object.freeze({
+  "ko-KR": createCatalog(),
+  "en-US": createCatalog(),
+});

src/features/tech-log/contracts/tech-log-route-contract.ts

@@ -0,0 +1,95 @@
+import type {
+  RouteCodecId,
+  RouteRuntimeDefinition,
+} from "../../../contracts/route-runtime-contract.ts";
+import type {
+  RouteDefinition,
+  RouteLayoutGroup,
+} from "../../../contracts/routes.ts";
+
+type RouteSpec = Readonly<{
+  routeId: string;
+  path: string;
+  layoutGroup: RouteLayoutGroup;
+  paramsSchema: RouteCodecId | null;
+  searchSchema: RouteCodecId | null;
+  title: string;
+  navigationLabel: string | null;
+  navigationOrder: number | null;
+}>;
+
+const defineSpec = <const Spec extends RouteSpec>(spec: Spec): Spec => spec;
+
+const TECH_LOG_ROUTE_SPECS = [
+  defineSpec({ routeId: "TECH_LOG_HOME", path: "/", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: "TechLogHomeSearch", title: "TechLog", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_EXPLORE", path: "/explore", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: "TechLogExploreSearch", title: "탐색", navigationLabel: "탐색", navigationOrder: 10 }),
+  defineSpec({ routeId: "TECH_LOG_EXPLORE_KIND", path: "/explore/:kind", layoutGroup: "PUBLIC", paramsSchema: "TechLogExploreKindParams", searchSchema: "TechLogExploreKindSearch", title: "유형별 탐색", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_CASE", path: "/cases/:slug", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: "TechLogCaseStateSearch", title: "Case", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_REFERENCE", path: "/references/:slug", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "Reference", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_QUESTION", path: "/questions/:slug", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "Open Question", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_TOPIC", path: "/topics/:slug", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "Topic", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_PROJECTS", path: "/projects", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: null, title: "프로젝트", navigationLabel: "프로젝트", navigationOrder: 20 }),
+  defineSpec({ routeId: "TECH_LOG_PROJECT", path: "/projects/:slug", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "프로젝트", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_PROJECT_RECORDS", path: "/projects/:slug/records", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "프로젝트 기록", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_PROJECT_DECISIONS", path: "/projects/:slug/decisions", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "프로젝트 결정", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_PROJECT_ACTIVITY", path: "/projects/:slug/activity", layoutGroup: "PUBLIC", paramsSchema: "TechLogSlugParams", searchSchema: null, title: "프로젝트 활동", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_RELEASES", path: "/releases", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: null, title: "변경 기록", navigationLabel: "변경 기록", navigationOrder: 30 }),
+  defineSpec({ routeId: "TECH_LOG_RELEASE", path: "/releases/:version", layoutGroup: "PUBLIC", paramsSchema: "TechLogVersionParams", searchSchema: null, title: "변경 기록", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_PROFILE", path: "/profile", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: null, title: "프로필", navigationLabel: "프로필", navigationOrder: 40 }),
+  defineSpec({ routeId: "TECH_LOG_SEARCH", path: "/search", layoutGroup: "PUBLIC", paramsSchema: null, searchSchema: "TechLogSearchQuery", title: "검색", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_HOME", path: "/studio", layoutGroup: "STUDIO", paramsSchema: null, searchSchema: null, title: "TechLog Studio", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENTS", path: "/studio/documents", layoutGroup: "STUDIO", paramsSchema: null, searchSchema: null, title: "작업본", navigationLabel: "작업본", navigationOrder: 10 }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENT_NEW", path: "/studio/documents/new", layoutGroup: "STUDIO", paramsSchema: null, searchSchema: null, title: "새 문서", navigationLabel: "새 문서", navigationOrder: 30 }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENT_EDIT", path: "/studio/documents/:id/edit", layoutGroup: "STUDIO", paramsSchema: "TechLogDocumentIdParams", searchSchema: null, title: "문서 편집", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENT_VALIDATION", path: "/studio/documents/:id/validation", layoutGroup: "STUDIO", paramsSchema: "TechLogDocumentIdParams", searchSchema: null, title: "문서 검증", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENT_PREVIEW", path: "/studio/documents/:id/preview", layoutGroup: "STUDIO", paramsSchema: "TechLogDocumentIdParams", searchSchema: null, title: "Public Preview", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_DOCUMENT_PUBLISH", path: "/studio/documents/:id/publish", layoutGroup: "STUDIO", paramsSchema: "TechLogDocumentIdParams", searchSchema: null, title: "게시", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_PUBLICATIONS", path: "/studio/publications", layoutGroup: "STUDIO", paramsSchema: null, searchSchema: null, title: "게시 기록", navigationLabel: "게시 기록", navigationOrder: 20 }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_PUBLICATION_PREVIEW", path: "/studio/publications/:publicationEventId/preview", layoutGroup: "STUDIO", paramsSchema: "TechLogPublicationEventIdParams", searchSchema: null, title: "게시 Snapshot", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "TECH_LOG_STUDIO_NOT_FOUND", path: "/studio/*", layoutGroup: "STUDIO", paramsSchema: "TechLogStudioSplat", searchSchema: null, title: "Studio 화면을 찾을 수 없습니다", navigationLabel: null, navigationOrder: null }),
+  defineSpec({ routeId: "NOT_FOUND", path: "*", layoutGroup: "PUBLIC", paramsSchema: "NotFoundSplat", searchSchema: null, title: "페이지를 찾을 수 없습니다.", navigationLabel: null, navigationOrder: null }),
+] as const;
+
+export type TechLogRouteId = (typeof TECH_LOG_ROUTE_SPECS)[number]["routeId"];
+
+function chunkId(routeId: TechLogRouteId): string {
+  return routeId === "NOT_FOUND"
+    ? "route-not-found"
+    : `route-${routeId.toLowerCase().replaceAll("_", "-")}`;
+}
+
+export const TECH_LOG_ROUTE_REGISTRY = Object.freeze(
+  Object.fromEntries(
+    TECH_LOG_ROUTE_SPECS.map((spec) => [
+      spec.routeId,
+      Object.freeze({
+        ...spec,
+        access: "public",
+        loadingSurface: spec.path.endsWith("*") ? "none" : "app-shell",
+        errorSurface: spec.path.endsWith("*")
+          ? "not-found"
+          : "feature-boundary",
+        chunkId: chunkId(spec.routeId),
+      } satisfies RouteDefinition),
+    ]),
+  ),
+) as Readonly<Record<TechLogRouteId, RouteDefinition>>;
+
+export const TECH_LOG_ROUTE_RUNTIME_CONTRACT = Object.freeze(
+  Object.fromEntries(
+    TECH_LOG_ROUTE_SPECS.map((spec) => [
+      spec.routeId,
+      Object.freeze({
+        routeId: spec.routeId,
+        moduleId: chunkId(spec.routeId),
+        paramsCodec: spec.paramsSchema ?? "none",
+        searchCodec: spec.searchSchema ?? "none",
+      } satisfies RouteRuntimeDefinition),
+    ]),
+  ),
+) as Readonly<Record<TechLogRouteId, RouteRuntimeDefinition>>;
+
+export const TECH_LOG_ROUTE_CONTRACT = Object.freeze({
+  routes: TECH_LOG_ROUTE_REGISTRY,
+  routeRuntimeContracts: TECH_LOG_ROUTE_RUNTIME_CONTRACT,
+});

src/features/tech-log/presentation/tech-log-route-codecs.ts

@@ -0,0 +1,56 @@
+import { z } from "zod";
+
+function first(value: unknown): unknown {
+  return Array.isArray(value) ? value[0] : value;
+}
+
+const optionalString = z.preprocess(first, z.string().optional());
+const optionalSelection = z.preprocess((value) => {
+  const selected = first(value);
+  if (typeof selected !== "string") return selected;
+  const normalized = selected.trim();
+  return normalized || undefined;
+}, z.string().optional());
+
+const nonEmptyParams = <Key extends string>(key: Key) =>
+  z.object({ [key]: z.string().min(1) } as Record<Key, z.ZodString>).strict();
+
+export const TECH_LOG_ROUTE_CODECS = Object.freeze({
+  TechLogExploreKindParams: nonEmptyParams("kind"),
+  TechLogSlugParams: nonEmptyParams("slug"),
+  TechLogVersionParams: nonEmptyParams("version"),
+  TechLogDocumentIdParams: nonEmptyParams("id"),
+  TechLogPublicationEventIdParams: nonEmptyParams("publicationEventId"),
+  TechLogStudioSplat: z
+    .object({ "*": z.string().min(1).optional() })
+    .strict(),
+  TechLogHomeSearch: z
+    .object({
+      focus: optionalString,
+      state: optionalString,
+    })
+    .strip(),
+  TechLogExploreSearch: z
+    .object({
+      type: optionalString,
+      topic: optionalSelection,
+      project: optionalSelection,
+    })
+    .strip(),
+  TechLogExploreKindSearch: z
+    .object({
+      topic: optionalSelection,
+      project: optionalSelection,
+    })
+    .strip(),
+  TechLogSearchQuery: z
+    .object({
+      q: optionalSelection,
+    })
+    .strip(),
+  TechLogCaseStateSearch: z
+    .object({
+      state: optionalString,
+    })
+    .strip(),
+} as const);

src/presentation/routes/app-router.tsx

@@ -1,4 +1,5 @@
 import {
+  type ComponentType,
   type ReactNode,
   Suspense,
   useEffect,
@@ -8,6 +9,7 @@ import {
 } from "react";
 import {
   createBrowserRouter,
+  Outlet,
   RouterProvider,
   type RouteObject,
   useLocation,
@@ -16,11 +18,11 @@ import {
   useSearchParams,
 } from "react-router-dom";
 
-import {
-  getRoute,
-  ROUTE_REGISTRY,
-} from "../../features/installed-feature-contracts.ts";
-import type { RouteDefinition } from "../../contracts/routes.ts";
+import { ROUTE_REGISTRY } from "../../features/installed-feature-contracts.ts";
+import type {
+  RouteDefinition,
+  RouteLayoutGroup,
+} from "../../contracts/routes.ts";
 import {
   FeatureBoundary,
   RouteBoundary,
@@ -34,14 +36,18 @@ import { SessionProvider, useSession } from "../providers/session-provider.tsx";
 import { ThemeProvider } from "../providers/theme-provider.tsx";
 import {
   createRedirectLoopGuard,
-  decideRouteAccess,
+  decideRouteAccessForDefinition,
 } from "./navigation-policy.ts";
 import {
-  buildRouteUrl,
-  parseRouteInput,
+  buildRouteUrlFromDefinition,
+  parseRouteInputFromContract,
+  type RouteCodecRegistry,
   type RouteId,
 } from "./route-codecs.ts";
-import { ROUTE_RUNTIME } from "../../features/installed-feature-runtimes.tsx";
+import {
+  ROUTE_CODECS,
+  ROUTE_RUNTIME,
+} from "../../features/installed-feature-runtimes.tsx";
 import type { ParsedRouteInput } from "./route-contract.ts";
 import { RouteInputProvider } from "./route-input.tsx";
 
@@ -138,33 +144,41 @@ function RouteLifecycle({
 
 function CanonicalRouteRedirect({
   input,
+  definition,
+  codecs,
 }: {
   input: ParsedRouteInput;
+  definition: RouteDefinition;
+  codecs: RouteCodecRegistry;
 }) {
   const location = useLocation();
   const navigate = useNavigate();
   const guard = useRef(createRedirectLoopGuard(3));
   useEffect(() => {
-    if (input.routeId === "NOT_FOUND") return;
+    if (definition.path.includes("*")) return;
     const source = `${location.pathname}${location.search}`;
-    const target = buildRouteUrl(input.routeId, {
-      params: input.params,
-      search: input.search,
-    });
+    const target = buildRouteUrlFromDefinition(
+      definition,
+      codecs,
+      {
+        params: input.params,
+        search: input.search,
+      },
+    );
     if (source === target) {
       guard.current.reset();
     } else if (guard.current.allow(source, target)) {
       void navigate(target, { replace: true });
     }
-  }, [input, location.pathname, location.search, navigate]);
+  }, [codecs, definition, input, location.pathname, location.search, navigate]);
   return null;
 }
 
 function ProtectedRoute({
-  routeId,
+  definition,
   children,
 }: {
-  routeId: RouteId;
+  definition: RouteDefinition;
   children: ReactNode;
 }) {
   const location = useLocation();
@@ -172,7 +186,7 @@ function ProtectedRoute({
   const { message } = useLocale();
   const [pending, setPending] = useState(false);
   const [failed, setFailed] = useState(false);
-  const decision = decideRouteAccess(routeId, sessionState);
+  const decision = decideRouteAccessForDefinition(definition, sessionState);
 
   async function continueSession() {
     setPending(true);
@@ -240,29 +254,45 @@ function ProtectedRoute({
 function RegisteredRoute({
   routeId,
   buildId,
+  definition,
+  runtime,
+  codecs,
 }: {
   routeId: RouteId;
   buildId: string;
+  definition: RouteDefinition;
+  runtime: GroupedRouteRuntimeDefinition;
+  codecs: RouteCodecRegistry;
 }) {
-  const definition = getRoute(routeId);
-  const runtime = ROUTE_RUNTIME[routeId];
   const params = useParams();
   const [search] = useSearchParams();
   const location = useLocation();
   const { diagnostics, recovery } = useApplication();
-  const parsed = parseRouteInput(routeId, params, search);
+  const parsed = parseRouteInputFromContract(
+    routeId,
+    definition,
+    codecs,
+    params,
+    search,
+  );
   if (!parsed.success) return <InvalidRouteSurface code={parsed.code} />;
+  const routeInput = parsed.data as ParsedRouteInput;
+  const RuntimeComponent = runtime.Component;
 
   const content = (
-    <RouteInputProvider input={parsed.data}>
-      <CanonicalRouteRedirect input={parsed.data} />
+    <RouteInputProvider input={routeInput}>
+      <CanonicalRouteRedirect
+        input={routeInput}
+        definition={definition}
+        codecs={codecs}
+      />
       <RouteLifecycle definition={definition} buildId={buildId} />
       <Suspense fallback={<RouteLoadingSurface definition={definition} />}>
         <ChunkRecoveryBoundary
           chunkId={definition.chunkId}
           recover={recovery.recoverChunk}
         >
-          <runtime.Component />
+          <RuntimeComponent />
         </ChunkRecoveryBoundary>
       </Suspense>
     </RouteInputProvider>
@@ -271,7 +301,7 @@ function RegisteredRoute({
     definition.access === "public" ? (
       content
     ) : (
-      <ProtectedRoute routeId={routeId}>{content}</ProtectedRoute>
+      <ProtectedRoute definition={definition}>{content}</ProtectedRoute>
     );
   const boundaryProps = {
     routeId,
@@ -288,34 +318,82 @@ function RegisteredRoute({
   );
 }
 
-function createRegisteredRoutes(buildId: string): RouteObject[] {
-  const children = Object.values(ROUTE_REGISTRY).map((definition) => {
+type GroupedRouteRuntimeDefinition = Readonly<{
+  moduleId: string;
+  Component: ComponentType;
+}>;
+
+type GroupedRouteRegistry = Readonly<Record<string, RouteDefinition>>;
+type GroupedRouteRuntime = Readonly<
+  Record<string, GroupedRouteRuntimeDefinition>
+>;
+type GroupedRouteLayouts = Readonly<Record<RouteLayoutGroup, ReactNode>>;
+
+export function createGroupedRouteObjects(
+  registry: GroupedRouteRegistry,
+  runtime: GroupedRouteRuntime,
+  layouts: GroupedRouteLayouts,
+  buildId: string,
+  codecs: RouteCodecRegistry = ROUTE_CODECS,
+): RouteObject[] {
+  for (const routeId of Object.keys(runtime)) {
+    if (!registry[routeId]) {
+      throw new TypeError(`Missing route definition: ${routeId}`);
+    }
+  }
+
+  const children: Record<RouteLayoutGroup, RouteObject[]> = {
+    PUBLIC: [],
+    STUDIO: [],
+  };
+  for (const definition of Object.values(registry)) {
     const routeId = definition.routeId as RouteId;
+    const routeRuntime = runtime[definition.routeId];
+    if (!routeRuntime) {
+      throw new TypeError(`Missing route runtime: ${definition.routeId}`);
+    }
+    const element = (
+      <RegisteredRoute
+        routeId={routeId}
+        buildId={buildId}
+        definition={definition}
+        runtime={routeRuntime}
+        codecs={codecs}
+      />
+    );
     if (definition.path === "/") {
-      return {
+      children[definition.layoutGroup].push({
         id: routeId,
         index: true,
-        element: <RegisteredRoute routeId={routeId} buildId={buildId} />,
-      };
+        element,
+      });
+      continue;
     }
-    return {
+    children[definition.layoutGroup].push({
       id: routeId,
       path:
         definition.path === "*"
           ? "*"
           : definition.path.replace(/^\//, ""),
-      element: <RegisteredRoute routeId={routeId} buildId={buildId} />,
-    };
-  });
-  return [
-    {
-      id: "APP_SHELL",
-      path: "/",
-      element: <AppShell />,
-      errorElement: <RouteFailureSurface />,
-      children,
-    },
-  ];
+      element,
+    });
+  }
+
+  for (const layoutGroup of ["PUBLIC", "STUDIO"] as const) {
+    children[layoutGroup].sort(
+      (left, right) =>
+        Number(Boolean(left.path?.endsWith("*"))) -
+        Number(Boolean(right.path?.endsWith("*"))),
+    );
+  }
+
+  return (["STUDIO", "PUBLIC"] as const).map((layoutGroup) => ({
+    id: `${layoutGroup}_LAYOUT`,
+    path: "/",
+    element: layouts[layoutGroup],
+    errorElement: <RouteFailureSurface />,
+    children: children[layoutGroup],
+  }));
 }
 
 export function AppRouter({
@@ -324,9 +402,18 @@ export function AppRouter({
 }: Readonly<{ basename?: string; buildId?: string }>) {
   const router = useMemo(
     () =>
-      createBrowserRouter(createRegisteredRoutes(buildId), {
-        basename,
-      }),
+      createBrowserRouter(
+        createGroupedRouteObjects(
+          ROUTE_REGISTRY,
+          ROUTE_RUNTIME,
+          {
+            PUBLIC: <AppShell />,
+            STUDIO: <Outlet />,
+          },
+          buildId,
+        ),
+        { basename },
+      ),
     [basename, buildId],
   );
   return (

src/presentation/routes/navigation-policy.ts

@@ -1,4 +1,5 @@
 import type { SessionState } from "../../application/ports/in/application-api.ts";
+import type { RouteDefinition } from "../../contracts/routes.ts";
 import { getRoute } from "../../features/installed-feature-contracts.ts";
 
 export type RouteAccessDecision =
@@ -12,8 +13,14 @@ export function decideRouteAccess(
   routeId: string,
   sessionState: SessionState,
 ): RouteAccessDecision {
-  const route = getRoute(routeId);
-  if (route.access === "public") return { allowed: true, action: "none" };
+  return decideRouteAccessForDefinition(getRoute(routeId), sessionState);
+}
+
+export function decideRouteAccessForDefinition(
+  definition: Pick<RouteDefinition, "access">,
+  sessionState: SessionState,
+): RouteAccessDecision {
+  if (definition.access === "public") return { allowed: true, action: "none" };
   if (sessionState === "authenticated") {
     return { allowed: true, action: "none" };
   }

src/presentation/routes/platform-route-codecs.ts

@@ -2,5 +2,5 @@ import { z } from "zod";
 
 export const PLATFORM_ROUTE_CODECS = {
   none: z.object({}).strict(),
-  NotFoundSplat: z.object({ "*": z.string().optional() }).strict(),
+  NotFoundSplat: z.object({ "*": z.string().min(1).optional() }).strict(),
 } as const;

src/presentation/routes/route-codecs.ts

@@ -1,5 +1,10 @@
-import { getRoute, ROUTE_RUNTIME_CONTRACT } from "../../features/installed-feature-contracts.ts";
+import {
+  getRoute,
+  ROUTE_RUNTIME_CONTRACT,
+} from "../../features/installed-feature-contracts.ts";
 import { ROUTE_CODECS } from "../../features/installed-feature-runtimes.tsx";
+import type { RouteDefinition } from "../../contracts/routes.ts";
+import type { RouteRuntimeDefinition } from "../../contracts/route-runtime-contract.ts";
 import type {
   ParsedRouteInput,
   RouteId,
@@ -8,8 +13,33 @@ import type {
 
 export type { ParsedRouteInput, RouteId, RouteInputResult };
 
-function codecById(codecId: string) {
-  const codec = ROUTE_CODECS[codecId as keyof typeof ROUTE_CODECS];
+type RouteCodec = Readonly<{
+  parse(value: unknown): Readonly<Record<string, unknown>>;
+  safeParse(value: unknown):
+    | Readonly<{
+        success: true;
+        data: Readonly<Record<string, unknown>>;
+      }>
+    | Readonly<{ success: false }>;
+}>;
+
+export type RouteCodecRegistry = Readonly<Record<string, RouteCodec>>;
+export type ContractRouteInputResult =
+  | Readonly<{
+      success: true;
+      data: Readonly<{
+        routeId: string;
+        params: Readonly<Record<string, unknown>>;
+        search: Readonly<Record<string, unknown>>;
+      }>;
+    }>
+  | Readonly<{
+      success: false;
+      code: "ROUTE_PARAMS_INVALID" | "ROUTE_SEARCH_INVALID";
+    }>;
+
+function codecById(codecId: string, codecs: RouteCodecRegistry = ROUTE_CODECS) {
+  const codec = codecs[codecId];
   if (!codec) throw new TypeError(`Unregistered route codec: ${codecId}`);
   return codec;
 }
@@ -19,12 +49,33 @@ export function parseRouteInput(
   rawParams: Readonly<Record<string, string | undefined>>,
   rawSearch: URLSearchParams,
 ): RouteInputResult {
-  const runtime = ROUTE_RUNTIME_CONTRACT[routeId];
-  const params = codecById(runtime.paramsCodec).safeParse(rawParams);
+  return parseRouteInputFromContract(
+    routeId,
+    getRoute(routeId),
+    ROUTE_CODECS,
+    rawParams,
+    rawSearch,
+  ) as RouteInputResult;
+}
+
+export function parseRouteInputFromContract(
+  routeId: string,
+  definition: Pick<RouteDefinition, "paramsSchema" | "searchSchema">,
+  codecs: RouteCodecRegistry,
+  rawParams: Readonly<Record<string, string | undefined>>,
+  rawSearch: URLSearchParams,
+): ContractRouteInputResult {
+  const params = codecById(
+    definition.paramsSchema ?? "none",
+    codecs,
+  ).safeParse(rawParams);
   if (!params.success) {
     return { success: false, code: "ROUTE_PARAMS_INVALID" };
   }
-  const search = codecById(runtime.searchCodec).safeParse(
+  const search = codecById(
+    definition.searchSchema ?? "none",
+    codecs,
+  ).safeParse(
     searchRecord(rawSearch),
   );
   if (!search.success) {
@@ -50,15 +101,71 @@ export function buildRouteUrl(
   }> = {},
 ): string {
   const definition = getRoute(routeId);
-  if (definition.path === "*") {
-    throw new TypeError("The not-found route cannot build a canonical URL");
-  }
   const runtime = ROUTE_RUNTIME_CONTRACT[routeId];
-  const params = codecById(runtime.paramsCodec).parse(input.params ?? {});
-  const search = codecById(runtime.searchCodec).parse(input.search ?? {});
+  return buildRouteUrlFromContract(
+    definition,
+    runtime,
+    ROUTE_CODECS,
+    input,
+  );
+}
+
+export function buildRouteUrlFromContract(
+  definition: Pick<RouteDefinition, "path">,
+  runtime: Pick<RouteRuntimeDefinition, "paramsCodec" | "searchCodec">,
+  codecs: RouteCodecRegistry,
+  input: Readonly<{
+    params?: Readonly<Record<string, unknown>>;
+    search?: Readonly<Record<string, unknown>>;
+  }> = {},
+): string {
+  return buildRouteUrlWithCodecs(
+    definition.path,
+    runtime.paramsCodec,
+    runtime.searchCodec,
+    codecs,
+    input,
+  );
+}
+
+export function buildRouteUrlFromDefinition(
+  definition: Pick<
+    RouteDefinition,
+    "path" | "paramsSchema" | "searchSchema"
+  >,
+  codecs: RouteCodecRegistry,
+  input: Readonly<{
+    params?: Readonly<Record<string, unknown>>;
+    search?: Readonly<Record<string, unknown>>;
+  }> = {},
+): string {
+  return buildRouteUrlWithCodecs(
+    definition.path,
+    definition.paramsSchema ?? "none",
+    definition.searchSchema ?? "none",
+    codecs,
+    input,
+  );
+}
+
+function buildRouteUrlWithCodecs(
+  pathTemplate: string,
+  paramsCodec: string,
+  searchCodec: string,
+  codecs: RouteCodecRegistry,
+  input: Readonly<{
+    params?: Readonly<Record<string, unknown>>;
+    search?: Readonly<Record<string, unknown>>;
+  }>,
+): string {
+  if (pathTemplate.includes("*")) {
+    throw new TypeError("A wildcard route cannot build a canonical URL");
+  }
+  const params = codecById(paramsCodec, codecs).parse(input.params ?? {});
+  const search = codecById(searchCodec, codecs).parse(input.search ?? {});
   const parsedParams: Record<string, unknown> = { ...params };
   const parsedSearch: Record<string, unknown> = { ...search };
-  let path = definition.path;
+  let path = pathTemplate;
   path = path.replace(
     /:([A-Za-z][A-Za-z0-9_]*)|\{([A-Za-z][A-Za-z0-9_]*)\}/g,
     (