feat(web): enhance debugging capabilities across components

- Integrated debug logging in main application file to track boot process.
- Added layout width logging in PageShell and various ReUI components to monitor rendering dimensions.
- Implemented chart size logging in dashboard analytics components for better performance insights.
- Enhanced OpsDashboard and ResourcePage with width tracking to improve layout responsiveness.

Co-authored-by: Cursor <[email protected]>

apps/web/src/components/page-shell.tsx

@@ -1,5 +1,7 @@
-import type { ReactNode } from 'react'
+import { useEffect, useRef, type ReactNode } from 'react'
+import { useRouterState } from '@tanstack/react-router'
 import { cn } from '@cfdm/ui/lib/utils'
+import { DEBUG_BUILD_STAMP, debugAgentLog } from '@/lib/debug-agent-log'
 
 interface PageShellProps {
   children: ReactNode
@@ -7,5 +9,38 @@ interface PageShellProps {
 }
 
 export function PageShell({ children, className }: PageShellProps) {
-  return <div className={cn('flex flex-col gap-4 md:gap-6', className)}>{children}</div>
+  const ref = useRef<HTMLDivElement>(null)
+  const pathname = useRouterState({ select: (s) => s.location.pathname })
+
+  useEffect(() => {
+    const el = ref.current
+    if (!el) return
+    const main = el.closest('main')
+    const mainWidth = main?.clientWidth ?? 0
+    const shellWidth = el.clientWidth
+    const child = el.firstElementChild as HTMLElement | null
+    const childWidth = child?.clientWidth ?? 0
+    const childMaxWidth = child ? getComputedStyle(child).maxWidth : 'none'
+    debugAgentLog(
+      'page-shell.tsx:mount',
+      'page layout widths',
+      {
+        buildStamp: DEBUG_BUILD_STAMP,
+        pathname,
+        mainWidth,
+        shellWidth,
+        childWidth,
+        childMaxWidth,
+        shellClass: el.className,
+        childClass: child?.className ?? null,
+      },
+      'A',
+    )
+  }, [pathname])
+
+  return (
+    <div ref={ref} className={cn('flex flex-col gap-4 md:gap-6', className)}>
+      {children}
+    </div>
+  )
 }