improvement(display-names): move display name mapping to central store + access pattern via hook

[icecrasher321]

Summary

Preview should match Sidebar without odd rehydration.

Type of Change

• Bug fix

Testing

Testing manually on staging environment.

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)

[vercel]

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

1 Skipped Deployment

Project	Deployment	Preview	Comments	Updated (UTC)
docs	Skipped			Nov 11, 2025 5:12am

[greptile-apps]

Greptile Overview

Greptile Summary

Refactored display name management from scattered local state to a centralized Zustand store with automatic hydration via hooks. This eliminates the rehydration issue where workflow block previews showed IDs instead of names.

Key Changes:

• Created useDisplayNamesStore for centralized caching of all ID-to-name mappings
• Implemented useDisplayName hook with auto-fetching logic for channels, files, folders, projects, documents, and workflows
• Added useCredentialDisplay hook for credential-specific name resolution
• Updated WorkflowBlock SubBlockRow component to automatically hydrate IDs to display names
• Added hideFromPreview field to SubBlockConfig to hide instructional/setup fields from preview
• Refactored 17+ selector components to cache names in the display store upon fetch
• Applied hideFromPreview to all trigger webhook setup instructions

Impact:

• Solves preview/sidebar display name mismatch
• Reduces redundant API calls through centralized caching
• Cleaner separation of concerns between data fetching and display logic

Confidence Score: 4/5

• Safe to merge with minor dependency array issue that could cause stale closures in edge cases
• The refactoring is well-structured with consistent patterns applied across all selectors. The centralized store approach is sound. However, there's a missing dependency issue in the useDisplayName hook's useCallback that could lead to stale closures. The extensive use of multiple useEffect hooks could also lead to excessive re-renders, though this is more of a performance concern than a correctness issue.
• Pay attention to apps/sim/hooks/use-display-name.ts for the dependency array issue

Important Files Changed

File Analysis

Filename	Score	Overview
apps/sim/stores/display-names/store.ts	5/5	New centralized Zustand store for caching display name mappings across all selector types - clean implementation with proper separation of concerns
apps/sim/hooks/use-display-name.ts	4/5	Generic hook that auto-fetches and caches display names for all selector types - comprehensive but has multiple useEffect hooks that could cause excessive re-renders
apps/sim/hooks/use-credential-display.ts	5/5	Specialized hook for credential display names with proper memoization and loading state - clean and focused implementation
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx	4/5	SubBlockRow enhanced to automatically hydrate IDs to display names using new hooks - logic is complex with multiple conditional branches and dependency resolution
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/components/document-selector/document-selector.tsx	4/5	Refactored to use knowledge store and display names store, removed local state management - cleaner but introduces store coupling
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel-new/components/editor/components/sub-block/components/file-selector/components/jira-issue-selector.tsx	4/5	Removed local selectedIssue state in favor of cached display names - simplifies state management but relies on cache for display

Sequence Diagram

sequenceDiagram
participant WB as WorkflowBlock
participant SBR as SubBlockRow
participant UDN as useDisplayName
participant UCD as useCredentialDisplay
participant DNS as DisplayNamesStore
participant API as API Endpoints
participant SEL as Selector Components
Note over WB,SEL: Initial Render Flow
WB->>SBR: Render with subBlock config + rawValue
SBR->>UCD: Check credential display (if oauth-input)
UCD->>DNS: Get cached credential name
alt Cache Miss
UCD->>API: GET /api/auth/oauth/credentials
API-->>UCD: Return credentials list
UCD->>DNS: setDisplayNames('credentials', provider, map)
end
DNS-->>UCD: Return display name
SBR->>UDN: Check generic display name (if other selector)
UDN->>DNS: Get cached display name by type + context
alt Cache Miss
alt Channel Selector
UDN->>API: POST /api/tools/slack/channels
else File Selector
UDN->>API: Provider-specific file endpoint
else Folder Selector
UDN->>API: Gmail/Outlook folders endpoint
else Project Selector
UDN->>API: Jira/Linear projects endpoint
else Document Selector
UDN->>API: GET /api/knowledge/{id}/documents
end
API-->>UDN: Return items list
UDN->>DNS: setDisplayNames(type, context, map)
end
DNS-->>UDN: Return display name
UDN-->>SBR: Return resolved name
SBR-->>WB: Display hydrated name
Note over SEL,DNS: Selector Component Flow
SEL->>API: Fetch items (on open/load)
API-->>SEL: Return items with id + name
SEL->>DNS: setDisplayNames(type, context, itemMap)
Note over DNS: Cache persists across renders
SEL->>SEL: Use cached display name for preview

Loading

[greptile-apps]

_{73 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}