Build the Platform Core, Chat, and member integrations UI

.agents/skills/add-block/SKILL.md

@@ -192,7 +192,7 @@ A block that takes a secret inline keeps running for existing workflows; the sav
 version is a new block type that spreads it. Keep the successor an object literal with the picker
 written inline, because the docs generator reads the source text:
 
-```typescript
+```typescript illustrative
 export const ServiceV2Block: BlockConfig = {
   ...ServiceBlock,
   type: 'service_v2',
@@ -354,7 +354,7 @@ path). A subblock whose meaning changes based on what the string looks like is i
 about, forces the params function to sniff the value, and makes the field's type meaningless. Give
 each alternative its own subblock outside the pair:
 
-```typescript
+```typescript illustrative
 // ✓ Good — the pair is "a file"; other sources are their own fields
 { id: 'mediaFile',    type: 'file-upload', canonicalParamId: 'media', mode: 'basic' },
 { id: 'mediaFileRef', type: 'short-input', canonicalParamId: 'media', mode: 'advanced' },
@@ -438,7 +438,7 @@ inputs: {
 
 For multiple file uploads:
 
-```typescript
+```typescript illustrative
 {
   id: 'attachments',
   title: 'Attachments',
@@ -721,7 +721,7 @@ outputs: {
 
 When creating V2 blocks (alongside legacy V1):
 
-```typescript
+```typescript illustrative
 // V1 Block - mark as legacy. A credential-only successor is the exception: the
 // successor keeps the legacy block's name, so neither block is renamed.
 export const ServiceBlock: BlockConfig = {
@@ -762,7 +762,7 @@ export const ServiceV2Block: BlockConfig = {
 
 Register the block in `apps/sim/blocks/registry-maps.ts` — add the import and an entry to each map alphabetically:
 
-```typescript
+```typescript illustrative
 import { ServiceBlock, ServiceBlockMeta } from '@/blocks/blocks/{service}'
 
 export const BLOCK_REGISTRY: Record<string, BlockConfig> = {
@@ -778,7 +778,7 @@ export const BLOCK_META_REGISTRY: Record<string, BlockMeta> = {
 
 ## Complete Example
 
-```typescript
+```typescript illustrative
 import { ServiceIcon } from '@/components/icons'
 import type { BlockConfig } from '@/blocks/types'
 import { AuthMode, IntegrationType } from '@/blocks/types'
@@ -876,7 +876,7 @@ export const ServiceBlock: BlockConfig = {
 
 If the service supports webhooks, connect the block to its triggers.
 
-```typescript
+```typescript illustrative
 import { getTrigger } from '@/triggers'
 
 export const ServiceBlock: BlockConfig = {
@@ -1025,7 +1025,9 @@ But if the same change also adds, edits **or removes** a tool, run `bun run gene
 
 A visible integration block does require the generated integration catalog and docs to be refreshed:
 `bun run generate:tool-metadata` (only when a tool changed), `bun run scripts/generate-docs.ts`,
-`bun run generate:deployment-config`, then `bun run check:audits`. Also run
+`bun run generate:deployment-config`, `bun scripts/sync-platform-integration-metadata.ts` (the
+Platform integration catalog, checked by `check:platform-integration-metadata`), then
+`bun run check:audits`. Also run
 `bun run apps/sim/scripts/check-block-registry.ts origin/staging` (CI runs it outside `check:audits`). Commit the
 full generator output. For what each check verifies, see the `validate-integration` skill →
 Regenerate Derived Artifacts.
@@ -1051,6 +1053,7 @@ Regenerate Derived Artifacts.
 - [ ] If any tool was added, changed or removed alongside the block: ran `bun run generate:tool-metadata` and committed the artifacts
 - [ ] Ran `bun run scripts/generate-docs.ts`, reviewed the generated diff, and committed the integration catalog changes
 - [ ] `bun run check:integration-catalog` passes
+- [ ] Ran `bun scripts/sync-platform-integration-metadata.ts` and committed its output; `bun run check:platform-integration-metadata` passes
 - [ ] `bun run check:docs` passes (CI gate — fails on any stale generated docs page)
 - [ ] If icon missing: asked user to provide SVG
 - [ ] If triggers exist: `triggers` config set, trigger subBlocks spread
@@ -1090,7 +1093,7 @@ A sub-block gets its choices from exactly one of two places. There is no third.
 `apps/sim/lib/selectors/server/internal.ts`. Point the sub-block at that key. All remote selectors
 execute through `selectors.execute`; never add a client provider module or selector-only fetch route.
 
-```ts
+```ts illustrative
 { id: 'triggerCredentials', type: 'oauth-input', canonicalParamId: 'oauthCredential', mode: 'trigger' },
 { id: 'labelIds', type: 'dropdown', multiSelect: true,
   selectorKey: 'gmail.labels', dependsOn: ['triggerCredentials'], mode: 'trigger' },
@@ -1107,7 +1110,7 @@ legacy source id must be retained.
 
 **`options` — everything else.** A static array, or a pure function of the block's own values for a list that narrows to a sibling's selection. No I/O.
 
-```ts
+```ts illustrative
 options: (params) => {
   const model = params?.values.model
   return typeof model === 'string' ? effortsFor(model) : DEFAULT_EFFORTS

.agents/skills/add-column-type/SKILL.md

@@ -50,7 +50,7 @@ Decide what a cell literally holds in `user_table_rows.data` (JSONB). This drive
 
 ## Step 2: Add the icon
 
-Create `packages/emcn/src/icons/type-{name}.tsx`, copying the geometry conventions of its siblings exactly:
+Create `packages/emcn-legacy/src/icons/type-{name}.tsx`, copying the geometry conventions of its siblings exactly:
 
 ```tsx
 import type { SVGProps } from 'react'
@@ -82,7 +82,7 @@ export function Type{Pascal}(props: SVGProps<SVGSVGElement>) {
 
 - `viewBox='-1.75 -1.5 24 24'` is the **`type-*` family** value, not the set-wide default. Match the family.
 - Center the glyph on the viewBox's optical center (**y = 10.5**, **x = 10.25**) — every sibling does, and a few tenths off is visible at `size-[14px]`.
-- Export alphabetically **by component name** in `packages/emcn/src/icons/index.ts`.
+- Export alphabetically **by component name** in `packages/emcn-legacy/src/icons/index.ts`.
 
 ## Step 3: Write the type file
 
@@ -118,7 +118,7 @@ Prefer set-based SQL. When the transform genuinely needs JS (`currency`'s separa
 
 - **Import cycles.** `column-types/select.ts` imports `lib/table/select-values.ts`, so `select-values.ts` must **not** import the registry — that closes a cycle and fails at module init. Inside a type's own helper module the string literal is the implementation, not a config leak.
 - **The client-safe boundary.** `registry.ts` and everything it imports must stay free of `@sim/db`, `drizzle-orm`, and `next/server` — the tables grid imports it directly. A React icon is fine (it's a component *reference*, never called server-side). Only `registry.server.ts` may touch drizzle.
-- **Don't re-export the registry from `@/lib/table`.** Dozens of server modules import that barrel; routing this through it pulls `@sim/emcn/icons` into all of them. Deep-import `@/lib/table/column-types`.
+- **Don't re-export the registry from `@/lib/table`.** Dozens of server modules import that barrel; routing this through it pulls `@sim/emcn-legacy/icons` into all of them. Deep-import `@/lib/table/column-types`.
 - **`import.ts`'s `coerceValue` is a SECOND write path and is not opt-in.** Importing into a column of your type always hits it, and its `default` arm silently `String(value)`s — so a missing `case` stores text in a column whose `jsonbCast` is numeric, and then every filter and sort on that column errors in Postgres. Add a `case`, even though the switch compiles without one. (It is deliberately separate from the registry's `coerce`: an import wants an unparseable value to survive as its raw string so the row error can name it.)
 - **CSV inference** is an ordered heuristic in `import.ts`, deliberately not registry-driven. A new type is not inferred from a CSV unless you extend `inferColumnType` — usually you should not, since inference cannot supply configuration (an option set, a currency code).
 
@@ -134,7 +134,7 @@ Registering the *type* is compiler-enforced. Registering its *metadata* is not,
 | `lib/api/contracts/v2/tables.ts` and `lib/table/application/columns.ts` — the same slots for the v2 API and its use cases | the v2 API silently drops it |
 | `columns/service.ts` `addTableColumn` param type | callers cannot pass it |
 | A metadata-only update in `lib/table/columns/service.ts` (`updateColumnCurrency` is the model) + a branch in `performUpdateTableColumn` in `lib/table/orchestration/columns.ts` | changing it on an existing column is a silent 200 no-op |
-| `column-config-sidebar.tsx` | no UI to set it |
+| `column-config.tsx` | no UI to set it |
 | `table-grid.tsx` delete-column undo + `use-table-undo.ts` restore | undo silently resets it to the default |
 
 `normalizeColumn`, `buildConvertedColumn`, and the undo snapshot read `TYPE_SPECIFIC_COLUMN_KEYS` generically, so those three are already zero-edit.
@@ -156,6 +156,6 @@ Copy `currency`'s service function and orchestration branch.
 
 1. **`cd apps/sim && bun run type-check`** — must be clean. If any file *outside* `column-types/` errors, that file has a hardcoded type list; fix it to read the registry.
 2. **Grep for leaks** — `grep -rnE "(===|!==) '{id}'|case '{id}':" apps/sim --include='*.ts' --include='*.tsx' | grep -v column-types/`. (All three forms: a plain `!==` and a `case` are how half of `currency`'s real branches are written.) Hits are expected; judge each. A hit is fine when it mounts a specific React component or encodes a genuinely one-off behavior (`json`'s mono textarea, `date`'s timezone-aware parsing). A hit is a **leak** when it restates something the registry could answer — an icon, a label, a colour, an operator set, a cast, a coercion. Leaks get a registry field, not a new branch.
-3. **Run the suite** — `bun run --cwd apps/sim test lib/table 'app/workspace/[workspaceId]/tables' lib/api app/api/table app/api/v1`. Existing tests must pass **unchanged**; needing to edit one means you changed behavior for the other types.
+3. **Run the suite** — `bun run --cwd apps/sim test lib/table components/tables lib/api app/api/table app/api/v1/tables app/api/v2/tables`. Existing tests must pass **unchanged**; needing to edit one means you changed behavior for the other types.
 4. **`bun run lint`, `bun run check:api-validation:strict`, `bun run check:client-boundary`** from the repo root.
 5. **Exercise it in the running app** on a table with one column of every type: create, edit inline / in the expanded popover / in the row modal, paste from a spreadsheet, filter, sort, convert to and from other types, export CSV, undo a column delete.

.agents/skills/add-connector/SKILL.md

@@ -400,7 +400,7 @@ contentHash: `confluence:${page.id}:${page.version.number}`
 
 ### Implementation Pattern
 
-```typescript
+```typescript illustrative
 // 1. Create a stub function (sync, no API calls)
 function fileToStub(file: ServiceFile): ExternalDocument {
   return {

.agents/skills/add-enrichment/SKILL.md

@@ -64,8 +64,8 @@ Why it matters: the cascade runner only bills (and only reads `output.cost.total
 
 Create `apps/sim/enrichments/{id}/{id}.ts` and a barrel `index.ts`. Mirror the entries registered in `enrichments/registry.ts`.
 
-```typescript
-import { SomeIcon } from '@sim/emcn/icons'
+```typescript illustrative
+import { SomeIcon } from '@sim/emcn-legacy/icons'
 import { filterUndefined } from '@sim/utils/object'
 import { normalizeDomain, splitName, str, toolProvider } from '@/enrichments/providers'
 import type { EnrichmentConfig } from '@/enrichments/types'
@@ -105,21 +105,21 @@ export const myEnrichment: EnrichmentConfig = {
 }
 ```
 
-```typescript
+```typescript illustrative
 // apps/sim/enrichments/{id}/index.ts
 export { myEnrichment } from './my-enrichment'
 ```
 
 Rules:
-- Keep the file **client-safe**: import only `@sim/emcn/icons`, `@sim/utils/*`, `@/enrichments/providers`, and the types. **Never import `@/tools`** here — the runner does the tool call.
+- Keep the file **client-safe**: import only `@sim/emcn-legacy/icons`, `@sim/utils/*`, `@/enrichments/providers`, and the types. **Never import `@/tools`** here — the runner does the tool call.
 - `buildParams` returns `null` when inputs are insufficient (provider skipped). `mapOutput` returns `null`/empty for a miss (falls through). Use `filterUndefined` when assembling optional tool params; coerce numbers explicitly (don't pass `''` to number outputs).
 - Output `id`s are the keys `mapOutput` returns; output `name`s are the default column names (the user can rename them in the config).
 
 ## Step 4: Register it
 
 In `apps/sim/enrichments/registry.ts`, import and add the entry (catalog order is registration order):
 
-```typescript
+```typescript illustrative
 import { myEnrichment } from '@/enrichments/{id}'
 
 export const ENRICHMENT_REGISTRY: EnrichmentRegistry = {

.agents/skills/add-feature-flag/SKILL.md

@@ -43,7 +43,7 @@ Critically, **none of this is expressible in code** — gating (especially `admi
 
 2. **Define the flag.** Add one entry to the `FEATURE_FLAGS` registry in `apps/sim/lib/core/config/feature-flags.ts`. Each entry is the flag's whole definition — name (kebab-case key), `description`, and the `fallback` secret consulted when AppConfig isn't the source of truth (truthy ⇒ on globally):
 
-   ```ts
+   ```ts illustrative
    const FEATURE_FLAGS = {
      '<flag-name>': {
        description: '<what this gates>',

.agents/skills/add-hosted-key/SKILL.md

@@ -16,7 +16,7 @@ When a tool has hosted key support, Sim provides its own API key if the user has
 | 2 | Research the API's pricing and rate limits | API docs / pricing page (before writing any code) |
 | 3 | Add `hosting` config to the tool | `tools/{service}/{action}.ts` |
 | 4 | Hide API key field when hosted | `blocks/blocks/{service}.ts` |
-| 5 | Add to BYOK settings UI | BYOK settings component (`byok.tsx`) |
+| 5 | Add to BYOK settings UI | BYOK settings `providers.ts` |
 | 6 | Summarize pricing and throttling comparison | Output to user (after all code changes) |
 
 ## Step 1: Register the BYOK Provider ID
@@ -80,7 +80,7 @@ When choosing values for `requestsPerMinute` and any dimension limits:
 
 Add a `hosting` object to the tool's `ToolConfig`. This tells the execution layer how to acquire hosted keys, calculate cost, and rate-limit.
 
-```typescript
+```typescript illustrative
 hosting: {
   envKeyPrefix: 'YOUR_SERVICE_API_KEY',
   apiKeyParam: 'apiKey',
@@ -107,14 +107,14 @@ hosting: {
 
 Keys use a numbered naming pattern driven by a count env var:
 
-```
+```text illustrative
 YOUR_SERVICE_API_KEY_COUNT=3
 YOUR_SERVICE_API_KEY_1=sk-...
 YOUR_SERVICE_API_KEY_2=sk-...
 YOUR_SERVICE_API_KEY_3=sk-...
 ```
 
-The `envKeyPrefix` value (`YOUR_SERVICE_API_KEY`) determines which env vars are read at runtime. Adding more keys only requires bumping the count and adding the new env var.
+The `envKeyPrefix` value (`<YOUR_SERVICE>_API_KEY`) determines which env vars are read at runtime. Adding more keys only requires bumping the count and adding the new env var.
 
 ### Pricing: Prefer API-Reported Cost
 
@@ -187,7 +187,7 @@ transformResponse: async (response: Response) => {
 
 For async/polling tools, capture it in `postProcess` when the job completes:
 
-```typescript
+```typescript illustrative
 if (jobData.status === 'completed') {
   result.output = {
     data: jobData.data,
@@ -253,9 +253,9 @@ To exclude multiple operations, use an array: `{ field: 'operation', value: ['op
 
 ## Step 5: Add to the BYOK Settings UI
 
-Add an entry to the `PROVIDERS` array in the BYOK settings component so users can bring their own key. You need the service icon from `components/icons.tsx`:
+Add an entry to the `PROVIDERS` array in the BYOK settings `providers.ts` so users can bring their own key. You need the service icon from `components/icons.tsx`:
 
-```typescript
+```typescript illustrative
 {
   id: 'your_service',
   name: 'Your Service',

.agents/skills/add-integration/SKILL.md

@@ -43,7 +43,7 @@ supported paths and choose the simplest supported setup for the intended user:
 | Customer-owned client credentials | Saved `service_account` credential with a client ID and secret | Internal-app eligibility, grant activation, scope syntax, token lifetime and revocation behavior |
 | API token or personal access token | Saved token service account when reusable connections are useful | Token permissions, identity verification, expiry and rotation |
 | Private key, certificate, or service-account JSON | Existing key-based service-account framework | Signing algorithm, audience, subject, tenant binding and key rotation |
-| Cloud workload identity (AWS role, Databricks/Snowflake/Entra/GCP federation) | Keyless saved credential: Sim signs a short-lived OIDC token the customer's cloud trusts. Add the provider to every table in `lib/credentials/workload-identity/audiences.ts` (`WORKLOAD_IDENTITY_PROVIDERS`, its service-account provider ID map, `WORKLOAD_IDENTITY_KEYLESS_CONFIGS`, `WORKLOAD_IDENTITY_AUDIENCES`) and to `MIXED_MODE_PROVIDERS` in `lib/credentials/application/prepare-workload-identity.ts` | Issuer and audience the provider accepts, how the trust pins the subject, token lifetime |
+| Cloud workload identity (AWS role, Databricks/Snowflake/Entra/GCP federation) | Keyless saved credential: Sim signs a short-lived OIDC token the customer's cloud trusts. Add the provider to every table in `lib/credentials/workload-identity/audiences.ts` (`WORKLOAD_IDENTITY_PROVIDERS`, its service-account provider ID map, `WORKLOAD_IDENTITY_KEYLESS_CONFIGS`, `WORKLOAD_IDENTITY_AUDIENCES`) | Issuer and audience the provider accepts, how the trust pins the subject, token lifetime |
 
 API, CLI, and MCP callers set up keyless in two steps: `POST /api/v2/credentials/workload-identity/subjects`
 (or `sim credentials keyless-subject <providerId> --output json`) returns the subject to trust and a
@@ -373,7 +373,7 @@ export const BLOCK_META_REGISTRY: Record<string, BlockMeta> = {
 
 ### Trigger Registry (`apps/sim/triggers/registry.ts`) - If triggers exist
 
-```typescript
+```typescript illustrative
 // Add import (alphabetically)
 import {
   {service}EventATrigger,
@@ -437,7 +437,9 @@ a resolvable capability must fail validation; an independent service account use
 ## Step 8: Generate and Validate the Catalog
 
 Run `bun run generate:tool-metadata`, `bun run scripts/generate-docs.ts`,
-`bun run generate:deployment-config`, then `bun run check:audits` (see the `validate-integration`
+`bun run generate:deployment-config`, `bun scripts/sync-platform-integration-metadata.ts` (the
+Platform integration catalog; `check:platform-integration-metadata` is in `check:audits`), then
+`bun run check:audits` (see the `validate-integration`
 skill → Regenerate Derived Artifacts for the full list and what each check verifies).
 
 The docs generator creates `apps/docs/content/docs/integrations/{service}.mdx` — one page per service carrying the block's Actions and, if it has one, its Triggers section. Never hand-edit generated pages; the only editable region is the `{/* MANUAL-CONTENT */}` block (see `scripts/README.md`).
@@ -667,7 +669,7 @@ tools: {
 
 #### 3. Define and register the in-process operation
 
-```typescript
+```typescript illustrative
 export const {service}UploadTool: InternalToolConfig<Params, Response> = {
   id: '{service}_upload',
   // ...

.agents/skills/add-managed-cli/SKILL.md

@@ -116,7 +116,7 @@ bun run --cwd apps/sim test \
   lib/execution/remote-sandbox/cli-tools-boundary.test.ts \
   lib/execution/remote-sandbox/spec.test.ts \
   lib/execution/remote-sandbox/resolve.test.ts \
-  'app/workspace/[workspaceId]/settings/components/sandboxes/utils.test.ts'
+  'components/settings/sections/sandboxes/utils.test.ts'
 ```
 
 From the repository root: