fix: improvements

frontend/src/app/recollections/layout/TreeBrowser.tsx

@@ -14,6 +14,7 @@
  */
 
 import React, { useCallback, useMemo, useRef, useState } from 'react'
+import { useResizeHeight } from '@/hooks/useResizeHeight'
 import {
   Tree,
   NodeApi,
@@ -422,6 +423,7 @@ export function TreeBrowser() {
   const { tree, handleTreeChange } = useRecollectionSidebar()
   const [searchQuery, setSearchQuery] = useState('')
   const treeRef = useRef<TreeApi<TreeNode> | null>(null)
+  const [treeContainerHeight, treeContainerRef] = useResizeHeight(600)
 
   // Build tree from flat structure
   const treeNodes = useTreeNodes(tree)
@@ -533,7 +535,7 @@ export function TreeBrowser() {
       idAccessor: 'id' as const,
       childrenAccessor: 'children' as const,
       width: '100%' as const,
-      height: 600,
+      height: Math.max(treeContainerHeight, 100),
       rowHeight: 32,
       indent: ROW_INDENT_PX,
       renderRow: TreeRow,
@@ -545,7 +547,7 @@ export function TreeBrowser() {
       renderCursor: LogosDropCursor,
       children: LogosTreeNode,
     }),
-    [filteredTree, initialOpenState, handleMove, searchQuery]
+    [filteredTree, initialOpenState, handleMove, searchQuery, treeContainerHeight]
   )
 
   return (
@@ -599,7 +601,7 @@ export function TreeBrowser() {
       </div>
 
       {/* Tree */}
-      <div className="flex-1 min-h-0 overflow-hidden">
+      <div ref={treeContainerRef} className="flex-1 min-h-0 overflow-hidden">
         <Tree ref={treeRef} {...arboristTreeProps} />
       </div>
     </div>