// @bun
// src/components/docs/architecture/ArchitectureAppConfigPage.tsx
import { CodeBlock } from "@contractspec/lib.design-system";
import Link from "@contractspec/lib.ui-link";
import { ChevronRight } from "lucide-react";
import { jsx, jsxs } from "react/jsx-runtime";
function ArchitectureAppConfigPage() {
  return /* @__PURE__ */ jsxs("div", {
    className: "space-y-8",
    children: [
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h1", {
            className: "text-4xl font-bold",
            children: "App Configuration"
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground",
            children: "ContractSpec uses a three-tier configuration model that separates global app definitions from tenant-specific settings and runtime resolution."
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "AppBlueprintSpec"
          }),
          /* @__PURE__ */ jsxs("p", {
            className: "text-muted-foreground",
            children: [
              "The ",
              /* @__PURE__ */ jsx("strong", {
                children: "AppBlueprintSpec"
              }),
              " is the global, versioned definition of your application. It contains no tenant-specific information and is stored in version control."
            ]
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "typescript",
            code: `type AppBlueprintSpec = {
  id: string;
  version: string;
  name: string;
  description: string;
  
  // Core specs
  capabilities: CapabilitySpec[];
  dataViews: DataViewSpec[];
  workflows: WorkflowSpec[];
  policies: PolicySpec[];
  
  // Required integrations
  requiredIntegrations: {
    integrationId: string;
    category: IntegrationCategory;
    purpose: string;
    optional?: boolean;
  }[];
  
  // Expected knowledge spaces
  knowledgeSpaces: {
    spaceId: string;
    category: KnowledgeCategory;
    required: boolean;
    purpose: string;
  }[];
  
  // UI/UX
  theme: ThemeSpec;
  overlays: OverlaySpec[];
  
  // Observability
  telemetry: TelemetrySpec;
  
  // Schema evolution
  migrations: MigrationSpec[];
};`
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "TenantAppConfig"
          }),
          /* @__PURE__ */ jsxs("p", {
            className: "text-muted-foreground",
            children: [
              "The ",
              /* @__PURE__ */ jsx("strong", {
                children: "TenantAppConfig"
              }),
              " is the per-tenant, per-environment configuration that customizes how a specific tenant uses the app."
            ]
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "typescript",
            code: `type TenantAppConfig = {
  tenantId: string;
  blueprintId: string;
  blueprintVersion: string;
  environment: "sandbox" | "staging" | "production";
  status: "draft" | "preview" | "published" | "archived" | "superseded";
  
  // Integration bindings
  integrationBindings: AppIntegrationBinding[];
  
  // Knowledge bindings
  knowledgeBindings: AppKnowledgeBinding[];
  
  // Tenant-specific overrides
  featureFlags: Record<string, boolean>;
  limits: {
    maxUsers?: number;
    maxStorage?: number;
    rateLimit?: number;
  };
  
  // Tenant customization
  branding: {
    logo?: string;
    colors?: Record<string, string>;
    domain?: string;
  };
  
  metadata: Record<string, unknown>;
  createdAt: string;
  updatedAt: string;
};`
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "AppIntegrationBinding"
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground",
            children: "Defines how a tenant connects specific integration instances to satisfy capabilities and workflows."
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "typescript",
            code: `type AppIntegrationBinding = {
  slotId: string;          // References AppIntegrationSlot.slotId
  connectionId: string;    // References IntegrationConnection.meta.id
  scope?: {
    workflows?: string[];
    operations?: string[];
    features?: string[];
  };
  priority?: number;       // Lower number = higher priority
};

// Example:
{
  slotId: "payments.primary",
  connectionId: "conn_stripe_acme_prod",
  scope: {
    workflows: ["checkout", "subscription-renewal"],
    operations: ["payments.stripe.*"]
  },
  priority: 1
}`
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "AppKnowledgeBinding"
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground",
            children: "Defines which knowledge spaces a tenant's app can access and how."
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "typescript",
            code: `type AppKnowledgeBinding = {
  spaceId: string;
  enabled: boolean;
  
  // Which workflows/agents can read this space
  allowedConsumers: {
    workflowIds?: string[];
    agentIds?: string[];
    roles?: string[];
  };
  
  // Category-based access control
  allowedCategories: KnowledgeCategory[];
  
  // Sources feeding this space for this tenant
  sources: string[];  // References KnowledgeSourceConfig IDs
  
  metadata?: Record<string, unknown>;
};

// Example:
{
  spaceId: "product-canon",
  enabled: true,
  allowedConsumers: {
    workflowIds: ["invoice-generation", "quote-creation"],
    agentIds: ["support-agent"]
  },
  allowedCategories: ["canonical", "operational"],
  sources: ["src_notion_product_docs", "src_database_schema"]
}`
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "ResolvedAppConfig"
          }),
          /* @__PURE__ */ jsxs("p", {
            className: "text-muted-foreground",
            children: [
              "The ",
              /* @__PURE__ */ jsx("strong", {
                children: "ResolvedAppConfig"
              }),
              " is the runtime result of merging AppBlueprintSpec with TenantAppConfig. It's computed on-demand and never persisted."
            ]
          }),
          /* @__PURE__ */ jsx(CodeBlock, {
            language: "typescript",
            code: `type ResolvedAppConfig = {
  appId: string;
  tenantId: string;
  blueprintName: string;
  blueprintVersion: number;
  environment?: string;
  configVersion: number;

  capabilities: { enabled: CapabilityRef[]; disabled: CapabilityRef[] };
  features: { include: FeatureRef[]; exclude: FeatureRef[] };
  dataViews: Record<string, SpecPointer>;
  workflows: Record<string, SpecPointer>;
  policies: PolicyRef[];
  theme?: AppThemeBinding;
  telemetry?: TelemetryBinding;
  experiments: {
    catalog: ExperimentRef[];
    active: ExperimentRef[];
    paused: ExperimentRef[];
  };
  featureFlags: FeatureFlagState[];
  routes: AppRouteConfig[];

  integrations: ResolvedIntegration[]; // [{ slot, binding, connection, spec }]
  knowledge: ResolvedKnowledge[];       // [{ binding, space, sources }]
  branding: ResolvedBranding;           // { appName, assets, colors, domain }
  notes?: string;
};`
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "Configuration flow"
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground",
            children: "Here's how configuration flows from definition to runtime:"
          }),
          /* @__PURE__ */ jsxs("ol", {
            className: "text-muted-foreground list-inside list-decimal space-y-3",
            children: [
              /* @__PURE__ */ jsxs("li", {
                children: [
                  /* @__PURE__ */ jsx("strong", {
                    children: "Development"
                  }),
                  " - Define AppBlueprintSpec with required integrations and knowledge spaces"
                ]
              }),
              /* @__PURE__ */ jsxs("li", {
                children: [
                  /* @__PURE__ */ jsx("strong", {
                    children: "Deployment"
                  }),
                  " - Deploy blueprint to environment (sandbox, staging, production)"
                ]
              }),
              /* @__PURE__ */ jsxs("li", {
                children: [
                  /* @__PURE__ */ jsx("strong", {
                    children: "Tenant Setup"
                  }),
                  " - Create TenantAppConfig with specific integration connections and knowledge sources"
                ]
              }),
              /* @__PURE__ */ jsxs("li", {
                children: [
                  /* @__PURE__ */ jsx("strong", {
                    children: "Runtime"
                  }),
                  " - Resolve configuration on-demand when tenant accesses the app"
                ]
              }),
              /* @__PURE__ */ jsxs("li", {
                children: [
                  /* @__PURE__ */ jsx("strong", {
                    children: "Execution"
                  }),
                  " - Use ResolvedAppConfig to execute capabilities, workflows, and enforce policies"
                ]
              })
            ]
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-4",
        children: [
          /* @__PURE__ */ jsx("h2", {
            className: "text-2xl font-bold",
            children: "Best practices"
          }),
          /* @__PURE__ */ jsxs("ul", {
            className: "text-muted-foreground list-inside list-disc space-y-2",
            children: [
              /* @__PURE__ */ jsx("li", {
                children: "Keep AppBlueprintSpec environment-agnostic - no secrets or tenant-specific data"
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Use TenantAppConfig for all tenant-specific settings and connections"
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Cache ResolvedAppConfig per request to avoid repeated resolution"
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Version blueprints carefully - migrations affect all tenants"
              }),
              /* @__PURE__ */ jsx("li", {
                children: "Test blueprint changes in sandbox before promoting to production"
              })
            ]
          })
        ]
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "flex items-center gap-4 pt-4",
        children: [
          /* @__PURE__ */ jsx(Link, {
            href: "/docs/architecture",
            className: "btn-ghost",
            children: "Back to Architecture"
          }),
          /* @__PURE__ */ jsxs(Link, {
            href: "/docs/architecture/integration-binding",
            className: "btn-primary",
            children: [
              "Integration Binding ",
              /* @__PURE__ */ jsx(ChevronRight, {
                size: 16
              })
            ]
          })
        ]
      })
    ]
  });
}
export {
  ArchitectureAppConfigPage
};
