From 9392bb9fba0667f75e98eb5d55e465ef963ca109 Mon Sep 17 00:00:00 2001
From: Theodore Li <theo@sim.ai>
Date: Tue, 4 Aug 2026 15:04:57 -0700
Subject: [PATCH 1/5] feat(admin): add password user creation

---
 .../components/admin/add-user-modal.test.tsx  | 250 ++++++++++++++++++
 .../components/admin/add-user-modal.tsx       | 188 +++++++++++++
 .../settings/components/admin/admin.tsx       |  17 +-
 apps/sim/hooks/queries/admin-users.test.ts    |  95 +++++++
 apps/sim/hooks/queries/admin-users.ts         |  38 +++
 5 files changed, 587 insertions(+), 1 deletion(-)
 create mode 100644 apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
 create mode 100644 apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
 create mode 100644 apps/sim/hooks/queries/admin-users.test.ts

diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
new file mode 100644
index 00000000000..fe210c44b73
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
@@ -0,0 +1,250 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { act, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true
+
+const { addUserMutation, mockMutate, mockReset } = vi.hoisted(() => ({
+  addUserMutation: {
+    current: {
+      isPending: false,
+      error: null as Error | null,
+    },
+  },
+  mockMutate: vi.fn(),
+  mockReset: vi.fn(),
+}))
+
+vi.mock('@sim/emcn', () => ({
+  ChipModal: ({ open, children }: { open: boolean; children: ReactNode }) =>
+    open ? <div role='dialog'>{children}</div> : null,
+  ChipModalHeader: ({ children }: { children: ReactNode }) => <h2>{children}</h2>,
+  ChipModalBody: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  ChipModalError: ({ children }: { children: ReactNode }) =>
+    children ? <div role='alert'>{children}</div> : null,
+  ChipModalFooter: ({
+    onCancel,
+    primaryAction,
+  }: {
+    onCancel: () => void
+    primaryAction: { label: ReactNode; onClick: () => void; disabled?: boolean }
+  }) => (
+    <footer>
+      <button type='button' onClick={onCancel}>
+        Cancel
+      </button>
+      <button type='button' disabled={primaryAction.disabled} onClick={primaryAction.onClick}>
+        {primaryAction.label}
+      </button>
+    </footer>
+  ),
+  ChipModalField: ({
+    type,
+    inputType,
+    title,
+    value,
+    onChange,
+    options,
+    disabled,
+    error,
+  }: {
+    type: string
+    inputType?: string
+    title: string
+    value: string
+    onChange: (value: string) => void
+    options?: ReadonlyArray<{ value: string; label: string }>
+    disabled?: boolean
+    error?: ReactNode
+  }) => (
+    <div>
+      <span>{title}</span>
+      {type === 'dropdown' ? (
+        <select
+          aria-label={title}
+          value={value}
+          disabled={disabled}
+          onChange={(event) => onChange(event.target.value)}
+        >
+          {options?.map((option) => (
+            <option key={option.value} value={option.value}>
+              {option.label}
+            </option>
+          ))}
+        </select>
+      ) : (
+        <input
+          aria-label={title}
+          type={inputType ?? (type === 'email' ? 'email' : 'text')}
+          value={value}
+          disabled={disabled}
+          onChange={(event) => onChange(event.target.value)}
+        />
+      )}
+      {error && <span role='alert'>{error}</span>}
+    </div>
+  ),
+}))
+
+vi.mock('@/hooks/queries/admin-users', () => ({
+  useAddUser: () => ({
+    ...addUserMutation.current,
+    mutate: mockMutate,
+    reset: mockReset,
+  }),
+}))
+
+import { AddUserModal } from '@/app/workspace/[workspaceId]/settings/components/admin/add-user-modal'
+import type { AddUserInput, AdminUser } from '@/hooks/queries/admin-users'
+
+const CREATED_USER: AdminUser = {
+  id: 'user-1',
+  name: 'Canary Writer',
+  email: 'writer@synthetics.example.com',
+  role: 'user',
+  banned: false,
+  banReason: null,
+}
+
+let container: HTMLDivElement
+let root: Root
+let onCreated: ReturnType<typeof vi.fn<(user: AdminUser) => void>>
+let onOpenChange: ReturnType<typeof vi.fn<(open: boolean) => void>>
+
+async function renderModal() {
+  await act(async () => {
+    root.render(<AddUserModal open onOpenChange={onOpenChange} onCreated={onCreated} />)
+  })
+}
+
+function field(label: string): HTMLInputElement | HTMLSelectElement {
+  const element = container.querySelector<HTMLInputElement | HTMLSelectElement>(
+    `[aria-label="${label}"]`
+  )
+  if (!element) throw new Error(`No field labelled "${label}"`)
+  return element
+}
+
+async function changeField(label: string, value: string) {
+  const element = field(label)
+  const valueSetter = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(element), 'value')?.set
+  if (!valueSetter) throw new Error(`Field labelled "${label}" has no value setter`)
+  await act(async () => {
+    valueSetter.call(element, value)
+    element.dispatchEvent(
+      new Event(element instanceof HTMLSelectElement ? 'change' : 'input', { bubbles: true })
+    )
+  })
+}
+
+function buttonLabelled(text: string): HTMLButtonElement {
+  const button = [...container.querySelectorAll('button')].find(
+    (candidate) => candidate.textContent === text
+  )
+  if (!button) throw new Error(`No button labelled "${text}"`)
+  return button
+}
+
+async function fillRequiredFields() {
+  await changeField('Name', '  Canary Writer  ')
+  await changeField('Email', '  Writer@Synthetics.Example.com ')
+  await changeField('Password', 'canary-password')
+}
+
+describe('AddUserModal', () => {
+  beforeEach(() => {
+    container = document.createElement('div')
+    document.body.appendChild(container)
+    root = createRoot(container)
+    onCreated = vi.fn()
+    onOpenChange = vi.fn()
+    addUserMutation.current = { isPending: false, error: null }
+  })
+
+  afterEach(() => {
+    act(() => root.unmount())
+    container.remove()
+    vi.clearAllMocks()
+  })
+
+  it('requires a name, valid email, and eight-character password', async () => {
+    await renderModal()
+
+    expect(buttonLabelled('Add user').disabled).toBe(true)
+
+    await changeField('Name', 'Canary Writer')
+    await changeField('Email', 'not-an-email')
+    await changeField('Password', 'short')
+
+    expect(buttonLabelled('Add user').disabled).toBe(true)
+    expect(container.textContent).toContain('Enter a valid email')
+    expect(container.textContent).toContain('Password must be at least 8 characters')
+  })
+
+  it('creates a verified credential user and returns it to the admin view', async () => {
+    mockMutate.mockImplementation(
+      (_input: AddUserInput, options: { onSuccess: (user: AdminUser) => void }) => {
+        options.onSuccess(CREATED_USER)
+      }
+    )
+    await renderModal()
+    await fillRequiredFields()
+
+    await act(async () => {
+      buttonLabelled('Add user').dispatchEvent(new MouseEvent('click', { bubbles: true }))
+      await Promise.resolve()
+      await Promise.resolve()
+    })
+
+    expect(mockMutate).toHaveBeenCalledWith(
+      {
+        name: 'Canary Writer',
+        email: 'writer@synthetics.example.com',
+        password: 'canary-password',
+        role: 'user',
+        emailVerified: true,
+      },
+      { onSuccess: expect.any(Function) }
+    )
+    expect(onOpenChange).toHaveBeenCalledWith(false)
+    expect(onCreated).toHaveBeenCalledWith(CREATED_USER)
+  })
+
+  it('supports platform-admin and unverified accounts', async () => {
+    mockMutate.mockImplementation(
+      (_input: AddUserInput, options: { onSuccess: (user: AdminUser) => void }) => {
+        options.onSuccess({ ...CREATED_USER, role: 'admin' })
+      }
+    )
+    await renderModal()
+    await fillRequiredFields()
+    await changeField('Platform role', 'admin')
+    await changeField('Email status', 'unverified')
+
+    await act(async () => {
+      buttonLabelled('Add user').dispatchEvent(new MouseEvent('click', { bubbles: true }))
+      await Promise.resolve()
+      await Promise.resolve()
+    })
+
+    expect(mockMutate).toHaveBeenCalledWith(
+      expect.objectContaining({ role: 'admin', emailVerified: false }),
+      { onSuccess: expect.any(Function) }
+    )
+  })
+
+  it('shows Better Auth failures without closing the modal', async () => {
+    addUserMutation.current = {
+      isPending: false,
+      error: new Error('A user with that email already exists'),
+    }
+    await renderModal()
+
+    expect(container.textContent).toContain('A user with that email already exists')
+    expect(onOpenChange).not.toHaveBeenCalled()
+    expect(onCreated).not.toHaveBeenCalled()
+  })
+})
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
new file mode 100644
index 00000000000..8ecd99e5e57
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
@@ -0,0 +1,188 @@
+'use client'
+
+import { useState } from 'react'
+import {
+  ChipModal,
+  ChipModalBody,
+  ChipModalError,
+  ChipModalField,
+  ChipModalFooter,
+  ChipModalHeader,
+} from '@sim/emcn'
+import { getErrorMessage } from '@sim/utils/errors'
+import { isValidEmailSyntax } from '@sim/utils/string'
+import { type AddUserInput, type AdminUser, useAddUser } from '@/hooks/queries/admin-users'
+
+const ROLE_OPTIONS = [
+  { value: 'user', label: 'User' },
+  { value: 'admin', label: 'Platform admin' },
+] as const
+
+const EMAIL_STATUS_OPTIONS = [
+  { value: 'verified', label: 'Verified' },
+  { value: 'unverified', label: 'Unverified' },
+] as const
+
+interface AddUserModalProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onCreated: (user: AdminUser) => void
+}
+
+export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProps) {
+  const addUser = useAddUser()
+  const [name, setName] = useState('')
+  const [email, setEmail] = useState('')
+  const [password, setPassword] = useState('')
+  const [role, setRole] = useState<AddUserInput['role']>('user')
+  const [emailVerified, setEmailVerified] = useState(true)
+
+  const normalizedName = name.trim()
+  const normalizedEmail = email.trim().toLowerCase()
+  const nameError = name.length > 0 && !normalizedName ? 'Name is required' : undefined
+  const emailError =
+    email.length > 0 && !isValidEmailSyntax(normalizedEmail) ? 'Enter a valid email' : undefined
+  const passwordError =
+    password.length > 0 && password.length < 8
+      ? 'Password must be at least 8 characters'
+      : undefined
+  const canSubmit =
+    normalizedName.length > 0 &&
+    isValidEmailSyntax(normalizedEmail) &&
+    password.length >= 8 &&
+    !addUser.isPending
+
+  const reset = () => {
+    setName('')
+    setEmail('')
+    setPassword('')
+    setRole('user')
+    setEmailVerified(true)
+    addUser.reset()
+  }
+
+  const handleClose = () => {
+    if (addUser.isPending) return
+    reset()
+    onOpenChange(false)
+  }
+
+  const handleAddUser = () => {
+    if (!canSubmit) return
+    addUser.reset()
+    addUser.mutate(
+      {
+        name: normalizedName,
+        email: normalizedEmail,
+        password,
+        role,
+        emailVerified,
+      },
+      {
+        onSuccess: (user) => {
+          reset()
+          onOpenChange(false)
+          onCreated(user)
+        },
+      }
+    )
+  }
+
+  return (
+    <ChipModal
+      open={open}
+      onOpenChange={(next) => {
+        if (!next) handleClose()
+      }}
+      srTitle='Add user'
+    >
+      <ChipModalHeader onClose={handleClose}>Add user</ChipModalHeader>
+      <ChipModalBody>
+        <ChipModalField
+          type='input'
+          title='Name'
+          value={name}
+          onChange={(value) => {
+            setName(value)
+            addUser.reset()
+          }}
+          error={nameError}
+          placeholder='Canary Writer'
+          maxLength={100}
+          autoComplete='off'
+          disabled={addUser.isPending}
+          required
+        />
+        <ChipModalField
+          type='email'
+          title='Email'
+          value={email}
+          onChange={(value) => {
+            setEmail(value)
+            addUser.reset()
+          }}
+          error={emailError}
+          placeholder='writer@synthetics.example.com'
+          autoComplete='off'
+          disabled={addUser.isPending}
+          required
+        />
+        <ChipModalField
+          type='input'
+          inputType='password'
+          title='Password'
+          value={password}
+          onChange={(value) => {
+            setPassword(value)
+            addUser.reset()
+          }}
+          error={passwordError}
+          hint='Better Auth creates a credential account with this password.'
+          placeholder='At least 8 characters'
+          autoComplete='new-password'
+          disabled={addUser.isPending}
+          required
+        />
+        <ChipModalField
+          type='dropdown'
+          title='Platform role'
+          value={role}
+          onChange={(value) => {
+            setRole(value as AddUserInput['role'])
+            addUser.reset()
+          }}
+          options={ROLE_OPTIONS}
+          align='start'
+          disabled={addUser.isPending}
+          required
+        />
+        <ChipModalField
+          type='dropdown'
+          title='Email status'
+          value={emailVerified ? 'verified' : 'unverified'}
+          onChange={(value) => {
+            setEmailVerified(value === 'verified')
+            addUser.reset()
+          }}
+          options={EMAIL_STATUS_OPTIONS}
+          align='start'
+          hint='Verified users can sign in when email verification is required.'
+          disabled={addUser.isPending}
+          required
+        />
+        <ChipModalError>
+          {addUser.error ? getErrorMessage(addUser.error, 'Failed to add user') : null}
+        </ChipModalError>
+      </ChipModalBody>
+      <ChipModalFooter
+        onCancel={handleClose}
+        cancelDisabled={addUser.isPending}
+        primaryAction={{
+          label: addUser.isPending ? 'Adding...' : 'Add user',
+          onClick: handleAddUser,
+          disabled: !canSubmit,
+        }}
+      />
+    </ChipModal>
+  )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
index e456d250d1b..8eb7c145d76 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
@@ -6,6 +6,7 @@ import { getErrorMessage } from '@sim/utils/errors'
 import { useQueryStates } from 'nuqs'
 import type { MothershipEnvironment } from '@/lib/api/contracts'
 import { useSession } from '@/lib/auth/auth-client'
+import { AddUserModal } from '@/app/workspace/[workspaceId]/settings/components/admin/add-user-modal'
 import {
   adminParsers,
   adminUrlKeys,
@@ -72,6 +73,7 @@ export function Admin() {
   const [banReason, setBanReason] = useState('')
   const [impersonatingUserId, setImpersonatingUserId] = useState<string | null>(null)
   const [impersonationGuardError, setImpersonationGuardError] = useState<string | null>(null)
+  const [isAddUserOpen, setIsAddUserOpen] = useState(false)
 
   const {
     data: usersData,
@@ -370,7 +372,12 @@ export function Admin() {
       <div className='h-px bg-[var(--border)]' />
 
       <div className='flex flex-col gap-3'>
-        <p className='font-medium text-[var(--text-muted)] text-small'>User Management</p>
+        <div className='flex items-center justify-between gap-3'>
+          <p className='font-medium text-[var(--text-muted)] text-small'>User Management</p>
+          <Button variant='primary' onClick={() => setIsAddUserOpen(true)}>
+            Add user
+          </Button>
+        </div>
         <div className='flex gap-2'>
           <ChipInput
             icon={Search}
@@ -457,6 +464,14 @@ export function Admin() {
           )
         )}
       </div>
+      <AddUserModal
+        open={isAddUserOpen}
+        onOpenChange={setIsAddUserOpen}
+        onCreated={(user) => {
+          setSearchInput(user.email)
+          setAdminParams({ q: user.email, offset: null })
+        }}
+      />
     </SettingsPanel>
   )
 }
diff --git a/apps/sim/hooks/queries/admin-users.test.ts b/apps/sim/hooks/queries/admin-users.test.ts
new file mode 100644
index 00000000000..7f6e197f79a
--- /dev/null
+++ b/apps/sim/hooks/queries/admin-users.test.ts
@@ -0,0 +1,95 @@
+/**
+ * @vitest-environment node
+ */
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+const { mockCreateUser } = vi.hoisted(() => ({
+  mockCreateUser: vi.fn(),
+}))
+
+vi.mock('@/lib/auth/auth-client', () => ({
+  client: {
+    admin: {
+      createUser: mockCreateUser,
+    },
+  },
+}))
+
+import { addUser } from '@/hooks/queries/admin-users'
+
+describe('addUser', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  it('creates a Better Auth credential user with normalized identity fields', async () => {
+    mockCreateUser.mockResolvedValue({
+      data: {
+        user: {
+          id: 'user-1',
+          name: 'Canary Writer',
+          email: 'writer@synthetics.example.com',
+          role: 'user',
+          banned: false,
+          banReason: null,
+        },
+      },
+      error: null,
+    })
+
+    await expect(
+      addUser({
+        name: '  Canary Writer  ',
+        email: '  Writer@Synthetics.Example.com ',
+        password: 'canary-password',
+        role: 'user',
+        emailVerified: true,
+      })
+    ).resolves.toEqual({
+      id: 'user-1',
+      name: 'Canary Writer',
+      email: 'writer@synthetics.example.com',
+      role: 'user',
+      banned: false,
+      banReason: null,
+    })
+    expect(mockCreateUser).toHaveBeenCalledWith({
+      name: 'Canary Writer',
+      email: 'writer@synthetics.example.com',
+      password: 'canary-password',
+      role: 'user',
+      data: { emailVerified: true },
+    })
+  })
+
+  it('surfaces resolved Better Auth errors', async () => {
+    mockCreateUser.mockResolvedValue({
+      data: null,
+      error: { message: 'A user with that email already exists' },
+    })
+
+    await expect(
+      addUser({
+        name: 'Canary Writer',
+        email: 'writer@synthetics.example.com',
+        password: 'canary-password',
+        role: 'user',
+        emailVerified: true,
+      })
+    ).rejects.toThrow('A user with that email already exists')
+  })
+
+  it('fails fast when Better Auth omits the created user', async () => {
+    mockCreateUser.mockResolvedValue({ data: null, error: null })
+
+    await expect(
+      addUser({
+        name: 'Canary Writer',
+        email: 'writer@synthetics.example.com',
+        password: 'canary-password',
+        role: 'user',
+        emailVerified: true,
+      })
+    ).rejects.toThrow('Better Auth did not return the created user')
+  })
+})
diff --git a/apps/sim/hooks/queries/admin-users.ts b/apps/sim/hooks/queries/admin-users.ts
index afa3fa7c893..f85de408b54 100644
--- a/apps/sim/hooks/queries/admin-users.ts
+++ b/apps/sim/hooks/queries/admin-users.ts
@@ -24,6 +24,14 @@ export interface AdminUser {
   banReason: string | null
 }
 
