fix(mothership): adapt editable panels to native resource events

Author: Bill Leoutsakos

apps/sim/app/workspace/[workspaceId]/home/components/chat-resource-panel.tsx

@@ -1,8 +1,8 @@
 'use client'
 
 import { lazy, type ReactNode, Suspense, useCallback } from 'react'
-import { UnsavedChangesModal } from '@/app/workspace/[workspaceId]/components/credential-detail'
 import type { WorkspaceSearchFilters } from '@/lib/api/contracts/knowledge'
+import { UnsavedChangesModal } from '@/app/workspace/[workspaceId]/components/credential-detail'
 import { ChatPanelLayout } from '@/app/workspace/[workspaceId]/home/components/chat-panel-layout'
 import { MothershipResourcesProvider } from '@/app/workspace/[workspaceId]/home/components/mothership-resources-context'
 import { useBrowserTabResources } from '@/app/workspace/[workspaceId]/home/hooks/use-browser-tab-resources'

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/add-resource-dropdown/available-resources.ts

@@ -12,13 +12,13 @@ import { formatDate } from '@/app/workspace/[workspaceId]/logs/utils'
 import { useFeatureFlag } from '@/app/workspace/[workspaceId]/providers/feature-flags-provider'
 import { listIntegrationsByPopularity } from '@/blocks/integration-matcher'
 import { useCustomTools } from '@/hooks/queries/custom-tools'
-import { useMcpServers } from '@/hooks/queries/mcp'
-import { useSkills } from '@/hooks/queries/skills'
 import { useWorkspaceDashboard } from '@/hooks/queries/dashboards'
 import { useFolders } from '@/hooks/queries/folders'
 import { useKnowledgeBasesQuery } from '@/hooks/queries/kb/knowledge'
 import { useLogsList } from '@/hooks/queries/logs'
+import { useMcpServers } from '@/hooks/queries/mcp'
 import { useMothershipChats } from '@/hooks/queries/mothership-chats'
+import { useSkills } from '@/hooks/queries/skills'
 import { useTablesList } from '@/hooks/queries/tables'
 import { useWorkflows } from '@/hooks/queries/workflows'
 import { useWorkspaceFileFolders } from '@/hooks/queries/workspace-file-folders'
@@ -159,7 +159,8 @@ export function useAvailableResources(
     { enabled: enabled && Boolean(workspaceId) }
   )
   const skillsEnabled = enabled && Boolean(workspaceId) && !excludeTypes?.includes('skill')
