[DevTools] Disable the tree list for now (#34606)
When there are no named Activities we should hide the tree side panel (and the button to show it). Since it's not implemented yet there are never any ones so it's always hidden.
Sebastian Markbåge committed
Sep 26, 2025 at 09:43 UTC
1fd291d3c5e21953d92228b0f35d4f932170317f
1 file changed
+27
-14
packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTab.js
+27
-14
@@ -117,6 +117,11 @@ function SuspenseTab(_: {}) {
117
initLayoutState,
118
);
119
120
+ // If there are no named Activity boundaries, we don't have any tree list and we should hide
121
+ // both the panel and the button to toggle it. Since we currently don't support it yet, it's
122
+ // always disabled.
123
+ const treeListDisabled = true;
124
+
125
const wrapperTreeRef = useRef<null | HTMLElement>(null);
126
const resizeTreeRef = useRef<null | HTMLElement>(null);
127
const resizeTreeListRef = useRef<null | HTMLElement>(null);
@@ -290,23 +295,31 @@ function SuspenseTab(_: {}) {
295
return (
296
<div className={styles.SuspenseTab} ref={wrapperTreeRef}>
297
<div className={styles.TreeWrapper} ref={resizeTreeRef}>
293
- <div
294
- className={styles.TreeList}
295
- hidden={treeListHidden}
296
- ref={resizeTreeListRef}>
297
- <SuspenseTreeList />
298
- </div>
299
- <div className={styles.ResizeBarWrapper} hidden={treeListHidden}>
298
+ {treeListDisabled ? null : (
299
<div
301
- onPointerDown={onResizeStart}
302
- onPointerMove={onResizeTreeList}
303
- onPointerUp={onResizeEnd}
304
- className={styles.ResizeBar}
305
- />
306
- </div>
300
+ className={styles.TreeList}
301
+ hidden={treeListHidden}
302
+ ref={resizeTreeListRef}>
303
+ <SuspenseTreeList />
304
+ </div>
305
+ )}
306
+ {treeListDisabled ? null : (
307
+ <div className={styles.ResizeBarWrapper} hidden={treeListHidden}>
308
+ <div
309
+ onPointerDown={onResizeStart}
310
+ onPointerMove={onResizeTreeList}
311
+ onPointerUp={onResizeEnd}
312
+ className={styles.ResizeBar}
313
+ />
314
+ </div>
315
+ )}
316
<div className={styles.TreeView}>
317
<div className={styles.SuspenseTreeViewHeader}>
309
- <ToggleTreeList dispatch={dispatch} state={state} />
318
+ {treeListDisabled ? (
319
+ <div />
320
+ ) : (
321
+ <ToggleTreeList dispatch={dispatch} state={state} />
322
+ )}
323
<div className={styles.SuspenseTreeViewHeaderMain}>
324
<div className={styles.SuspenseTimeline}>
325
<SuspenseTimeline />