+export interface AddUserInput {
+  name: string
+  email: string
+  password: string
+  role: 'user' | 'admin'
+  emailVerified: boolean
+}
+
 interface AdminUserListData {
   users: AdminUser[]
   total: number
@@ -47,6 +55,25 @@ function mapUser(u: {
   }
 }
 
+export async function addUser({
+  name,
+  email,
+  password,
+  role,
+  emailVerified,
+}: AddUserInput): Promise<AdminUser> {
+  const { data, error } = await client.admin.createUser({
+    name: name.trim(),
+    email: email.trim().toLowerCase(),
+    password,
+    role,
+    data: { emailVerified },
+  })
+  if (error) throw new Error(error.message ?? 'Failed to add user')
+  if (!data?.user) throw new Error('Better Auth did not return the created user')
+  return mapUser(data.user)
+}
+
 async function fetchAdminUsers(
   offset: number,
   limit: number,
@@ -127,6 +154,17 @@ export function useAdminUsers(offset: number, limit: number, searchQuery: string
   })
 }
 
+export function useAddUser() {
+  const queryClient = useQueryClient()
+  return useMutation({
+    mutationFn: addUser,
+    onSettled: () => queryClient.invalidateQueries({ queryKey: adminUserKeys.lists() }),
+    onError: (error) => {
+      logger.error('Failed to add user', error)
+    },
+  })
+}
+
 export function useSetUserRole() {
   const queryClient = useQueryClient()
   return useMutation({

From 1e2bfb23a0ce1698fbd5bcec104a4fa279e72e81 Mon Sep 17 00:00:00 2001
From: Theodore Li <theo@sim.ai>
Date: Tue, 4 Aug 2026 15:13:49 -0700
Subject: [PATCH 2/5] fix(admin): restrict created users to normal role

---
 .../components/admin/add-user-modal.test.tsx  | 14 +++++------
 .../components/admin/add-user-modal.tsx       | 23 +------------------
 apps/sim/hooks/queries/admin-users.test.ts    |  3 ---
 apps/sim/hooks/queries/admin-users.ts         |  4 +---
 4 files changed, 8 insertions(+), 36 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
index fe210c44b73..5c260c08afa 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
@@ -204,7 +204,6 @@ describe('AddUserModal', () => {
         name: 'Canary Writer',
         email: 'writer@synthetics.example.com',
         password: 'canary-password',
-        role: 'user',
         emailVerified: true,
       },
       { onSuccess: expect.any(Function) }
@@ -213,15 +212,14 @@ describe('AddUserModal', () => {
     expect(onCreated).toHaveBeenCalledWith(CREATED_USER)
   })
 
-  it('supports platform-admin and unverified accounts', async () => {
+  it('supports unverified accounts without exposing a platform-role control', async () => {
     mockMutate.mockImplementation(
       (_input: AddUserInput, options: { onSuccess: (user: AdminUser) => void }) => {
-        options.onSuccess({ ...CREATED_USER, role: 'admin' })
+        options.onSuccess(CREATED_USER)
       }
     )
     await renderModal()
     await fillRequiredFields()
-    await changeField('Platform role', 'admin')
     await changeField('Email status', 'unverified')
 
     await act(async () => {
@@ -230,10 +228,10 @@ describe('AddUserModal', () => {
       await Promise.resolve()
     })
 
-    expect(mockMutate).toHaveBeenCalledWith(
-      expect.objectContaining({ role: 'admin', emailVerified: false }),
-      { onSuccess: expect.any(Function) }
-    )
+    expect(container.querySelector('[aria-label="Platform role"]')).toBeNull()
+    expect(mockMutate).toHaveBeenCalledWith(expect.objectContaining({ emailVerified: false }), {
+      onSuccess: expect.any(Function),
+    })
   })
 
   it('shows Better Auth failures without closing the modal', async () => {
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
index 8ecd99e5e57..ac7972910ff 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
@@ -11,12 +11,7 @@ import {
 } from '@sim/emcn'
 import { getErrorMessage } from '@sim/utils/errors'
 import { isValidEmailSyntax } from '@sim/utils/string'
-import { type AddUserInput, type AdminUser, useAddUser } from '@/hooks/queries/admin-users'
-
-const ROLE_OPTIONS = [
-  { value: 'user', label: 'User' },
-  { value: 'admin', label: 'Platform admin' },
-] as const
+import { type AdminUser, useAddUser } from '@/hooks/queries/admin-users'
 
 const EMAIL_STATUS_OPTIONS = [
   { value: 'verified', label: 'Verified' },
@@ -34,7 +29,6 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
   const [name, setName] = useState('')
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
-  const [role, setRole] = useState<AddUserInput['role']>('user')
   const [emailVerified, setEmailVerified] = useState(true)
 
   const normalizedName = name.trim()
@@ -56,7 +50,6 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
     setName('')
     setEmail('')
     setPassword('')
-    setRole('user')
     setEmailVerified(true)
     addUser.reset()
   }
@@ -75,7 +68,6 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
         name: normalizedName,
         email: normalizedEmail,
         password,
-        role,
         emailVerified,
       },
       {
@@ -143,19 +135,6 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           disabled={addUser.isPending}
           required
         />
-        <ChipModalField
-          type='dropdown'
-          title='Platform role'
-          value={role}
-          onChange={(value) => {
-            setRole(value as AddUserInput['role'])
-            addUser.reset()
-          }}
-          options={ROLE_OPTIONS}
-          align='start'
-          disabled={addUser.isPending}
-          required
-        />
         <ChipModalField
           type='dropdown'
           title='Email status'
diff --git a/apps/sim/hooks/queries/admin-users.test.ts b/apps/sim/hooks/queries/admin-users.test.ts
index 7f6e197f79a..41fb1a43e10 100644
--- a/apps/sim/hooks/queries/admin-users.test.ts
+++ b/apps/sim/hooks/queries/admin-users.test.ts
@@ -42,7 +42,6 @@ describe('addUser', () => {
         name: '  Canary Writer  ',
         email: '  Writer@Synthetics.Example.com ',
         password: 'canary-password',
-        role: 'user',
         emailVerified: true,
       })
     ).resolves.toEqual({
@@ -73,7 +72,6 @@ describe('addUser', () => {
         name: 'Canary Writer',
         email: 'writer@synthetics.example.com',
         password: 'canary-password',
-        role: 'user',
         emailVerified: true,
       })
     ).rejects.toThrow('A user with that email already exists')
@@ -87,7 +85,6 @@ describe('addUser', () => {
         name: 'Canary Writer',
         email: 'writer@synthetics.example.com',
         password: 'canary-password',
-        role: 'user',
         emailVerified: true,
       })
     ).rejects.toThrow('Better Auth did not return the created user')
diff --git a/apps/sim/hooks/queries/admin-users.ts b/apps/sim/hooks/queries/admin-users.ts
index f85de408b54..c15a0465bc4 100644
--- a/apps/sim/hooks/queries/admin-users.ts
+++ b/apps/sim/hooks/queries/admin-users.ts
@@ -28,7 +28,6 @@ export interface AddUserInput {
   name: string
   email: string
   password: string
-  role: 'user' | 'admin'
   emailVerified: boolean
 }
 
@@ -59,14 +58,13 @@ export async function addUser({
   name,
   email,
   password,
-  role,
   emailVerified,
 }: AddUserInput): Promise<AdminUser> {
   const { data, error } = await client.admin.createUser({
     name: name.trim(),
     email: email.trim().toLowerCase(),
     password,
-    role,
+    role: 'user',
     data: { emailVerified },
   })
   if (error) throw new Error(error.message ?? 'Failed to add user')

From 712aeec0683556d4e7cb1bd6d1d23c66ecf77043 Mon Sep 17 00:00:00 2001
From: Theodore Li <theo@sim.ai>
Date: Tue, 4 Aug 2026 16:30:04 -0700
Subject: [PATCH 3/5] improvement(admin): refine add user action

---
 .../settings/components/admin/admin.tsx       | 176 +++++++++---------
 1 file changed, 89 insertions(+), 87 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
index 8eb7c145d76..1bb6b6fdd47 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx
@@ -1,7 +1,7 @@
 'use client'
 
 import { useEffect, useMemo, useRef, useState } from 'react'
-import { Badge, Button, ChipInput, ChipSelect, cn, Label, Search, Switch } from '@sim/emcn'
+import { Badge, Button, Chip, ChipInput, ChipSelect, cn, Label, Search, Switch } from '@sim/emcn'
 import { getErrorMessage } from '@sim/utils/errors'
 import { useQueryStates } from 'nuqs'
 import type { MothershipEnvironment } from '@/lib/api/contracts'
@@ -14,6 +14,7 @@ import {
 import { useRecentImpersonations } from '@/app/workspace/[workspaceId]/settings/components/admin/use-recent-impersonations'
 import { SettingsEmptyState } from '@/app/workspace/[workspaceId]/settings/components/settings-empty-state'
 import { SettingsPanel } from '@/app/workspace/[workspaceId]/settings/components/settings-panel'
+import { SettingsSection } from '@/app/workspace/[workspaceId]/settings/components/settings-section/settings-section'
 import {
   type AdminUser,
   useAdminUsers,
@@ -371,99 +372,100 @@ export function Admin() {
 
       <div className='h-px bg-[var(--border)]' />
 
-      <div className='flex flex-col gap-3'>
-        <div className='flex items-center justify-between gap-3'>
-          <p className='font-medium text-[var(--text-muted)] text-small'>User Management</p>
-          <Button variant='primary' onClick={() => setIsAddUserOpen(true)}>
-            Add user
-          </Button>
-        </div>
-        <div className='flex gap-2'>
-          <ChipInput
-            icon={Search}
-            value={searchInput}
-            onChange={(e) => setSearchInput(e.target.value)}
-            onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
-            placeholder='Search by email or paste a user ID...'
-            className='min-w-0 flex-1'
-          />
-          <Button variant='primary' onClick={handleSearch} disabled={usersLoading}>
-            {usersLoading ? 'Searching...' : 'Search'}
-          </Button>
-        </div>
-
-        {usersError && (
-          <p className='text-[var(--text-error)] text-small'>
-            {getErrorMessage(usersError, 'Failed to fetch users')}
-          </p>
-        )}
+      <SettingsSection
+        label='User management'
+        action={<Chip onClick={() => setIsAddUserOpen(true)}>Add user</Chip>}
+      >
+        <div className='flex flex-col gap-3'>
+          <div className='flex gap-2'>
+            <ChipInput
+              icon={Search}
+              value={searchInput}
+              onChange={(e) => setSearchInput(e.target.value)}
+              onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
+              placeholder='Search by email or paste a user ID...'
+              className='min-w-0 flex-1'
+            />
+            <Button variant='primary' onClick={handleSearch} disabled={usersLoading}>
+              {usersLoading ? 'Searching...' : 'Search'}
+            </Button>
+          </div>
+
+          {usersError && (
+            <p className='text-[var(--text-error)] text-small'>
+              {getErrorMessage(usersError, 'Failed to fetch users')}
+            </p>
+          )}
 
-        {(setUserRole.error ||
-          banUser.error ||
-          unbanUser.error ||
-          impersonateUser.error ||
-          impersonationGuardError) && (
-          <p className='text-[var(--text-error)] text-small'>
-            {impersonationGuardError ||
-              (setUserRole.error || banUser.error || unbanUser.error || impersonateUser.error)
-                ?.message ||
-              'Action failed. Please try again.'}
-          </p>
-        )}
+          {(setUserRole.error ||
+            banUser.error ||
+            unbanUser.error ||
+            impersonateUser.error ||
+            impersonationGuardError) && (
+            <p className='text-[var(--text-error)] text-small'>
+              {impersonationGuardError ||
+                (setUserRole.error || banUser.error || unbanUser.error || impersonateUser.error)
+                  ?.message ||
+                'Action failed. Please try again.'}
+            </p>
+          )}
 
-        {searchQuery.length > 0 && usersData ? (
-          <>
-            <div className='flex flex-col gap-0.5'>
-              {USER_TABLE_HEADER}
+          {searchQuery.length > 0 && usersData ? (
+            <>
+              <div className='flex flex-col gap-0.5'>
+                {USER_TABLE_HEADER}
 
-              {usersData.users.length === 0 && (
-                <SettingsEmptyState variant='inline'>No users found.</SettingsEmptyState>
-              )}
+                {usersData.users.length === 0 && (
+                  <SettingsEmptyState variant='inline'>No users found.</SettingsEmptyState>
+                )}
 
-              {usersData.users.map((u) => renderUserRow(u))}
-            </div>
+                {usersData.users.map((u) => renderUserRow(u))}
+              </div>
 
-            {totalPages > 1 && (
-              <div className='flex items-center justify-between text-[var(--text-secondary)] text-small'>
-                <span>
-                  Page {currentPage} of {totalPages} ({usersData.total} users)
-                </span>
-                <div className='flex gap-1'>
-                  <Button
-                    variant='active'
-                    className='h-[28px] px-2 text-caption'
-                    onClick={() =>
-                      setAdminParams((prev) => ({
-                        offset: Math.max(0, prev.offset - PAGE_SIZE),
-                      }))
-                    }
-                    disabled={usersOffset === 0 || usersLoading}
-                  >
-                    Previous
-                  </Button>
-                  <Button
-                    variant='active'
-                    className='h-[28px] px-2 text-caption'
-                    onClick={() => setAdminParams((prev) => ({ offset: prev.offset + PAGE_SIZE }))}
-                    disabled={usersOffset + PAGE_SIZE >= (usersData?.total ?? 0) || usersLoading}
-                  >
-                    Next
-                  </Button>
+              {totalPages > 1 && (
+                <div className='flex items-center justify-between text-[var(--text-secondary)] text-small'>
+                  <span>
+                    Page {currentPage} of {totalPages} ({usersData.total} users)
+                  </span>
+                  <div className='flex gap-1'>
+                    <Button
+                      variant='active'
+                      className='h-[28px] px-2 text-caption'
+                      onClick={() =>
+                        setAdminParams((prev) => ({
+                          offset: Math.max(0, prev.offset - PAGE_SIZE),
+                        }))
+                      }
+                      disabled={usersOffset === 0 || usersLoading}
+                    >
+                      Previous
+                    </Button>
+                    <Button
+                      variant='active'
+                      className='h-[28px] px-2 text-caption'
+                      onClick={() =>
+                        setAdminParams((prev) => ({ offset: prev.offset + PAGE_SIZE }))
+                      }
+                      disabled={usersOffset + PAGE_SIZE >= (usersData?.total ?? 0) || usersLoading}
+                    >
+                      Next
+                    </Button>
+                  </div>
                 </div>
+              )}
+            </>
+          ) : (
+            searchQuery.length === 0 &&
+            recentUsers &&
+            recentUsers.length > 0 && (
+              <div className='flex flex-col gap-0.5'>
+                {USER_TABLE_HEADER}
+                {recentUsers.map((u) => renderUserRow(u))}
               </div>
-            )}
-          </>
-        ) : (
-          searchQuery.length === 0 &&
-          recentUsers &&
-          recentUsers.length > 0 && (
-            <div className='flex flex-col gap-0.5'>
-              {USER_TABLE_HEADER}
-              {recentUsers.map((u) => renderUserRow(u))}
-            </div>
-          )
-        )}
-      </div>
+            )
+          )}
+        </div>
+      </SettingsSection>
       <AddUserModal
         open={isAddUserOpen}
         onOpenChange={setIsAddUserOpen}

From 45d8918e9694513b55a53d874905eacd923f5feb Mon Sep 17 00:00:00 2001
From: Theodore Li <theo@sim.ai>
Date: Tue, 4 Aug 2026 16:30:19 -0700
Subject: [PATCH 4/5] fix(admin): prevent duplicate user creation

---
 .../components/admin/add-user-modal.test.tsx     | 16 +++++++++++++++-
 .../settings/components/admin/add-user-modal.tsx | 11 ++++++++---
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
index 5c260c08afa..796d64babf6 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
@@ -206,12 +206,25 @@ describe('AddUserModal', () => {
         password: 'canary-password',
         emailVerified: true,
       },
-      { onSuccess: expect.any(Function) }
+      { onSuccess: expect.any(Function), onSettled: expect.any(Function) }
     )
     expect(onOpenChange).toHaveBeenCalledWith(false)
     expect(onCreated).toHaveBeenCalledWith(CREATED_USER)
   })
 
+  it('ignores repeated submissions before the pending state renders', async () => {
+    await renderModal()
+    await fillRequiredFields()
+
+    await act(async () => {
+      const addUserButton = buttonLabelled('Add user')
+      addUserButton.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+      addUserButton.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+    })
+
+    expect(mockMutate).toHaveBeenCalledTimes(1)
+  })
+
   it('supports unverified accounts without exposing a platform-role control', async () => {
     mockMutate.mockImplementation(
       (_input: AddUserInput, options: { onSuccess: (user: AdminUser) => void }) => {
@@ -231,6 +244,7 @@ describe('AddUserModal', () => {
     expect(container.querySelector('[aria-label="Platform role"]')).toBeNull()
     expect(mockMutate).toHaveBeenCalledWith(expect.objectContaining({ emailVerified: false }), {
       onSuccess: expect.any(Function),
+      onSettled: expect.any(Function),
     })
   })
 
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
index ac7972910ff..204f0000d00 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { useState } from 'react'
+import { useRef, useState } from 'react'
 import {
   ChipModal,
   ChipModalBody,
@@ -26,6 +26,7 @@ interface AddUserModalProps {
 
 export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProps) {
   const addUser = useAddUser()
+  const submissionInFlightRef = useRef(false)
   const [name, setName] = useState('')
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
@@ -55,13 +56,14 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
   }
 
   const handleClose = () => {
-    if (addUser.isPending) return
+    if (submissionInFlightRef.current || addUser.isPending) return
     reset()
     onOpenChange(false)
   }
 
   const handleAddUser = () => {
-    if (!canSubmit) return
+    if (!canSubmit || submissionInFlightRef.current) return
+    submissionInFlightRef.current = true
     addUser.reset()
     addUser.mutate(
       {
@@ -76,6 +78,9 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           onOpenChange(false)
           onCreated(user)
         },
+        onSettled: () => {
+          submissionInFlightRef.current = false
+        },
       }
     )
   }

From 44dfe92f1442b754b7ea4b4694f05792c35460a4 Mon Sep 17 00:00:00 2001
From: Theodore Li <theo@sim.ai>
Date: Tue, 4 Aug 2026 16:39:16 -0700
Subject: [PATCH 5/5] fix(admin): reflect immediate submission state

---
 .../components/admin/add-user-modal.test.tsx  | 23 ++++++++++++++++--
 .../components/admin/add-user-modal.tsx       | 24 ++++++++++++-------
 .../src/components/chip-modal/chip-modal.tsx  | 13 +++++++++-
 3 files changed, 48 insertions(+), 12 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
index 796d64babf6..71883816a30 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.test.tsx
@@ -21,19 +21,36 @@ const { addUserMutation, mockMutate, mockReset } = vi.hoisted(() => ({
 vi.mock('@sim/emcn', () => ({
   ChipModal: ({ open, children }: { open: boolean; children: ReactNode }) =>
     open ? <div role='dialog'>{children}</div> : null,
-  ChipModalHeader: ({ children }: { children: ReactNode }) => <h2>{children}</h2>,
+  ChipModalHeader: ({
+    children,
+    onClose,
+    closeDisabled,
+  }: {
+    children: ReactNode
+    onClose: () => void
+    closeDisabled?: boolean
+  }) => (
+    <header>
+      <h2>{children}</h2>
+      <button type='button' onClick={onClose} disabled={closeDisabled}>
+        Close
+      </button>
+    </header>
+  ),
   ChipModalBody: ({ children }: { children: ReactNode }) => <div>{children}</div>,
   ChipModalError: ({ children }: { children: ReactNode }) =>
     children ? <div role='alert'>{children}</div> : null,
   ChipModalFooter: ({
     onCancel,
+    cancelDisabled,
     primaryAction,
   }: {
     onCancel: () => void
+    cancelDisabled?: boolean
     primaryAction: { label: ReactNode; onClick: () => void; disabled?: boolean }
   }) => (
     <footer>
-      <button type='button' onClick={onCancel}>
+      <button type='button' onClick={onCancel} disabled={cancelDisabled}>
         Cancel
       </button>
       <button type='button' disabled={primaryAction.disabled} onClick={primaryAction.onClick}>
@@ -223,6 +240,8 @@ describe('AddUserModal', () => {
     })
 
     expect(mockMutate).toHaveBeenCalledTimes(1)
+    expect(buttonLabelled('Close').disabled).toBe(true)
+    expect(buttonLabelled('Cancel').disabled).toBe(true)
   })
 
   it('supports unverified accounts without exposing a platform-role control', async () => {
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
index 204f0000d00..89ebb362a34 100644
--- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/add-user-modal.tsx
@@ -27,6 +27,7 @@ interface AddUserModalProps {
 export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProps) {
   const addUser = useAddUser()
   const submissionInFlightRef = useRef(false)
+  const [isSubmitting, setIsSubmitting] = useState(false)
   const [name, setName] = useState('')
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
@@ -41,11 +42,12 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
     password.length > 0 && password.length < 8
       ? 'Password must be at least 8 characters'
       : undefined
+  const isSubmissionPending = isSubmitting || addUser.isPending
   const canSubmit =
     normalizedName.length > 0 &&
     isValidEmailSyntax(normalizedEmail) &&
     password.length >= 8 &&
-    !addUser.isPending
+    !isSubmissionPending
 
   const reset = () => {
     setName('')
@@ -56,7 +58,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
   }
 
   const handleClose = () => {
-    if (submissionInFlightRef.current || addUser.isPending) return
+    if (submissionInFlightRef.current || isSubmissionPending) return
     reset()
     onOpenChange(false)
   }
@@ -64,6 +66,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
   const handleAddUser = () => {
     if (!canSubmit || submissionInFlightRef.current) return
     submissionInFlightRef.current = true
+    setIsSubmitting(true)
     addUser.reset()
     addUser.mutate(
       {
@@ -80,6 +83,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
         },
         onSettled: () => {
           submissionInFlightRef.current = false
+          setIsSubmitting(false)
         },
       }
     )
@@ -93,7 +97,9 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
       }}
       srTitle='Add user'
     >
-      <ChipModalHeader onClose={handleClose}>Add user</ChipModalHeader>
+      <ChipModalHeader onClose={handleClose} closeDisabled={isSubmissionPending}>
+        Add user
+      </ChipModalHeader>
       <ChipModalBody>
         <ChipModalField
           type='input'
@@ -107,7 +113,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           placeholder='Canary Writer'
           maxLength={100}
           autoComplete='off'
-          disabled={addUser.isPending}
+          disabled={isSubmissionPending}
           required
         />
         <ChipModalField
@@ -121,7 +127,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           error={emailError}
           placeholder='writer@synthetics.example.com'
           autoComplete='off'
-          disabled={addUser.isPending}
+          disabled={isSubmissionPending}
           required
         />
         <ChipModalField
@@ -137,7 +143,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           hint='Better Auth creates a credential account with this password.'
           placeholder='At least 8 characters'
           autoComplete='new-password'
-          disabled={addUser.isPending}
+          disabled={isSubmissionPending}
           required
         />
         <ChipModalField
@@ -151,7 +157,7 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
           options={EMAIL_STATUS_OPTIONS}
           align='start'
           hint='Verified users can sign in when email verification is required.'
-          disabled={addUser.isPending}
+          disabled={isSubmissionPending}
           required
         />
         <ChipModalError>
@@ -160,9 +166,9 @@ export function AddUserModal({ open, onOpenChange, onCreated }: AddUserModalProp
       </ChipModalBody>
       <ChipModalFooter
         onCancel={handleClose}
-        cancelDisabled={addUser.isPending}
+        cancelDisabled={isSubmissionPending}
         primaryAction={{
-          label: addUser.isPending ? 'Adding...' : 'Add user',
+          label: isSubmissionPending ? 'Adding...' : 'Add user',
           onClick: handleAddUser,
           disabled: !canSubmit,
         }}
diff --git a/packages/emcn/src/components/chip-modal/chip-modal.tsx b/packages/emcn/src/components/chip-modal/chip-modal.tsx
index e0d2da89f4b..85256fc2d46 100644
--- a/packages/emcn/src/components/chip-modal/chip-modal.tsx
+++ b/packages/emcn/src/components/chip-modal/chip-modal.tsx
@@ -154,6 +154,8 @@ export interface ChipModalHeaderProps extends React.HTMLAttributes<HTMLDivElemen
   icon?: React.ComponentType<{ className?: string }> | null
   /** Invoked when the trailing close button is activated. Always rendered. */
   onClose: () => void
+  /** Disables the trailing close button while an operation is in flight. */
+  closeDisabled?: boolean
   /** Accessible label for the close button. */
   closeAriaLabel?: string
 }
@@ -164,7 +166,15 @@ export interface ChipModalHeaderProps extends React.HTMLAttributes<HTMLDivElemen
  */
 const ChipModalHeader = React.forwardRef<HTMLDivElement, ChipModalHeaderProps>(
   (
-    { className, children, icon: Icon = null, onClose, closeAriaLabel = 'Close', ...props },
+    {
+      className,
+      children,
+      icon: Icon = null,
+      onClose,
+      closeDisabled = false,
+      closeAriaLabel = 'Close',
+      ...props
+    },
     ref
   ) => (
     <div ref={ref} className={cn('flex flex-col', className)} {...props}>
@@ -177,6 +187,7 @@ const ChipModalHeader = React.forwardRef<HTMLDivElement, ChipModalHeaderProps>(
           type='button'
           variant='ghost'
           onClick={onClose}
+          disabled={closeDisabled}
           className='relative size-[14px] flex-shrink-0 p-0 before:absolute before:inset-[-14px] before:content-[""]'
         >
           <X className='size-[14px] text-[var(--text-icon)]' />