fix(search): revalidate recent sources and polish state transitions

Author: waleedlatif1

apps/sim/app/o/[organizationId]/components/organization-sidebar/components/organization-header/organization-header.tsx

@@ -145,9 +145,7 @@ export function OrganizationHeader({
                     {logo}
                   </DropdownMenuItem>
                 </Tooltip.Trigger>
-                <Tooltip.Content>
-                  {isUploadingLogo ? 'Uploading...' : 'Change logo'}
-                </Tooltip.Content>
+                <Tooltip.Content>{isUploadingLogo ? 'Uploading' : 'Change logo'}</Tooltip.Content>
               </Tooltip.Root>
             ) : (
               logo

apps/sim/app/o/[organizationId]/components/search-landing-history.tsx

@@ -24,8 +24,9 @@ export function SearchLandingHistory({
   const history = useSearchHistory(organizationId)
   const clear = useClearSearchHistory(organizationId, userId)
   const [selection, setSelection] = useState<'sources' | 'queries' | null>(null)
-  const sources = history.data?.sources.slice(0, 5) ?? []
-  const queries = history.data?.queries.slice(0, 5) ?? []
+  const data = history.isError ? undefined : history.data
+  const sources = data?.sources.slice(0, 5) ?? []
+  const queries = data?.queries.slice(0, 5) ?? []
   const selected = selection ?? (sources.length > 0 ? 'sources' : 'queries')
   return (
     <div className={cn('w-full min-w-0', inter.className)}>
@@ -58,27 +59,46 @@ export function SearchLandingHistory({
               Clear history
             </Chip>
           </div>
-          {selected === 'sources' ? (
-            sources.length > 0 ? (
-              sources.map((source) => <SourceCard key={source.url} source={source} dense />)
-            ) : (
-              <p className='px-2 py-2 text-[var(--text-tertiary)] text-small'>
-                Sources you open will appear here.
-              </p>
-            )
-          ) : queries.length > 0 ? (
-            <div className='flex flex-col gap-1'>
-              {queries.map(({ query }) => (
-                <Chip key={query} fullWidth leftIcon={Clock} onClick={() => onSearch(query)}>
-                  {query}
-                </Chip>
-              ))}
+          <div className='grid grid-cols-1'>
+            <div
+              className={cn(
+                'col-start-1 row-start-1 min-w-0',
+                selected !== 'sources' && 'invisible'
+              )}
+              inert={selected !== 'sources'}
+              aria-hidden={selected !== 'sources'}
+            >
+              {sources.length > 0 ? (
+                sources.map((source) => <SourceCard key={source.url} source={source} dense />)
+              ) : (
+                <p className='px-2 py-2 text-[var(--text-tertiary)] text-small'>
+                  Sources you open will appear here.
+                </p>
+              )}
+            </div>
+            <div
+              className={cn(
+                'col-start-1 row-start-1 min-w-0',
+                selected !== 'queries' && 'invisible'
+              )}
+              inert={selected !== 'queries'}
+              aria-hidden={selected !== 'queries'}
+            >
+              {queries.length > 0 ? (
+                queries.map(({ query }) => (
+                  <div key={query} className='py-1'>
+                    <Chip fullWidth leftIcon={Clock} onClick={() => onSearch(query)}>
+                      {query}
+                    </Chip>
+                  </div>
+                ))
+              ) : (
+                <p className='px-2 py-2 text-[var(--text-tertiary)] text-small'>
+                  Your recent searches will appear here.
+                </p>
+              )}
             </div>
-          ) : (
-            <p className='px-2 py-2 text-[var(--text-tertiary)] text-small'>
-              Your recent searches will appear here.
-            </p>
-          )}
+          </div>
         </section>
       )}
       {history.isError && (

apps/sim/app/o/[organizationId]/integrations/disconnect-account-menu.tsx

@@ -59,7 +59,7 @@ export function DisconnectAccountMenu({
         text={`Disconnect ${selected ? accountLabel(selected) : integrationName} from all ${integrationName} connections in this organization. Workflows using this account will also lose access. You can reconnect later.`}
         confirm={{
           label: 'Disconnect',
-          pendingLabel: 'Disconnecting…',
+          pendingLabel: 'Disconnecting',
           pending: disconnect.isPending,
           disabled: disconnect.isPending,
           onClick: () => {

apps/sim/app/o/[organizationId]/integrations/github-member-integration.tsx

@@ -46,7 +46,7 @@ export function GitHubMemberIntegration({
   const description = account
     ? `${accounts.map((entry) => entry.displayName).join(', ')} · ${account.status === 'needs_reauth' ? 'Reconnect required' : 'Connected'}`
     : loading
-      ? 'Loading connection…'
+      ? 'Loading connection'
       : failed
         ? 'Could not load connection'
         : option
@@ -68,7 +68,7 @@ export function GitHubMemberIntegration({
           />
           {failed ? (
             <Chip disabled={inventory.isFetching} onClick={() => void inventory.refetch()}>
-              {inventory.isFetching ? 'Retrying…' : 'Retry'}
+              {inventory.isFetching ? 'Retrying' : 'Retry'}
             </Chip>
           ) : account?.status === 'needs_reauth' && option?.id === account.optionId ? (
             <Chip

apps/sim/app/o/[organizationId]/integrations/integrations.test.tsx

@@ -766,7 +766,7 @@ describe('grouped member integrations', () => {
       expect(mocks.nextPage).toHaveBeenCalledOnce()
       queryOverrides = { hasNextPage: true, isFetchingNextPage: true, isFetching: true }
       await render()
-      expect(buttons('Checking…')[0]).toBeDisabled()
+      expect(buttons('Checking')[0]).toBeDisabled()
       rows = [
         ...rows,
         { ...memberSource, connectorId: 'older-source', viewerMembership: membership },

apps/sim/app/o/[organizationId]/integrations/live-member-integrations.tsx

@@ -65,7 +65,7 @@ export function LiveMemberIntegrations({ organizationId, search }: LiveMemberInt
       />
     )
   if (!inventory.data || !policies.data || !secrets.data)
-    return <SettingsEmptyState variant='inline'>Loading your connections…</SettingsEmptyState>
+    return <SettingsEmptyState variant='inline'>Loading your connections</SettingsEmptyState>
   const data = inventory.data
   const approvals = new Map(policies.data.map((policy) => [policy.connectorType, policy]))
   const group = data.credentialGroup
@@ -210,7 +210,7 @@ export function LiveMemberIntegrations({ organizationId, search }: LiveMemberInt
                       connect.variables.optionId === option?.id) ||
                       ('mcpServerId' in connect.variables &&
                         connect.variables.mcpServerId === server?.id))
-                      ? 'Connecting…'
+                      ? 'Connecting'
                       : accounts.length
                         ? 'Add account'
                         : 'Connect'}

apps/sim/app/o/[organizationId]/integrations/member-integration-row.tsx

@@ -116,7 +116,7 @@ export function MemberIntegrationRow({
   function description() {
     if (!configured) return waiting ? 'Finish connecting in the other tab' : 'Not connected'
     if (hasLoadError) return 'Could not load connection'
-    if (sources.isPending) return 'Loading connection…'
+    if (sources.isPending) return 'Loading connection'
     if (target) {
       if (waiting) return 'Finish connecting in the other tab'
       if (target.viewerMembership === 'needs_reauth') return 'Reconnect your account'
@@ -183,7 +183,7 @@ export function MemberIntegrationRow({
           )}
           {hasLoadError && (
             <Chip disabled={sources.isFetching} onClick={() => void sources.refetch()}>
-              {sources.isFetching ? 'Retrying…' : 'Retry'}
+              {sources.isFetching ? 'Retrying' : 'Retry'}
             </Chip>
           )}
           {canCheckConnections && (
@@ -193,7 +193,7 @@ export function MemberIntegrationRow({
               onClick={() => void sources.fetchNextPage({ cancelRefetch: false })}
             >
               {sources.isFetchingNextPage
-                ? 'Checking…'
+                ? 'Checking'
                 : sources.isFetchNextPageError
                   ? 'Retry'
                   : 'Check connections'}

apps/sim/app/o/[organizationId]/integrations/member-integrations-list.tsx

@@ -127,7 +127,7 @@ export function MemberIntegrationsList({
           </>
         ) : overview.isPending || integrations.isPending ? (
           <>
-            <SettingsEmptyState variant='inline'>Loading integrations…</SettingsEmptyState>
+            <SettingsEmptyState variant='inline'>Loading integrations</SettingsEmptyState>
             {githubRow}
           </>
         ) : (
@@ -178,7 +178,7 @@ export function MemberIntegrationsList({
                 <SettingsEmptyState variant='inline'>
                   {!availability.isIntegrationAvailabilityReady ||
                   (approved.has('slack') && 'slack'.includes(query) && slackInventory.isPending)
-                    ? 'Loading integrations…'
+                    ? 'Loading integrations'
                     : search
                       ? 'No matching integrations.'
                       : 'No integrations are available to connect.'}

apps/sim/app/o/[organizationId]/integrations/slack-search-actions.tsx

@@ -37,11 +37,11 @@ export function SlackSearchActions({ organizationId, token, userId }: SlackSearc
             disabled={retry.isPending}
             onClick={() => retry.mutate({ token })}
           >
-            {retry.isPending ? 'Queuing…' : 'Retry question in Slack'}
+            {retry.isPending ? 'Queuing' : 'Retry question in Slack'}
           </Chip>
         ) : (
           <Chip disabled={status.isFetching} onClick={() => void status.refetch()}>
-            {status.isFetching ? 'Checking…' : 'Check connection'}
+            {status.isFetching ? 'Checking' : 'Check connection'}
           </Chip>
         ))}
       <ChipLink

apps/sim/app/o/[organizationId]/providers/organization-provider.test.tsx

@@ -3,6 +3,7 @@
  */
 import { act } from 'react'
 import { authClientMock, authClientMockFns } from '@sim/testing/mocks/auth-client.mock'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { createRoot, type Root } from 'react-dom/client'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -39,8 +40,10 @@ function ScimReader() {
 
 let host: HTMLDivElement
 let root: Root
+let client: QueryClient
 
 beforeEach(() => {
+  client = new QueryClient()
   resetDeploymentShape()
   host = document.createElement('div')
   document.body.appendChild(host)
@@ -49,6 +52,7 @@ beforeEach(() => {
 
 afterEach(() => {
   act(() => root.unmount())
+  client.clear()
   host.remove()
 })
 
@@ -69,9 +73,11 @@ describe('OrganizationProvider', () => {
 
     act(() =>
       root.render(
-        <OrganizationProvider context={context}>
-          <ScimReader />
-        </OrganizationProvider>
+        <QueryClientProvider client={client}>
+          <OrganizationProvider context={context}>
+            <ScimReader />
+          </OrganizationProvider>
+        </QueryClientProvider>
       )
     )