diff options
| -rw-r--r-- | apps/web/components/new/memory-graph/legend.tsx | 17 | ||||
| -rw-r--r-- | apps/web/components/new/memory-graph/navigation-controls.tsx | 17 |
2 files changed, 19 insertions, 15 deletions
diff --git a/apps/web/components/new/memory-graph/legend.tsx b/apps/web/components/new/memory-graph/legend.tsx index c6d35ef9..3ce58c59 100644 --- a/apps/web/components/new/memory-graph/legend.tsx +++ b/apps/web/components/new/memory-graph/legend.tsx @@ -93,6 +93,7 @@ const HexagonIcon = memo(function HexagonIcon({ viewBox="0 0 12 12" style={{ opacity }} className="shrink-0" + aria-hidden="true" > <polygon points="6,1.5 10.4,3.75 10.4,8.25 6,10.5 1.6,8.25 1.6,3.75" @@ -129,7 +130,13 @@ const DocumentIcon = memo(function DocumentIcon() { // Connection icon (graph) const ConnectionIcon = memo(function ConnectionIcon() { return ( - <svg width="12" height="12" viewBox="0 0 12 12" className="shrink-0"> + <svg + width="12" + height="12" + viewBox="0 0 12 12" + className="shrink-0" + aria-hidden="true" + > <circle cx="3" cy="3" r="1.5" fill="#90A2B9" /> <circle cx="9" cy="3" r="1.5" fill="#90A2B9" /> <circle cx="6" cy="9" r="1.5" fill="#90A2B9" /> @@ -250,11 +257,11 @@ const ToggleRow = memo(function ToggleRow({ }) export const Legend = memo(function Legend({ - variant = "console", + variant: _variant = "console", id, nodes = [], edges = [], - isLoading = false, + isLoading: _isLoading = false, }: ExtendedLegendProps) { const isMobile = useIsMobile() const [isExpanded, setIsExpanded] = useState(false) @@ -288,7 +295,7 @@ export const Legend = memo(function Legend({ } setIsInitialized(true) } - }, [isInitialized, isMobile]) + }, [isInitialized]) // Save to cookie when state changes const handleToggleExpanded = (expanded: boolean) => { @@ -423,6 +430,7 @@ export const Legend = memo(function Legend({ height="12" viewBox="0 0 12 12" className="shrink-0" + aria-hidden="true" > <polygon points="6,0 11.2,6 6,12 0.8,6" @@ -445,6 +453,7 @@ export const Legend = memo(function Legend({ height="12" viewBox="0 0 12 12" className="shrink-0" + aria-hidden="true" > <polygon points="6,0 11.2,6 6,12 0.8,6" diff --git a/apps/web/components/new/memory-graph/navigation-controls.tsx b/apps/web/components/new/memory-graph/navigation-controls.tsx index 2910df12..16d51c4a 100644 --- a/apps/web/components/new/memory-graph/navigation-controls.tsx +++ b/apps/web/components/new/memory-graph/navigation-controls.tsx @@ -131,17 +131,11 @@ const NavigationButtons = memo(function NavigationButtons({ onZoomOut() } - const buttonClass = cn( - "flex flex-row items-center gap-2 px-3 py-2 rounded-lg", - "text-xs text-white/70 font-medium", - "transition-all duration-200", - "hover:bg-white/10 hover:text-white", - ) - return ( <div className="flex flex-col gap-1"> {/* Fit button */} - <div + <button + type="button" className="flex flex-row items-center justify-between px-3 py-2 rounded-lg cursor-pointer hover:bg-white/10 transition-colors" onClick={onAutoFit} style={{ @@ -152,10 +146,11 @@ const NavigationButtons = memo(function NavigationButtons({ > <span className="text-xs text-white/70 font-medium">Fit</span> <KeyboardShortcut keys="Z" /> - </div> + </button> {/* Center button */} - <div + <button + type="button" className="flex flex-row items-center justify-between px-3 py-2 rounded-lg cursor-pointer hover:bg-white/10 transition-colors" onClick={onCenter} style={{ @@ -166,7 +161,7 @@ const NavigationButtons = memo(function NavigationButtons({ > <span className="text-xs text-white/70 font-medium">Center</span> <KeyboardShortcut keys="C" /> - </div> + </button> {/* Zoom controls */} <div |