Split out slow pathParameters extension and skip unnecessary model updates

src-web/components/SidebarItem.tsx

@@ -1,7 +1,7 @@
 import type { AnyModel, GrpcConnection, HttpResponse } from '@yaakapp-internal/models';
 import classNames from 'classnames';
 import { atom, useAtomValue } from 'jotai';
-import type { ReactNode } from 'react';
+import type { ReactElement } from 'react';
 import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import type { XYCoord } from 'react-dnd';
 import { useDrag, useDrop } from 'react-dnd';
@@ -31,12 +31,11 @@ export type SidebarItemProps = {
   className?: string;
   itemId: string;
   itemName: string;
-  itemFallbackName: string;
   itemModel: AnyModel['model'];
   onMove: (id: string, side: 'above' | 'below') => void;
   onEnd: (id: string) => void;
   onDragStart: (id: string) => void;
-  children?: ReactNode;
+  children: ReactElement<typeof SidebarItem> | null;
   child: SidebarTreeNode;
   latestHttpResponse: HttpResponse | null;
   latestGrpcConnection: GrpcConnection | null;
@@ -57,7 +56,6 @@ export const SidebarItem = memo(function SidebarItem({
   onDragStart,
   onSelect,
   className,
-  itemFallbackName,
   latestHttpResponse,
   latestGrpcConnection,
   children,
@@ -210,7 +208,7 @@ export const SidebarItem = memo(function SidebarItem({
         return null;
       }
     });
-  }, [itemId, itemModel])
+  }, [itemId, itemModel]);
 
   const item = useAtomValue(itemAtom);
 
@@ -271,7 +269,7 @@ export const SidebarItem = memo(function SidebarItem({
                 onKeyDown={handleInputKeyDown}
               />
             ) : (
-              <span className="truncate">{itemName || itemFallbackName}</span>
+              <span className="truncate">{itemName}</span>
             )}
           </div>
           {latestGrpcConnection ? (