diff --git a/.cursor/debug-c10bcb.log b/.cursor/debug-c10bcb.log index 21c07cc..13f4130 100644 --- a/.cursor/debug-c10bcb.log +++ b/.cursor/debug-c10bcb.log @@ -9,3 +9,6 @@ {"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605152671} {"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605222064} {"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605222067} +{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605819320} +{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605827145} +{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605864391} diff --git a/apps/web/src/components/badge-tabs.tsx b/apps/web/src/components/badge-tabs.tsx index cb0bbab..208ef0e 100644 --- a/apps/web/src/components/badge-tabs.tsx +++ b/apps/web/src/components/badge-tabs.tsx @@ -1,5 +1,4 @@ import type { ComponentProps, ReactNode } from 'react' -import { useEffect, useRef } from 'react' import { Tabs, TabsContent, TabsList, TabsTrigger } from '@evobgp/ui/components/tabs' import { cn } from '@evobgp/ui/lib/utils' @@ -36,67 +35,34 @@ export function BadgeTabs({ listClassName, contentClassName, }: BadgeTabsProps) { - const tabsRef = useRef(null) - - useEffect(() => { - const el = tabsRef.current?.querySelector('[data-slot=tabs]') - if (!el || !(el instanceof HTMLElement)) return - const flexDirection = getComputedStyle(el).flexDirection - const listRect = el.querySelector('[data-slot=tabs-list]')?.getBoundingClientRect() - const panelRect = el.querySelector('[data-slot=tabs-content]')?.getBoundingClientRect() - // #region agent log - fetch('http://127.0.0.1:7311/ingest/6b35c3ae-1bcd-4c9c-81eb-f157c9347393', { - method: 'POST', - headers: { 'Content-Type': 'application/json', 'X-Debug-Session-Id': 'c10bcb' }, - body: JSON.stringify({ - sessionId: 'c10bcb', - runId: 'post-fix', - hypothesisId: 'H1', - location: 'badge-tabs.tsx:useEffect', - message: 'BadgeTabs layout metrics', - data: { - flexDirection, - orientation: el.getAttribute('data-orientation'), - listLeft: listRect?.left, - panelLeft: panelRect?.left, - stacked: flexDirection === 'column', - }, - timestamp: Date.now(), - }), - }).catch(() => {}) - // #endregion - }, [value, defaultValue]) - return ( -
- + - - {items.map((item) => ( - - {item.icon} - {item.label} - {item.count !== undefined ? ( - - {item.count} - - ) : null} - - ))} - -
{children}
-
-
+ {items.map((item) => ( + + {item.icon} + {item.label} + {item.count !== undefined ? ( + + {item.count} + + ) : null} + + ))} + +
{children}
+ ) }