-  const customToolsEnabled = enabled && Boolean(workspaceId) && !excludeTypes?.includes('custom_tool')
+  const customToolsEnabled =
+    enabled && Boolean(workspaceId) && !excludeTypes?.includes('custom_tool')
   const mcpServersEnabled = enabled && Boolean(workspaceId) && !excludeTypes?.includes('mcp_server')
   const { data: skills, isPending: skillsPending } = useSkills(workspaceId, {
     enabled: skillsEnabled,

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/add-resource-dropdown/organization-resource-inventory.tsx

@@ -15,7 +15,10 @@ export function OrganizationResourceInventory({
   excludeTypes?: readonly MothershipResourceType[]
   onChange: (workspaceId: string, inventory: AvailableResources) => void
 }) {
-  const inventory = useAvailableResources(workspaceId, { includeFolderMentions: true, excludeTypes })
+  const inventory = useAvailableResources(workspaceId, {
+    includeFolderMentions: true,
+    excludeTypes,
+  })
   useEffect(() => {
     onChange(workspaceId, inventory)
   }, [workspaceId, inventory, onChange])

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-content/resource-content.tsx

@@ -578,11 +578,7 @@ function EmbeddedResourceEditorAction({ href, label }: { href: string; label: st
   return (
     <Tooltip.Root>
       <Tooltip.Trigger asChild>
-        <TabStripAction
-          variant='subtle'
-          onClick={handleOpen}
-          aria-label={label}
-        >
+        <TabStripAction variant='subtle' onClick={handleOpen} aria-label={label}>
           <SquareArrowUpRight className={RESOURCE_TAB_ICON_CLASS} />
         </TabStripAction>
       </Tooltip.Trigger>

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-registry/resource-invalidation.ts

@@ -3,13 +3,13 @@ import type { MothershipResourceType } from '@/lib/mothership/resources/types'
 import { dashboardKeys } from '@/hooks/queries/dashboards'
 import { deploymentKeys, invalidateDeploymentQueries } from '@/hooks/queries/deployments'
 import { logKeys } from '@/hooks/queries/logs'
+import { mothershipChatKeys } from '@/hooks/queries/mothership-chats'
 import { skillsKeys } from '@/hooks/queries/skills'
 import { customToolsKeys } from '@/hooks/queries/utils/custom-tool-keys'
-import { mcpKeys } from '@/hooks/queries/utils/mcp-keys'
-import { mothershipChatKeys } from '@/hooks/queries/mothership-chats'
 import { folderKeys } from '@/hooks/queries/utils/folder-keys'
 import { invalidateWorkflowLists } from '@/hooks/queries/utils/invalidate-workflow-lists'
 import { knowledgeKeys } from '@/hooks/queries/utils/knowledge-keys'
+import { mcpKeys } from '@/hooks/queries/utils/mcp-keys'
 import { tableKeys } from '@/hooks/queries/utils/table-keys'
 import { workflowKeys } from '@/hooks/queries/utils/workflow-keys'
 import { workspaceFileFolderKeys } from '@/hooks/queries/workspace-file-folders'

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-registry/resource-registry.test.tsx

@@ -4,9 +4,9 @@
 import { QueryClient } from '@tanstack/react-query'
 import { describe, expect, it, vi } from 'vitest'
 import { invalidateResourceQueries } from '@/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-registry'
-import { mcpKeys } from '@/hooks/queries/utils/mcp-keys'
 import { skillsKeys } from '@/hooks/queries/skills'
 import { customToolsKeys } from '@/hooks/queries/utils/custom-tool-keys'
+import { mcpKeys } from '@/hooks/queries/utils/mcp-keys'
 
 describe('panel resource invalidation', () => {
   it('refreshes the Skill and Custom Tool lists', () => {

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-tabs/resource-tabs.tsx

@@ -50,10 +50,10 @@ import type {
   MothershipResourceType,
 } from '@/app/workspace/[workspaceId]/home/types'
 import { customToolsQueryOptions, useCustomTools } from '@/hooks/queries/custom-tools'
-import { mcpServersQueryOptions, useMcpServers } from '@/hooks/queries/mcp'
-import { getSkillsQueryOptions, useSkills } from '@/hooks/queries/skills'
 import { useFolders } from '@/hooks/queries/folders'
 import { useKnowledgeBasesQuery } from '@/hooks/queries/kb/knowledge'
+import { mcpServersQueryOptions, useMcpServers } from '@/hooks/queries/mcp'
+import { getSkillsQueryOptions, useSkills } from '@/hooks/queries/skills'
 import { useTablesList } from '@/hooks/queries/tables'
 import { getWorkflowListQueryOptions } from '@/hooks/queries/utils/workflow-list-query'
 import { useWorkflows } from '@/hooks/queries/workflows'

apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx

@@ -318,7 +318,9 @@ export const MothershipView = memo(
                 isAgentResponding={isAgentResponding}
                 genericResourceData={active.type === 'generic' ? genericResourceData : undefined}
                 previewContextKey={chatId}
-                onNotFound={(resourceId) => removeResource(active.type, resourceId, active.workspaceId)}
+                onNotFound={(resourceId) =>
+                  removeResource(active.type, resourceId, active.workspaceId)
+                }
               />
             )}
             {!active && (

apps/sim/app/workspace/[workspaceId]/home/hooks/stream/handle-resource-event.ts

@@ -70,7 +70,7 @@ export function handleResourceEvent(ctx: StreamLoopContext, parsed: ResourceEven
       (!settings.workspaceId || (chatWorkspaceId && settings.workspaceId !== chatWorkspaceId))
     )
       return
-    refreshSettings(queryClient, settings)
+    refreshSettings(queryClient, settings, ctx.deps.chatIdRef.current ?? undefined)
     if (settings.scope !== 'account' || settings.id === 'profile') ctx.deps.refreshRoute?.()
     return
   }

apps/sim/app/workspace/[workspaceId]/home/hooks/stream/refresh-settings.ts

@@ -5,7 +5,11 @@ import { refreshGeneralSettings } from '@/hooks/queries/general-settings'
 import { mothershipChatKeys } from '@/hooks/queries/mothership-chats'
 
 /** Read canonical settings again; replay must never restore a historical setting value. */
-export function refreshSettings(queryClient: QueryClient, settings: SettingsRefresh): void {
+export function refreshSettings(
+  queryClient: QueryClient,
+  settings: SettingsRefresh,
+  chatId?: string
+): void {
   if (settings.scope === 'account' && settings.id === 'preferences') {
     void refreshGeneralSettings(queryClient)
     return
@@ -14,6 +18,13 @@ export function refreshSettings(queryClient: QueryClient, settings: SettingsRefr
     void queryClient.invalidateQueries({ queryKey: userProfileKeys.all })
     return
   }
+  if (
+    chatId &&
+    settings.scope === 'workspace' &&
+    ['skills', 'custom-tools', 'mcp'].includes(settings.id)
+  ) {
+    void queryClient.invalidateQueries({ queryKey: mothershipChatKeys.detail(chatId) })
+  }
   // Access, billing and integration policies affect resources beyond the Settings screen.
   // Keep live chat history stable while revalidating the rest of the current viewer's cache.
   void queryClient.invalidateQueries({