diff --git a/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/project-navigation-sidebar.tsx b/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/project-navigation-sidebar.tsx index c814c1b566..da1becf930 100644 --- a/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/project-navigation-sidebar.tsx +++ b/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/project-navigation-sidebar.tsx @@ -549,7 +549,11 @@ export const ProjectNavigationSidebar = ({ storageRules, konnectSyncEnabled }: P if (!projectNavigationSidebarFilter) { const expandedIds = expandedProjectAndWorkspaceIds || []; const newExpandedIds = Array.from(new Set([...expandedIds, ...projectOrWorkspaceIds])); - setExpandedProjectAndWorkspaceIds(newExpandedIds); + // Avoid updating state if there is no change in expanded ids to prevent unnecessary re-render + const hasNewIds = newExpandedIds.some(id => !expandedIds.includes(id)); + if (hasNewIds) { + setExpandedProjectAndWorkspaceIds(newExpandedIds); + } } }, [expandedProjectAndWorkspaceIds, projectNavigationSidebarFilter, setExpandedProjectAndWorkspaceIds], @@ -568,7 +572,7 @@ export const ProjectNavigationSidebar = ({ storageRules, konnectSyncEnabled }: P const requestGroupMetas = await Promise.all( requestGroupIds.map(requestGroupId => services.requestGroupMeta.getByParentId(requestGroupId)), ); - + // Update the collapsed state of the toggled request groups. const nextStates = requestGroupIds.map((requestGroupId, index) => { const requestGroupMeta = requestGroupMetas[index]; return { @@ -582,7 +586,7 @@ export const ProjectNavigationSidebar = ({ storageRules, konnectSyncEnabled }: P services.requestGroupMeta.updateOrCreateForParentId(requestGroupId, { collapsed }), ), ); - + // Update the collapsed state in the cache. cachedCollectionChildrenAndMetaRef.current.forEach(workspaceData => { workspaceData.requestGroupMetas.forEach(requestGroupMeta => { const nextState = nextStates.find(({ requestGroupId }) => requestGroupId === requestGroupMeta.parentId); @@ -652,7 +656,13 @@ export const ProjectNavigationSidebar = ({ storageRules, konnectSyncEnabled }: P } else if (matchedToggledChild) { return { ...item, - hidden: matchedToggledChild.parentIsCollapsed, + hidden: + matchedToggledChild.parentIsCollapsed || + // If the parent folder is toggled to be expanded, the empty folder node should still be hidden if its parent request group is collapsed. + cachedCollectionChildrenAndMetaRef.current + .get(workspace._id) + ?.requestGroupMetas.find(rgm => rgm.parentId === matchedToggledChild.id)?.collapsed || + false, }; } } diff --git a/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/use-project-navigation-sidebar-navigation.ts b/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/use-project-navigation-sidebar-navigation.ts index 3fd026f7ab..fb2ad5c5c4 100644 --- a/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/use-project-navigation-sidebar-navigation.ts +++ b/packages/insomnia/src/ui/components/sidebar/project-navigation-sidebar/use-project-navigation-sidebar-navigation.ts @@ -85,10 +85,10 @@ export const useProjectNavigationSidebarNavigation = ({ !models.workspace.isWorkspace(resources.resource) && models.workspace.isCollection(resources.workspace) ) { - const requestGroupIds = (await database.withAncestors(resources.resource)) + const requestGroups = (await database.withAncestors(resources.resource, [models.requestGroup.type])) .reverse() - .filter(models.requestGroup.isRequestGroup) - .map(requestGroup => requestGroup._id); + .filter(models.requestGroup.isRequestGroup); + const requestGroupIds = requestGroups.map(requestGroup => requestGroup._id); if (cancelled) { return;