feat(custom-block): move management to enterprise settings; derive inputs live from deployed start

Author: TheodoreSpeaks

apps/sim/app/api/custom-blocks/[id]/route.ts

@@ -57,12 +57,13 @@ export const PATCH = withRouteHandler(async (request: NextRequest, context: Rout
   const authz = await authorizeManage(session.user.id, id)
   if (authz.error) return authz.error
 
-  const { name, description, enabled, iconUrl, exposedOutputs } = parsed.data.body
+  const { name, description, enabled, iconUrl, inputs, exposedOutputs } = parsed.data.body
   try {
     await updateCustomBlock(id, {
       name,
       description,
       enabled,
+      inputs,
       iconUrl,
       exposedOutputs,
     })

apps/sim/app/api/custom-blocks/route.ts

@@ -31,6 +31,8 @@ function toWire(block: CustomBlockWithInputs) {
     id: block.id,
     organizationId: block.organizationId,
     workflowId: block.workflowId,
+    workflowName: block.workflowName,
+    workspaceName: block.workspaceName,
     type: block.type,
     name: block.name,
     description: block.description,
@@ -82,7 +84,8 @@ export const POST = withRouteHandler(async (request: NextRequest) => {
   if (!parsed.success) return parsed.response
 
   const userId = session.user.id
-  const { workspaceId, workflowId, name, description, iconUrl, exposedOutputs } = parsed.data.body
+  const { workspaceId, workflowId, name, description, iconUrl, inputs, exposedOutputs } =
+    parsed.data.body
 
   if (!(await hasWorkspaceAdminAccess(userId, workspaceId))) {
     return NextResponse.json({ error: 'Admin permissions required' }, { status: 403 })
@@ -117,6 +120,7 @@ export const POST = withRouteHandler(async (request: NextRequest) => {
       name,
       description,
       iconUrl,
+      inputs,
       exposedOutputs,
     })
     return NextResponse.json({ customBlock: toWire(block) })

apps/sim/app/workspace/[workspaceId]/providers/custom-blocks-loader.tsx

@@ -5,6 +5,7 @@ import { useParams } from 'next/navigation'
 import { buildCustomBlockConfig } from '@/blocks/custom/build-config'
 import { hydrateClientCustomBlocks } from '@/blocks/custom/client-overlay'
 import { getCustomBlockIcon } from '@/blocks/custom/custom-block-icon'
+import { useWhitelabelSettings } from '@/ee/whitelabeling/hooks/whitelabel'
 import { useCustomBlocks } from '@/hooks/queries/custom-blocks'
 
 /**
@@ -19,15 +20,21 @@ export function CustomBlocksLoader() {
   const workspaceId = params?.workspaceId as string | undefined
   const { data } = useCustomBlocks(workspaceId)
 
+  // Blocks with no uploaded icon fall back to the org's whitelabel logo, then the
+  // default glyph. All blocks share the org, so read it off the first row.
+  const { data: whitelabel } = useWhitelabelSettings(data?.[0]?.organizationId)
+  const fallbackIconUrl = whitelabel?.logoUrl ?? null
+
   useEffect(() => {
     hydrateClientCustomBlocks(
       // Only enabled blocks are resolvable/executable server-side, so the client
       // overlay (toolbar, canvas, palette) must exclude disabled ones too — else
       // the block is offered but every run fails.
       (data ?? [])
         .filter((block) => block.enabled)
-        .map((block) =>
-          buildCustomBlockConfig(
+        .map((block) => {
+          const effectiveIcon = block.iconUrl || fallbackIconUrl
+          return buildCustomBlockConfig(
             {
               type: block.type,
               name: block.name,
@@ -37,13 +44,13 @@ export function CustomBlocksLoader() {
             },
             block.inputFields,
             {
-              icon: getCustomBlockIcon(block.iconUrl),
-              bgColor: block.iconUrl ? 'transparent' : undefined,
+              icon: getCustomBlockIcon(block.iconUrl, fallbackIconUrl),
+              bgColor: effectiveIcon ? 'transparent' : undefined,
             }
           )
-        )
+        })
     )
-  }, [data])
+  }, [data, fallbackIconUrl])
 
   return null
 }

apps/sim/app/workspace/[workspaceId]/settings/[section]/settings.tsx

@@ -78,6 +78,9 @@ const WorkflowMcpServers = dynamic(() =>
 const AccessControl = dynamic(() =>
   import('@/ee/access-control/components/access-control').then((m) => m.AccessControl)
 )
+const CustomBlocks = dynamic(() =>
+  import('@/ee/custom-blocks/components/custom-blocks').then((m) => m.CustomBlocks)
+)
 const AuditLogs = dynamic(() =>
   import('@/ee/audit-logs/components/audit-logs').then((m) => m.AuditLogs)
 )
@@ -133,6 +136,7 @@ export function SettingsPage({ section }: SettingsPageProps) {
       {effectiveSection === 'secrets' && <Secrets />}
       {effectiveSection === 'credential-sets' && <CredentialSets />}
       {effectiveSection === 'access-control' && <AccessControl />}
+      {effectiveSection === 'custom-blocks' && <CustomBlocks />}
       {effectiveSection === 'audit-logs' && <AuditLogs />}
       {effectiveSection === 'apikeys' && <ApiKeys />}
       {isBillingEnabled && effectiveSection === 'billing' && <Billing />}

apps/sim/app/workspace/[workspaceId]/settings/navigation.ts

@@ -27,6 +27,7 @@ export type SettingsSection =
   | 'secrets'
   | 'credential-sets'
   | 'access-control'
+  | 'custom-blocks'
   | 'audit-logs'
   | 'apikeys'
   | 'byok'
@@ -81,6 +82,7 @@ export interface NavigationItem {
 const isSSOEnabled = isTruthy(getEnv('NEXT_PUBLIC_SSO_ENABLED'))
 const isCredentialSetsEnabled = isTruthy(getEnv('NEXT_PUBLIC_CREDENTIAL_SETS_ENABLED'))
 const isAccessControlEnabled = isTruthy(getEnv('NEXT_PUBLIC_ACCESS_CONTROL_ENABLED'))
+const isCustomBlocksEnabled = isTruthy(getEnv('NEXT_PUBLIC_CUSTOM_BLOCKS_ENABLED'))
 const isInboxEnabled = isTruthy(getEnv('NEXT_PUBLIC_INBOX_ENABLED'))
 const isWhitelabelingEnabled = isTruthy(getEnv('NEXT_PUBLIC_WHITELABELING_ENABLED'))
 const isAuditLogsEnabled = isTruthy(getEnv('NEXT_PUBLIC_AUDIT_LOGS_ENABLED'))
@@ -279,6 +281,16 @@ export const allNavigationItems: NavigationItem[] = [
     selfHostedOverride: isWhitelabelingEnabled,
     docsLink: 'https://docs.sim.ai/platform/enterprise/whitelabeling',
   },
+  {
+    id: 'custom-blocks',
+    label: 'Custom blocks',
+    description: 'Publish workflows as reusable blocks for your organization.',
+    icon: HexSimple,
+    section: 'enterprise',
+    requiresHosted: true,
+    requiresEnterprise: true,
+    selfHostedOverride: isCustomBlocksEnabled,
+  },
   {
     id: 'admin',
     label: 'Admin',