fix(config): resolve the deployment shape on the server and read it through one client reader

Client-side deployment flags (`isHosted`, `isBillingEnabled`, `isChatEnabled`,
provider-configured flags, and the enterprise feature set) were module constants
computed once from the `NEXT_PUBLIC_*` transport the root layout emits. A
document that never runs the root layout — Next's bare `__next_error__` 404
shell, or `global-error` after the root or workspace layout throws — leaves
every one of them unset for the life of the tab, including after `retry()` or
a client-side navigation recovers the app in place. Sim Cloud then rendered as
self-hosted: an API Key field on every hosted-model block, no Auto model, no
billing sections, "Self hosting" in settings.

Project the deployment shape into the workspace host context, resolved on the
server per request (`resolveDeploymentShape`), and give browser code one
reader: `useDeploymentShape()` for components and `getDeploymentShape()` for
block conditions, sub-block visibility, stores, and helpers. The host provider
seeds the reader during its own render, ahead of any workspace child, so the
first paint already reads the server value; outside a workspace, where the root
layout always runs, the env constants remain the fallback.

Parameterize the settings catalog on the shape instead of module constants:
`selfHostedOverride` names a feature key resolved by
`isSelfHostedOverrideEnabled`, `buildUnifiedSettingsCatalog` is unfiltered so
`/settings/self-host` redirects to General on hosted instead of 404ing, and the
server section gate passes the same shape. Retire the browser-hostname fallback
for `isHosted` (superseded) and the module-scope env reads in the catalog.

Tests cover the resolver, the env-less document with and without a seeded
shape, provider seeding order, catalog resolution on both deployment kinds,
and the billing gate reading the host context; four component suites move from
partial `env-flags` factories to `setEnvFlags`.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

Author: icecrasher321

.claude/rules/global.md

