diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-content/resource-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-content/resource-content.tsx index 0e100176242..f920cec2216 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-content/resource-content.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-content/resource-content.tsx @@ -1,6 +1,6 @@ 'use client' -import { lazy, Suspense, useCallback, useEffect, useMemo } from 'react' +import { lazy, memo, Suspense, useCallback, useEffect, useMemo } from 'react' import { createLogger } from '@sim/logger' import { Square } from 'lucide-react' import { useRouter } from 'next/navigation' @@ -51,7 +51,11 @@ interface ResourceContentProps { * Handles table, file, and workflow resource types with appropriate * embedded rendering for each. */ -export function ResourceContent({ workspaceId, resource, previewMode }: ResourceContentProps) { +export const ResourceContent = memo(function ResourceContent({ + workspaceId, + resource, + previewMode, +}: ResourceContentProps) { switch (resource.type) { case 'table': return @@ -84,7 +88,7 @@ export function ResourceContent({ workspaceId, resource, previewMode }: Resource default: return null } -} +}) interface ResourceActionsProps { workspaceId: string @@ -303,10 +307,12 @@ interface EmbeddedWorkflowProps { function EmbeddedWorkflow({ workspaceId, workflowId }: EmbeddedWorkflowProps) { const workflowExists = useWorkflowRegistry((state) => Boolean(state.workflows[workflowId])) - const hydrationPhase = useWorkflowRegistry((state) => state.hydration.phase) - const hydrationWorkflowId = useWorkflowRegistry((state) => state.hydration.workflowId) - const isMetadataLoaded = hydrationPhase !== 'idle' && hydrationPhase !== 'metadata-loading' - const hasLoadError = hydrationPhase === 'error' && hydrationWorkflowId === workflowId + const isMetadataLoaded = useWorkflowRegistry( + (state) => state.hydration.phase !== 'idle' && state.hydration.phase !== 'metadata-loading' + ) + const hasLoadError = useWorkflowRegistry( + (state) => state.hydration.phase === 'error' && state.hydration.workflowId === workflowId + ) if (!isMetadataLoaded) return LOADING_SKELETON diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx index 2df4c446026..44c423e76e6 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx @@ -1,6 +1,6 @@ 'use client' -import { useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useState } from 'react' import { cn } from '@/lib/core/utils/cn' import { getFileExtension } from '@/lib/uploads/utils/file-utils' import type { PreviewMode } from '@/app/workspace/[workspaceId]/files/components/file-viewer' @@ -34,7 +34,7 @@ interface MothershipViewProps { className?: string } -export function MothershipView({ +export const MothershipView = memo(function MothershipView({ workspaceId, chatId, resources, @@ -99,4 +99,4 @@ export function MothershipView({ ) -} +}) diff --git a/apps/sim/app/workspace/[workspaceId]/home/home.tsx b/apps/sim/app/workspace/[workspaceId]/home/home.tsx index 64ef65819f6..522b9ee7835 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/home.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/home.tsx @@ -167,7 +167,6 @@ export function Home({ chatId }: HomeProps = {}) { const handleResourceEvent = useCallback(() => { if (isResourceCollapsedRef.current) { - /** Auto-collapse sidebar to give resource panel maximum width for immersive experience */ const { isCollapsed, toggleCollapsed } = useSidebarStore.getState() if (!isCollapsed) toggleCollapsed() setIsResourceCollapsed(false) diff --git a/apps/sim/app/workspace/[workspaceId]/home/hooks/use-chat.ts b/apps/sim/app/workspace/[workspaceId]/home/hooks/use-chat.ts index a3b9e0e146a..e6aed244172 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/hooks/use-chat.ts +++ b/apps/sim/app/workspace/[workspaceId]/home/hooks/use-chat.ts @@ -582,8 +582,7 @@ export function useChat( readArgs?.path as string | undefined, tc.result.output ) - if (resource) { - addResource(resource) + if (resource && addResource(resource)) { onResourceEventRef.current?.() } } @@ -594,12 +593,21 @@ export function useChat( case 'resource_added': { const resource = parsed.resource if (resource?.type && resource?.id) { - addResource(resource) + const wasAdded = addResource(resource) invalidateResourceQueries(queryClient, workspaceId, resource.type, resource.id) + if (!wasAdded && activeResourceIdRef.current !== resource.id) { + setActiveResourceId(resource.id) + } onResourceEventRef.current?.() + if (resource.type === 'workflow') { - if (ensureWorkflowInRegistry(resource.id, resource.title, workspaceId)) { + const wasRegistered = ensureWorkflowInRegistry( + resource.id, + resource.title, + workspaceId + ) + if (wasAdded && wasRegistered) { useWorkflowRegistry.getState().setActiveWorkflow(resource.id) } else { useWorkflowRegistry.getState().loadWorkflowState(resource.id)