From ba6028c2eaff3d564c4414c0c8533d568152c6f8 Mon Sep 17 00:00:00 2001
From: hsiegeln <37154749+hsiegeln@users.noreply.github.com>
Date: Thu, 2 Apr 2026 18:35:46 +0200
Subject: [PATCH] refactor: extract nested handlers to fix function depth
 violations (S2004)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../composites/BarChart/BarChart.tsx          | 42 +++++++------------
 .../CommandPalette/CommandPalette.tsx         | 10 +++--
 src/design-system/composites/Toast/Toast.tsx  | 10 +++--
 3 files changed, 28 insertions(+), 34 deletions(-)

diff --git a/src/design-system/composites/BarChart/BarChart.tsx b/src/design-system/composites/BarChart/BarChart.tsx
index 47549b5..3e6f852 100644
--- a/src/design-system/composites/BarChart/BarChart.tsx
+++ b/src/design-system/composites/BarChart/BarChart.tsx
@@ -83,6 +83,20 @@ export function BarChart({
     setTooltip({ x: mx, y: my, label: catLabel, values })
   }
 
+  function showBarTooltip(e: React.MouseEvent<SVGRectElement>, cat: string) {
+    const rect = e.currentTarget.closest('svg')!.getBoundingClientRect()
+    handleMouseEnter(
+      cat,
+      e.clientX - rect.left,
+      e.clientY - rect.top,
+      series.map((ss, ssi) => ({
+        series: ss.label,
+        value: ss.data.find((d) => d.x === cat)?.y ?? 0,
+        color: ss.color ?? CHART_COLORS[ssi % CHART_COLORS.length],
+      })),
+    )
+  }
+
   return (
     <div className={`${styles.wrapper} ${className ?? ''}`}>
       {yLabel && <div className={styles.yLabel}>{yLabel}</div>}
@@ -138,19 +152,7 @@ export function BarChart({
                       height={barH}
                       fill={color}
                       className={styles.bar}
-                      onMouseEnter={(e) => {
-                        const rect = e.currentTarget.closest('svg')!.getBoundingClientRect()
-                        handleMouseEnter(
-                          cat,
-                          e.clientX - rect.left,
-                          e.clientY - rect.top,
-                          series.map((ss, ssi) => ({
-                            series: ss.label,
-                            value: ss.data.find((d) => d.x === cat)?.y ?? 0,
-                            color: ss.color ?? CHART_COLORS[ssi % CHART_COLORS.length],
-                          })),
-                        )
-                      }}
+                      onMouseEnter={(e) => showBarTooltip(e, cat)}
                     />
                   )
                 })}
@@ -184,19 +186,7 @@ export function BarChart({
                     height={barH}
                     fill={color}
                     className={styles.bar}
-                    onMouseEnter={(e) => {
-                      const svgEl = e.currentTarget.closest('svg')!.getBoundingClientRect()
-                      handleMouseEnter(
-                        cat,
-                        e.clientX - svgEl.left,
-                        e.clientY - svgEl.top,
-                        series.map((ss, ssi) => ({
-                          series: ss.label,
-                          value: ss.data.find((d) => d.x === cat)?.y ?? 0,
-                          color: ss.color ?? CHART_COLORS[ssi % CHART_COLORS.length],
-                        })),
-                      )
-                    }}
+                    onMouseEnter={(e) => showBarTooltip(e, cat)}
                   />
                 )
               })}
diff --git a/src/design-system/composites/CommandPalette/CommandPalette.tsx b/src/design-system/composites/CommandPalette/CommandPalette.tsx
index 30e56c5..3baa9be 100644
--- a/src/design-system/composites/CommandPalette/CommandPalette.tsx
+++ b/src/design-system/composites/CommandPalette/CommandPalette.tsx
@@ -186,6 +186,11 @@ export function CommandPalette({ open, onClose, onSelect, data, onOpen, onQueryC
     setScopeFilters((prev) => prev.filter((_, i) => i !== idx))
   }
 
+  function toggleExpanded(e: React.MouseEvent, id: string) {
+    e.stopPropagation()
+    setExpandedId((prev) => (prev === id ? null : id))
+  }
+
   if (!open) return null
 
   return createPortal(
@@ -328,10 +333,7 @@ export function CommandPalette({ open, onClose, onSelect, data, onOpen, onQueryC
                         {result.expandedContent && (
                           <button
                             className={styles.expandBtn}
-                            onClick={(e) => {
-                              e.stopPropagation()
-                              setExpandedId((prev) => (prev === result.id ? null : result.id))
-                            }}
+                            onClick={(e) => toggleExpanded(e, result.id)}
                             aria-expanded={isExpanded}
                             aria-label="Toggle detail"
                           >
diff --git a/src/design-system/composites/Toast/Toast.tsx b/src/design-system/composites/Toast/Toast.tsx
index e540b9c..a640232 100644
--- a/src/design-system/composites/Toast/Toast.tsx
+++ b/src/design-system/composites/Toast/Toast.tsx
@@ -57,6 +57,10 @@ export function ToastProvider({ children }: { children: ReactNode }) {
   const [toasts, setToasts] = useState<ToastItem[]>([])
   const timersRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map())
 
+  const removeToast = useCallback((id: string) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id))
+  }, [])
+
   const dismiss = useCallback((id: string) => {
     // Clear auto-dismiss timer if running
     const timer = timersRef.current.get(id)
@@ -71,10 +75,8 @@ export function ToastProvider({ children }: { children: ReactNode }) {
     )
 
     // Remove after animation completes
-    setTimeout(() => {
-      setToasts((prev) => prev.filter((t) => t.id !== id))
-    }, EXIT_ANIMATION_MS)
-  }, [])
+    setTimeout(() => removeToast(id), EXIT_ANIMATION_MS)
+  }, [removeToast])
 
   const toast = useCallback(
     (options: ToastOptions): string => {