chore: optimize imports and useShallow

[adithyaakrishna]

Summary

• Optimize Imports and useShallow

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation
• Other: Improvement

Testing

• Checked with using all the files that are tied to the feature from the changes

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[cursor]

PR Summary

Medium Risk
Mostly performance-focused refactors (Zustand selectors with useShallow, React Query placeholder caching, and dynamic imports), but it touches session retrieval (getSession) and cache invalidation behavior, which could affect auth/UI freshness if mis-scoped.

Overview
Improves client performance by switching many Zustand store reads to selector-based access (often with useShallow) to reduce re-renders across logs, chat, variables, panel/sidebar resize, and workflow management views.

Optimizes bundle/runtime loading via additional dynamic imports (e.g., socket.io-client, html-to-image, jszip, and the voice ParticlesVisualization) and enables Next.js experimental.optimizePackageImports for several heavy dependencies.

Refines data fetching behavior by adding keepPreviousData placeholders to multiple React Query hooks and tightening query key factories + invalidation/removal logic for agents, knowledge bases, credential sets, schedules, tasks, and workspaces.

Adjusts image handling by removing unoptimized from several blog/MDX images and migrating template author avatars to next/image (kept unoptimized).

^{Written by Cursor Bugbot for commit b99cece. This will update automatically on new commits. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		Mar 24, 2026 5:39pm

[greptile-apps]

Greptile Summary

This PR applies a broad set of performance and bundle-size optimisations across the apps/sim application: useShallow is added to Zustand store subscriptions to prevent unnecessary re-renders, several heavy third-party imports (socket.io-client, JSZip, html-to-image, ParticlesVisualization) are converted to dynamic import() calls for better code-splitting, keepPreviousData is applied to React Query hooks to eliminate loading flashes on refetch, getSession is wrapped in React's cache() for server-side deduplication, and optimizePackageImports is configured in next.config.ts for 17 libraries. The changes are mechanical and well-scoped, but the A2A agent query refactor inadvertently drops invalidation of the byWorkflow query namespace.

Key changes:

• next.config.ts: Added optimizePackageImports for 17 packages to enable Next.js built-in tree-shaking.
• Dynamic imports: socket.io-client (io), jszip, html-to-image (toPng), and ParticlesVisualization are now lazily loaded.
• useShallow: Applied across 15+ components and hooks to make Zustand subscriptions fine-grained.
• keepPreviousData: Added to queries in deployments, schedules, notifications, credential-sets, workflows, and knowledge to prevent content flicker.
• lib/auth/auth.ts: getSession wrapped with React cache() to deduplicate server-side calls per request.
• hooks/queries/a2a/agents.ts: Query key factory extended with lists()/details() helpers, but all four mutation onSuccess handlers now miss invalidating the byWorkflow query namespace, which the previous all-invalidation approach covered automatically.

Confidence Score: 4/5

• Safe to merge after fixing the missing byWorkflow query invalidation in the A2A agent mutation hooks.
• The vast majority of changes are straightforward optimisations (dynamic imports, useShallow, keepPreviousData, cache()) with no behavioural differences. The single concrete issue — byWorkflow queries not being invalidated after A2A agent mutations — is a regression that will silently show stale data in any component using useA2AAgentByWorkflow, but does not cause crashes or data loss. One targeted fix brings this to merge-ready.
• apps/sim/hooks/queries/a2a/agents.ts — all four mutation onSuccess handlers need a byWorkflow invalidation call added.

Important Files Changed

Filename	Overview
apps/sim/hooks/queries/a2a/agents.ts	Refactored query key factory (added lists()/details() helpers) and scoped mutation invalidations to lists() + detail(), but dropped the former a2aAgentKeys.all breadth — byWorkflow queries are no longer invalidated after create/update/delete/publish, causing potential stale data.
apps/sim/next.config.ts	Added optimizePackageImports for 17 packages (lucide-react, framer-motion, reactflow, @radix-ui/*, etc.) to enable Next.js built-in tree-shaking for these libraries, reducing bundle size.
apps/sim/lib/auth/auth.ts	Wrapped getSession in React's cache() to deduplicate calls within a single server render pass — a clean, idiomatic improvement that avoids redundant DB/auth lookups per request.
apps/sim/lib/workflows/operations/import-export.ts	Converted static JSZip import to a lazy getJSZip() helper using dynamic import(), so the library is only loaded when an export/import operation actually runs — no behavioral change.
apps/sim/lib/og/capture-preview.ts	Converted static toPng import from html-to-image to a dynamic import inside the retry loop, deferring the heavy canvas library until it is actually needed.
apps/sim/app/workspace/providers/socket-provider.tsx	Converted io from socket.io-client to a dynamic import inside initializeSocket, reducing the client bundle by deferring the socket library until a connection is actually established.
apps/sim/hooks/queries/deployments.ts	Added placeholderData: keepPreviousData to five query hooks, preventing loading flashes when query keys change — straightforward UX improvement.
apps/sim/hooks/queries/kb/knowledge.ts	Corrected mutation invalidations to target lists() and detail() specifically; the previous useUpdateKnowledgeBase had a redundancy (invalidated all after already invalidating detail) which is now resolved.
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/hooks/use-workflow-execution.ts	Applied useShallow to three Zustand store subscriptions (useWorkflowRegistry, useTerminalConsoleStore, useVariablesStore), reducing unnecessary re-renders in the critical workflow execution path.
apps/sim/app/workspace/[workspaceId]/logs/logs.tsx	Applied useShallow to two useFilterStore calls in Logs and LogsFilterPanel, extracting only the fields each component actually reads from the large filter store.
apps/sim/app/chat/components/voice-interface/voice-interface.tsx	Converted ParticlesVisualization to a next/dynamic import with ssr: false, preventing SSR errors from WebGL/canvas code and deferring the particle bundle to client-only load.
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/hooks/use-depends-on-gate.ts	Switched import { isEqual } from 'lodash' to the sub-path import isEqual from 'lodash/isEqual' for better tree-shaking; no behavioral change.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    subgraph Before["Before: Broad invalidation"]
        M1[Mutation onSuccess] --> I1["invalidateQueries(a2aAgentKeys.all)\n['a2a-agents']"]
        I1 --> L1["✅ list queries"]
        I1 --> D1["✅ detail queries"]
        I1 --> B1["✅ byWorkflow queries"]
    end

    subgraph After["After: Scoped invalidation"]
        M2[Mutation onSuccess] --> I2["invalidateQueries(a2aAgentKeys.lists())\n['a2a-agents', 'list']"]
        M2 --> I3["invalidateQueries(a2aAgentKeys.detail(id))\n['a2a-agents', 'detail', id]"]
        I2 --> L2["✅ list queries"]
        I3 --> D2["✅ detail queries"]
        B2["❌ byWorkflow queries\nnot invalidated — stale data"]
    end

    subgraph Other["Other optimisations (all correct)"]
        S1["useShallow added to 15+ store subscriptions"]
        S2["Dynamic imports: socket.io-client, JSZip, toPng, Particles"]
        S3["keepPreviousData on 9 query hooks"]
        S4["React cache() wrapping getSession"]
        S5["optimizePackageImports for 17 libraries"]
    end

Loading

_{Reviews (1): Last reviewed commit: "chore: optimize imports and useShallow" | Re-trigger Greptile}

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}