Skip to content

Commit fee0df5

Browse files
Removed React console.log errors
1 parent b2bf4c6 commit fee0df5

File tree

2 files changed

+69
-52
lines changed

2 files changed

+69
-52
lines changed

calm-hub-ui/src/visualizer/components/menu/Menu.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export function Menu({
5555
name="connection-description"
5656
aria-label="connection-description"
5757
checked={isConDescActive}
58-
onClick={toggleConnectionDesc}
58+
onChange={toggleConnectionDesc}
5959
/>
6060
</label>
6161
<label className="label cursor-pointer">
@@ -67,7 +67,7 @@ export function Menu({
6767
className="toggle"
6868
aria-label="node-description"
6969
checked={isNodeDescActive}
70-
onClick={toggleNodeDesc}
70+
onChange={toggleNodeDesc}
7171
/>
7272
</label>
7373
</>

calm-hub-ui/src/visualizer/components/sidebar/Sidebar.tsx

Lines changed: 67 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -52,57 +52,74 @@ export function Sidebar({ selectedData, closeSidebar }: SidebarProps) {
5252
<div>
5353
<div className="text-xl font-bold mb-2">Node Details</div>
5454
<div className="space-y-2">
55-
<p>
56-
<span className="font-light">unique-id: </span>
57-
<span className="font-semibold">{selectedData.id}</span>
58-
</p>
59-
<p>
60-
<span className="font-light">name: </span>
61-
<span className="font-semibold">{selectedData.label}</span>
62-
</p>
63-
<p>
64-
<span className="font-light">node-type: </span>
65-
<span className="font-semibold">{selectedData.type}</span>
66-
</p>
67-
<p>
68-
<span className="font-light">description: </span>
69-
<span className="font-semibold">{selectedData.description}</span>
70-
</p>
71-
72-
<p>
73-
<div className="flex items-center justify-between">
74-
<span className="font-light">interfaces: </span>
75-
<button
76-
aria-label="toggle-interfaces"
77-
onClick={toggleInterfacesVisibility}
78-
className="ml-auto btn btn-xs btn-outline"
79-
>
80-
{isInterfacesVisible ? (
81-
<IoRemoveOutline size={16} />
82-
) : (
83-
<IoAddOutline size={16} />
84-
)}
85-
</button>
86-
</div>{' '}
87-
</p>
88-
<div className="space-y-4">
89-
{selectedData.interfaces?.map((interfaceItem: any, index: Key) => (
90-
<div key={index} className="ml-4 border-b border-gray-300 pb-4">
91-
<div className="space-y-1">
92-
{Object.entries(interfaceItem).map(([key, value]) => (
93-
<div key={key} className="flex cursor-default">
94-
<span className="font-light">
95-
{key}:{''}
96-
</span>
97-
<span className="font-semibold">
98-
{String(value)}
99-
</span>
100-
</div>
101-
))}
102-
</div>
103-
</div>
104-
))}
55+
<div className="node-details">
56+
<p>
57+
<span className="font-light">unique-id: </span>
58+
<span className="font-semibold">{selectedData.id}</span>
59+
</p>
60+
<p>
61+
<span className="font-light">name: </span>
62+
<span className="font-semibold">{selectedData.label}</span>
63+
</p>
64+
<p>
65+
<span className="font-light">node-type: </span>
66+
<span className="font-semibold">{selectedData.type}</span>
67+
</p>
68+
<p>
69+
<span className="font-light">description: </span>
70+
<span className="font-semibold">
71+
{selectedData.description}
72+
</span>
73+
</p>
10574
</div>
75+
{selectedData.interfaces && (
76+
<div className="interfaces">
77+
<div className="flex items-center justify-between">
78+
<span className="font-light">interfaces: </span>
79+
<button
80+
aria-label="toggle-interfaces"
81+
onClick={toggleInterfacesVisibility}
82+
className="ml-auto btn btn-xs btn-outline"
83+
>
84+
{isInterfacesVisible ? (
85+
<IoRemoveOutline size={16} />
86+
) : (
87+
<IoAddOutline size={16} />
88+
)}
89+
</button>
90+
</div>
91+
{isInterfacesVisible && (
92+
<div className="space-y-4">
93+
{selectedData.interfaces.map(
94+
(interfaceItem: any, index: Key) => (
95+
<div
96+
key={index}
97+
className="ml-4 border-b border-gray-300 pb-4"
98+
>
99+
<div className="space-y-1">
100+
{Object.entries(interfaceItem).map(
101+
([key, value]) => (
102+
<div
103+
key={key}
104+
className="flex cursor-default"
105+
>
106+
<span className="font-light">
107+
{key}:{' '}
108+
</span>
109+
<span className="font-semibold">
110+
{String(value)}
111+
</span>
112+
</div>
113+
)
114+
)}
115+
</div>
116+
</div>
117+
)
118+
)}
119+
</div>
120+
)}
121+
</div>
122+
)}
106123
</div>
107124
</div>
108125
)}

0 commit comments

Comments
 (0)