fix(search): align account actions and simplify tool rows

Author: waleedlatif1

apps/docs/public/static/search/assistant-action-review.png

@@ -1,7 +1,8 @@
 'use client'
 
 import { useState } from 'react'
-import { Chip, ChipConfirmModal, ChipModalError } from '@sim/emcn'
+import { ChipConfirmModal, ChipModalError } from '@sim/emcn'
+import { type SettingsAction, SettingsActionChips } from '@/components/settings/settings-header'
 import type { ViewerSearchSourceAccount } from '@/lib/api/contracts/knowledge/connectors'
 import { useDisconnectPersonalOrganizationAccount } from '@/hooks/queries/organization-accounts'
 
@@ -32,48 +33,57 @@ export function AccountConnectionActions({
   const disconnect = useDisconnectPersonalOrganizationAccount(organizationId)
   const [confirming, setConfirming] = useState(false)
   const pending = connectionPending || disconnect.isPending
+  const actions: SettingsAction[] = []
+  if (account) {
+    actions.push({
+      id: 'reconnect',
+      text: 'Reconnect',
+      disabled: pending || !canReconnect,
+      onSelect: onReconnect,
+    })
+  }
+  if (onConnect) {
+    actions.push({
+      id: 'connect',
+      text: connectLabel,
+      disabled: pending || !canConnect,
+      onSelect: onConnect,
+    })
+  }
+  if (account) {
+    actions.push({
+      id: 'delete',
+      text: 'Disconnect',
+      textTone: 'error',
+      disabled: pending,
+      onSelect: () => {
+        disconnect.reset()
+        setConfirming(true)
+      },
+    })
+  }
   return (
     <>
+      <SettingsActionChips actions={actions} />
       {account && (
-        <Chip disabled={pending || !canReconnect} onClick={onReconnect}>
-          Reconnect
-        </Chip>
-      )}
-      {onConnect && (
-        <Chip disabled={pending || !canConnect} onClick={onConnect}>
-          {connectLabel}
-        </Chip>
-      )}
-      {account && (
-        <>
-          <Chip
-            disabled={pending}
-            onClick={() => {
-              disconnect.reset()
-              setConfirming(true)
-            }}
-          >
-            Disconnect
-          </Chip>
-          <ChipConfirmModal
-            open={confirming}
-            onOpenChange={(open) => {
-              if (!disconnect.isPending) setConfirming(open)
-            }}
-            title={`Disconnect ${integrationName}`}
-            text={`Disconnect ${account.displayName} from all ${integrationName} connections in this organization. Workflows using this account will also lose access. You can reconnect later.`}
-            confirm={{
-              label: 'Disconnect',
-              pendingLabel: 'Disconnecting',
-              pending: disconnect.isPending,
-              disabled: disconnect.isPending,
-              onClick: () =>
-                disconnect.mutate(account.credentialId, { onSuccess: () => setConfirming(false) }),
-            }}
-          >
-            <ChipModalError>{disconnect.error?.message}</ChipModalError>
-          </ChipConfirmModal>
-        </>
+        <ChipConfirmModal
+          open={confirming}
+          onOpenChange={(open) => {
+            if (!disconnect.isPending) setConfirming(open)
+          }}
+          title={`Disconnect ${integrationName}`}
+          text={`Disconnect ${account.displayName} from all ${integrationName} connections in this organization. Workflows using this account will also lose access. You can reconnect later.`}
+          confirm={{
+            label: 'Disconnect',
+            pendingLabel: 'Disconnecting',
+            pending: disconnect.isPending,
+            disabled: disconnect.isPending,
+            onClick: () =>
+              disconnect.mutate(account.credentialId, { onSuccess: () => setConfirming(false) }),
+          }}
+        >
+          <ChipModalError>{disconnect.error?.message}</ChipModalError>
+        </ChipConfirmModal>
       )}
     </>
   )

apps/docs/public/static/search/organization-search.png

@@ -206,31 +206,29 @@ function ToolPermissionGroup({
         />
       }
     >
-      <div className='divide-y divide-[var(--border)]'>
-        {visible.map((tool) => (
-          <div
-            key={tool.toolId}
-            className='flex flex-col items-start gap-3 py-3 sm:flex-row sm:items-center sm:justify-between'
-          >
-            <div className='min-w-0 flex-1'>
-              <Tooltip.Root>
-                <Tooltip.Trigger asChild>
-                  <span className='text-[var(--text-body)] text-small'>{tool.name}</span>
-                </Tooltip.Trigger>
-                <Tooltip.Content>{tool.description}</Tooltip.Content>
-              </Tooltip.Root>
-            </div>
-            <ChipSwitch
-              className='max-w-full shrink-0'
-              options={options}
-              value={tool.policy}
-              disabled={pending}
-              aria-label={`${tool.name} permission`}
-              onChange={(policy) => onChange({ kind: 'tool', toolId: tool.toolId, policy })}
-            />
+      {visible.map((tool) => (
+        <div
+          key={tool.toolId}
+          className='flex flex-col items-start gap-3 py-3 sm:flex-row sm:items-center sm:justify-between'
+        >
+          <div className='min-w-0 flex-1'>
+            <Tooltip.Root>
+              <Tooltip.Trigger asChild>
+                <span className='text-[var(--text-body)] text-small'>{tool.name}</span>
+              </Tooltip.Trigger>
+              <Tooltip.Content>{tool.description}</Tooltip.Content>
+            </Tooltip.Root>
           </div>
-        ))}
-      </div>
+          <ChipSwitch
+            className='max-w-full shrink-0'
+            options={options}
+            value={tool.policy}
+            disabled={pending}
+            aria-label={`${tool.name} permission`}
+            onChange={(policy) => onChange({ kind: 'tool', toolId: tool.toolId, policy })}
+          />
+        </div>
+      ))}
       {!visible.length && (
         <SettingsEmptyState variant='inline'>No matching tools</SettingsEmptyState>
       )}

apps/sim/app/o/[organizationId]/integrations/account-connection-actions.tsx

@@ -11,7 +11,7 @@ import { jsonResponse } from '@sim/testing/helpers/http'
 import { generateId } from '@sim/utils/id'
 import { eq } from 'drizzle-orm'
 import { afterAll, afterEach, beforeAll, beforeEach, describe, expect, it, vi } from 'vitest'
-import { getPublicCredentialGroupEnrollment } from '@/lib/credential-groups/enrollments'
+import { getAuthorizedPublicCredentialGroupEnrollment } from '@/lib/credential-groups/enrollments'
 import type { CredentialGroupProviderPolicy } from '@/lib/credential-groups/provider-adapter'
 import { getCredentialGroupProviderAdapter } from '@/lib/credential-groups/provider-registry'
 import {
@@ -30,6 +30,14 @@ const groupId = generateId()
 const enrollmentId = generateId()
 const credentialId = generateId()
 const invitationToken = generateId()
+const enrollmentIdentity = {
+  userId,
+  enrollmentId,
+  credentialGroupId: groupId,
+  organizationId,
+  email: `${userId}@example.test`,
+  invitationTokenHash: sha256Hex(invitationToken),
+}
 const instanceUrl = 'https://managed-destination-fixture.my.salesforce.com'
 let policy: CredentialGroupProviderPolicy
 let accessToken: string
@@ -212,7 +220,7 @@ describe('managed Salesforce destination resolution', () => {
 
 describe('managed enrollment scope status', () => {
   it('keeps a fully granted account connected when only its stored scope fingerprint differs', async () => {
-    const enrollment = await getPublicCredentialGroupEnrollment(invitationToken)
+    const enrollment = await getAuthorizedPublicCredentialGroupEnrollment(enrollmentIdentity)
     expect(enrollment?.options[0]?.connections[0]?.status).toBe('connected')
   })
 
@@ -222,7 +230,7 @@ describe('managed enrollment scope status', () => {
       .update(credential)
       .set({ grantedScopes: ['api'] })
       .where(eq(credential.id, credentialId))
-    const enrollment = await getPublicCredentialGroupEnrollment(invitationToken)
+    const enrollment = await getAuthorizedPublicCredentialGroupEnrollment(enrollmentIdentity)
     expect(enrollment?.options[0]?.connections[0]?.status).toBe('needs_reauth')
     await expect(resolve()).resolves.toMatchObject({ instanceUrl })
   })

apps/sim/app/o/[organizationId]/integrations/accounts/[credentialId]/tool-permissions.tsx

@@ -876,6 +876,8 @@ try {
       const editedBody = 'Please confirm the owner by Friday.\nThank you.'
       await plain.getByRole('textbox', { name: 'Message', exact: true }).fill(editedBody)
       await expect(plain.getByRole('textbox', { name: 'To', exact: true })).toHaveCount(0)
+      await plain.scrollIntoViewIfNeeded()
+      await capture('email-review-edit')
       await plain.getByRole('button', { name: 'Done', exact: true }).click()
       await expect(plain.getByRole('region', { name: 'Message preview', exact: true })).toHaveText(
         editedBody
@@ -1097,7 +1099,12 @@ try {
         .nth(0)
         .getByRole('textbox', { name: 'Summary', exact: true })
         .fill('Publish the reviewed launch checklist')
+      await reviewCards.nth(0).scrollIntoViewIfNeeded()
+      await capture('action-review-edit-mobile')
+      await page.setViewportSize({ width: 1440, height: 1000 })
+      await reviewCards.nth(0).scrollIntoViewIfNeeded()
       await capture('action-review-edit')
+      await page.setViewportSize({ width: 390, height: 844 })
       await reviewCards.nth(0).getByRole('button', { name: 'Done', exact: true }).click()
       await expect(
         reviewCards.nth(0).getByText('Publish the reviewed launch checklist', { exact: true })

apps/sim/lib/credentials/managed-oauth.integration.ts

@@ -4193,7 +4193,6 @@
   "apps/sim/lib/core/async-jobs/index.ts#getCurrentBackendType",
   "apps/sim/lib/core/async-jobs/index.ts#resetJobQueueCache",
   "apps/sim/lib/core/async-jobs/types.ts#AsyncExecutionCorrelationSource",
-  "apps/sim/lib/core/config/env-flags.ts#isEnterpriseEnabled",
   "apps/sim/lib/core/config/feature-flags.ts#FeatureFlagRule",
   "apps/sim/lib/core/http/classes.ts#DELIVERY_CLASSES",
   "apps/sim/lib/core/http/classes.ts#DeliveryClass",