@@ -68,6 +68,9 @@ const clone = structuredClone(obj)
 const filtered = filterUndefined(obj)
 ```
 
+## Deployment flags in the browser
+Client code inside a workspace reads `hosted`, `billingEnabled`, `chatEnabled`, and the enterprise feature set through `useDeploymentShape()` (components) or `getDeploymentShape()` (block conditions, stores, helpers) from `@/lib/core/config/deployment-shape`, never the `isHosted`/`isBillingEnabled` constants from `env-flags`. Those constants freeze at module init from the root layout's `NEXT_PUBLIC_*` transport, which Next's bare 404 shell and `global-error` never emit, so a tab recovered from one would render Sim Cloud as self-hosted. The reader is seeded from the server-resolved workspace host context. Server code keeps reading `env-flags`.
+
 ## Package Manager
 Use `bun` and `bunx`, not `npm` and `npx`.
 

CLAUDE.md

@@ -18,6 +18,7 @@ You are a professional software engineer. All code must follow best practices: a
   - `omit(obj, keys)` / `filterUndefined(obj)` from `@sim/utils/object` — object trimming; never `Object.fromEntries(Object.entries(...).filter(...))`
   - `truncate(str, maxLength, suffix?)` from `@sim/utils/string` — never inline slice + ellipsis
   - `backoffWithJitter(attempt, retryAfterMs, options?)` / `parseRetryAfter(header)` from `@sim/utils/retry` — shared retry pacing; never reimplement exponential backoff inline
+- **Deployment flags in the browser**: client code inside a workspace reads `hosted`, `billingEnabled`, `chatEnabled`, and the enterprise feature set through `useDeploymentShape()` (components) or `getDeploymentShape()` (block conditions, stores, helpers) from `@/lib/core/config/deployment-shape`, never `isHosted`/`isBillingEnabled`/... from `env-flags`. The constants freeze at module init from the root layout's `NEXT_PUBLIC_*` transport, which Next's bare 404 shell and `global-error` never emit; the reader is seeded from the server-resolved workspace host context instead. Server code keeps reading `env-flags`
 - **Package Manager**: Use `bun` and `bunx`, not `npm` and `npx`
 - **Type-checking**: Run `bun run type-check` (per workspace) or `bunx turbo run type-check` (all of them). Do not remove the `@typescript/native` alias from the root `devDependencies` — nothing imports it, but it is what makes a bare `tsc` resolve to the native TypeScript 7 compiler instead of the ~10x slower JavaScript TypeScript 6 one that `@typescript/typescript6` pulls in transitively. `bun run check:native-typecheck` enforces this
 

apps/sim/app/workspace/[workspaceId]/components/invite-modal/invite-modal.tsx

@@ -16,7 +16,7 @@ import { createLogger } from '@sim/logger'
 import type { BatchInvitationResult } from '@/lib/api/contracts/invitations'
 import { useSession } from '@/lib/auth/auth-client'
 import { isEnterprise } from '@/lib/billing/plan-helpers'
-import { isBillingEnabled } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import { quickValidateEmail } from '@/lib/messaging/email/validation'
 import type { PermissionType } from '@/lib/workspaces/permissions/utils'
 import { useWorkspaceHostContext } from '@/app/workspace/[workspaceId]/providers/workspace-host-provider'
@@ -141,6 +141,7 @@ export function InviteModal({
   }
 
   const { data: session } = useSession()
+  const { billingEnabled } = useDeploymentShape()
   const isOrganizationInvite = Boolean(organizationId)
 
   const sendInvitations = useSendWorkspaceInvitations()
@@ -190,7 +191,7 @@ export function InviteModal({
     hostContext.viewer.isHostOrganizationAdmin
 
   const { data: organizationBillingData } = useOrganizationBilling(organizationId ?? '', {
-    enabled: open && isBillingEnabled && canViewOrganizationBilling,
+    enabled: open && billingEnabled && canViewOrganizationBilling,
   })
 
   const totalSeats = organizationBillingData?.data?.totalSeats ?? 0

apps/sim/app/workspace/[workspaceId]/home/components/credits-chip/credits-chip.tsx

@@ -9,13 +9,14 @@ import { useSession } from '@/lib/auth/auth-client'
 import { formatCredits } from '@/lib/billing/credits/conversion'
 import { buildUpgradeHref } from '@/lib/billing/upgrade-reasons'
 import { canManageWorkspaceBilling } from '@/lib/billing/workspace-permissions'
-import { isBillingEnabled } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import { useWorkspaceHostContext } from '@/app/workspace/[workspaceId]/providers/workspace-host-provider'
 import { prefetchWorkspaceSettings } from '@/hooks/queries/workspace'
 import { useWorkspaceCreditAvailability } from '@/hooks/queries/workspace-usage'
 
 export function CreditsChip() {
-  if (!isBillingEnabled) return null
+  const { billingEnabled } = useDeploymentShape()
+  if (!billingEnabled) return null
 
   return <CreditsChipInner />
 }

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/special-tags/special-tags.tsx

@@ -21,7 +21,7 @@ import { useSession } from '@/lib/auth/auth-client'
 import { buildHostedUpgradeUrl, HOSTED_BILLING_SETTINGS_URL } from '@/lib/billing/upgrade-reasons'
 import { canManageWorkspaceBilling } from '@/lib/billing/workspace-permissions'
 import { isBrowserAgentAvailable, sendBrowserPanelAction } from '@/lib/browser-agent/transport'
-import { isHosted } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import { isSafeHttpUrl } from '@/lib/core/utils/urls'
 import { readLatestOAuthChatAttempt } from '@/lib/credentials/oauth-chat-attempt'
 import { getDesktopBridge } from '@/lib/desktop'
@@ -2990,16 +2990,17 @@ function UsageUpgradeDisplay({ data }: { data: UsageUpgradeTagData }) {
   const { data: session } = useSession()
   const hostContext = useWorkspaceHostContext()
   const { getSettingsHref } = useSettingsNavigation()
+  const { hosted } = useDeploymentShape()
   const buttonLabel = data.action === 'upgrade_plan' ? 'Upgrade Plan' : 'Increase Limit'
 
   // Self-hosted plan and limit both live on the hosted account, so local
   // workspace billing roles say nothing about who may change them.
-  const href = isHosted
+  const href = hosted
     ? getSettingsHref({ section: 'billing' })
     : data.action === 'upgrade_plan'
       ? buildHostedUpgradeUrl()
       : HOSTED_BILLING_SETTINGS_URL
-  const canManageBilling = !isHosted || canManageWorkspaceBilling(hostContext, session?.user?.id)
+  const canManageBilling = !hosted || canManageWorkspaceBilling(hostContext, session?.user?.id)
   const unavailableMessage = hostContext.hostOrganizationId
     ? 'Contact an organization admin to manage this workspace’s usage limits.'
     : 'Only the workspace owner can manage this workspace’s usage limits.'
@@ -3032,13 +3033,13 @@ function UsageUpgradeDisplay({ data }: { data: UsageUpgradeTagData }) {
       {canManageBilling ? (
         <a
           href={href}
-          target={isHosted ? undefined : '_blank'}
-          rel={isHosted ? undefined : 'noopener noreferrer'}
-          aria-label={isHosted ? undefined : `${buttonLabel} (opens in a new tab)`}
+          target={hosted ? undefined : '_blank'}
+          rel={hosted ? undefined : 'noopener noreferrer'}
+          aria-label={hosted ? undefined : `${buttonLabel} (opens in a new tab)`}
           className='mt-2 inline-flex items-center gap-1 text-amber-700 text-small underline decoration-dashed underline-offset-2 transition-colors hover-hover:text-amber-900 dark:text-amber-300 dark:hover-hover:text-amber-200'
         >
           {buttonLabel}
-          {isHosted ? <ArrowRight className='size-3' /> : <SquareArrowUpRight className='size-3' />}
+          {hosted ? <ArrowRight className='size-3' /> : <SquareArrowUpRight className='size-3' />}
         </a>
       ) : (
         <p className='mt-2 text-amber-700 text-small dark:text-amber-300'>{unavailableMessage}</p>

apps/sim/app/workspace/[workspaceId]/integrations/[block]/integration-block-detail.tsx

@@ -6,7 +6,7 @@ import { ArrowLeft, Plus } from '@sim/emcn/icons'
 import { useRouter } from 'next/navigation'
 import { useQueryState } from 'nuqs'
 import { HEADER_ACTION_CLUSTER, PAGE_HEADER_BAR } from '@/components/page-header-bar'
-import { isChatEnabled } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import {
   blockTypeToIconMap,
   type Integration,
@@ -69,6 +69,7 @@ export function IntegrationBlockDetail({ integration, workspaceId }: Integration
   const suggestedSkills = getSuggestedSkillsForBlock(integration.type)
   const oauthService = resolveOAuthServiceForIntegration(integration)
   const { integrationAvailability, isLoading: permissionConfigLoading } = usePermissionConfig()
+  const { chatEnabled } = useDeploymentShape()
   const availability = integrationAvailability.get(integration.type.toLowerCase())
   const oauthAvailable = Boolean(oauthService) && (availability?.oauthAvailable ?? true)
   const [oauthOpen, setOAuthOpen] = useState(false)
@@ -197,7 +198,7 @@ export function IntegrationBlockDetail({ integration, workspaceId }: Integration
             ) : (
               <Chip disabled>Unavailable</Chip>
             )
-          ) : isChatEnabled ? (
+          ) : chatEnabled ? (
             <Chip variant='primary' leftIcon={Plus} onClick={handleAddInChat}>
               Add to Sim
             </Chip>
@@ -279,7 +280,7 @@ export function IntegrationBlockDetail({ integration, workspaceId }: Integration
 
           {/* Every template hands its prompt to Chat, so the section has no
               destination without it. */}
-          {isChatEnabled && matchingTemplates.length > 0 && (
+          {chatEnabled && matchingTemplates.length > 0 && (
             <TemplatesSection
               integration={integration}
               templates={matchingTemplates}

apps/sim/app/workspace/[workspaceId]/integrations/components/showcase-with-explore/showcase-with-explore.tsx

@@ -3,7 +3,7 @@
 import { Chip } from '@sim/emcn'
 import { ArrowRight } from '@sim/emcn/icons'
 import { useParams, useRouter } from 'next/navigation'
-import { isChatEnabled } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import { IntegrationsShowcase } from '@/app/workspace/[workspaceId]/integrations/components/integrations-showcase'
 import { storeCuratedPrompt } from '@/blocks/integration-matcher'
 
@@ -25,12 +25,13 @@ interface ShowcaseWithExploreProps {
 export function ShowcaseWithExplore({ prompt }: ShowcaseWithExploreProps) {
   const params = useParams()
   const router = useRouter()
+  const { chatEnabled } = useDeploymentShape()
   const workspaceId = (params?.workspaceId as string) || ''
 
   return (
     <div className='relative'>
       <IntegrationsShowcase />
-      {isChatEnabled && (
+      {chatEnabled && (
         <Chip
           active
           rightIcon={ArrowRight}

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connector-entitlements.ts

@@ -1,16 +1,17 @@
 import type { WorkspaceOwnerBilling } from '@/lib/api/contracts/workspaces'
 import { getSubscriptionAccessState } from '@/lib/billing/client'
-import { isBillingEnabled, isHosted } from '@/lib/core/config/env-flags'
+import { getDeploymentShape } from '@/lib/core/config/deployment-shape'
 
 /**
  * Client mirror of `hasWorkspaceLiveSyncAccess`.
  *
- * Reads the same two env flags in the same order as the server helper so the two
- * cannot diverge: sub-hourly sync is ungated off the hosted deployment even when
- * billing is enabled. Without the `isHosted` branch a self-hosted operator with
- * billing on saw the "Live" interval locked while the API would have accepted it.
+ * Reads the same two deployment flags in the same order as the server helper so the
+ * two cannot diverge: sub-hourly sync is ungated off the hosted deployment even when
+ * billing is enabled. Without the `hosted` branch a self-hosted operator with billing
+ * on saw the "Live" interval locked while the API would have accepted it.
  */
 export function hasWorkspaceMaxConnectorAccess(ownerBilling: WorkspaceOwnerBilling): boolean {
-  if (!isHosted || !isBillingEnabled) return true
+  const { hosted, billingEnabled } = getDeploymentShape()
+  if (!hosted || !billingEnabled) return true
   return getSubscriptionAccessState(ownerBilling).hasUsableMaxAccess
 }

apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx

@@ -52,7 +52,7 @@ import { createPortal } from 'react-dom'
 import type { WorkflowLogRow } from '@/lib/api/contracts/logs'
 import { BASE_EXECUTION_CHARGE } from '@/lib/billing/constants'
 import { apportionCredits, dollarsToCredits } from '@/lib/billing/credits/conversion'
-import { isChatEnabled } from '@/lib/core/config/env-flags'
+import { useDeploymentShape } from '@/lib/core/config/deployment-shape'
 import { MothershipHandoffStorage } from '@/lib/core/utils/browser-storage'
 import { filterHiddenOutputKeys } from '@/lib/logs/execution/trace-spans/trace-spans'
 import type { TraceSpan } from '@/lib/logs/types'
@@ -319,6 +319,7 @@ export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentP
     ...logDetailsTabUrlKeys,
   })
   const { copied: copiedRunId, copy: copyRunId } = useCopyToClipboard({ resetMs: 1500 })
+  const { chatEnabled } = useDeploymentShape()
 
   const scrollAreaRef = useRef<HTMLDivElement>(null)
 
@@ -451,7 +452,7 @@ export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentP
    * mothership-triggered logs are excluded — `isLikelyExecution` already encodes
    * "has an executionId and isn't a mothership run".
    */
-  const canTroubleshoot = isChatEnabled && log.status === 'failed' && isLikelyExecution
+  const canTroubleshoot = chatEnabled && log.status === 'failed' && isLikelyExecution
 
   /**
    * Hands the failed run to Chat. When a chat is already mounted (e.g. the run

apps/sim/app/workspace/[workspaceId]/providers/workspace-host-provider.test.tsx

@@ -0,0 +1,140 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { act } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+const { mockUseWorkspaceHostContextQuery } = vi.hoisted(() => ({
+  mockUseWorkspaceHostContextQuery: vi.fn(),
+}))
+
+vi.mock('@/hooks/queries/workspace-host', () => ({
+  useWorkspaceHostContextQuery: mockUseWorkspaceHostContextQuery,
+}))
+
+vi.mock('@/app/workspace/[workspaceId]/components/workspace-access-denied', () => ({
+  WorkspaceAccessDenied: () => <output data-testid='denied' />,
+}))
+
+import type { WorkspaceHostContext } from '@/lib/api/contracts/workspaces'
+import {
+  getDeploymentShape,
+  resetDeploymentShape,
+  resolveDeploymentShape,
+} from '@/lib/core/config/deployment-shape'
+import {
+  useWorkspaceHostContext,
+  WorkspaceHostProvider,
+} from '@/app/workspace/[workspaceId]/providers/workspace-host-provider'
+
+;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true
+
+const HOST_CONTEXT: WorkspaceHostContext = {
+  workspace: {
+    id: 'workspace-1',
+    name: 'Workspace',
+    workspaceMode: 'organization',
+    billedAccountUserId: 'owner-1',
+  },
+  hostOrganizationId: 'org-1',
+  ownerBilling: {
+    plan: 'team',
+    status: 'active',
+    isPaid: true,
+    isPro: false,
+    isTeam: true,
+    isEnterprise: false,
+    isOrgScoped: true,
+    organizationId: 'org-1',
+    billingInterval: 'month',
+    billingBlocked: false,
+    billingBlockedReason: null,
+  },
+  viewer: {
+    permission: 'admin',
+    isHostOrganizationMember: true,
+    isHostOrganizationAdmin: true,
+  },
+  deployment: {
+    ...resolveDeploymentShape(),
+    hosted: true,
+    billingEnabled: true,
+  },
+}
+
+/** Reads the getter during render, the way block conditions do. */
+function GetterReader() {
+  return <output data-testid='getter'>{String(getDeploymentShape().hosted)}</output>
+}
+
+function ContextReader() {
+  const { deployment } = useWorkspaceHostContext()
+  return <output data-testid='context'>{String(deployment?.billingEnabled)}</output>
+}
+
+let host: HTMLDivElement
+let root: Root
+
+function renderProvider(initialContext: WorkspaceHostContext) {
+  act(() =>
+    root.render(
+      <WorkspaceHostProvider workspaceId='workspace-1' initialContext={initialContext}>
+        <GetterReader />
+        <ContextReader />
+      </WorkspaceHostProvider>
+    )
+  )
+}
+
+function textOf(testId: string): string | undefined {
+  return host.querySelector(`[data-testid="${testId}"]`)?.textContent ?? undefined
+}
+
+beforeEach(() => {
+  resetDeploymentShape()
+  mockUseWorkspaceHostContextQuery.mockReturnValue({ data: undefined, error: null })
+  host = document.createElement('div')
+  document.body.appendChild(host)
+  root = createRoot(host)
+})
+
+afterEach(() => {
+  act(() => root.unmount())
+  host.remove()
+  vi.clearAllMocks()
+})
+
+describe('WorkspaceHostProvider', () => {
+  it('seeds the server deployment shape before workspace children render', () => {
+    renderProvider(HOST_CONTEXT)
+
+    expect(textOf('getter')).toBe('true')
+    expect(textOf('context')).toBe('true')
+    expect(getDeploymentShape()).toBe(HOST_CONTEXT.deployment)
+  })
+
+  it('follows the refetched host context over the initial one', () => {
+    mockUseWorkspaceHostContextQuery.mockReturnValue({
+      data: {
+        ...HOST_CONTEXT,
+        deployment: { ...HOST_CONTEXT.deployment!, billingEnabled: false },
+      },
+      error: null,
+    })
+
+    renderProvider(HOST_CONTEXT)
+
+    expect(textOf('context')).toBe('false')
+    expect(getDeploymentShape().billingEnabled).toBe(false)
+  })
+
+  it('keeps the env fallback for a host context that predates deployment projection', () => {
+    const { deployment: _legacy, ...legacyContext } = HOST_CONTEXT
+
+    renderProvider(legacyContext)
+
+    expect(textOf('getter')).toBe('false')
+    expect(textOf('context')).toBe('undefined')
+  })
+})