Skip to content

Commit e6bd085

Browse files
Jasonxia007Jasonxia007
committed
♻️ Delete Radix UI Dependency: Tooltip
1 parent b392c02 commit e6bd085

File tree

9 files changed

+473
-578
lines changed

9 files changed

+473
-578
lines changed

‎frontend/app/[locale]/agents/components/agent/SubAgentPool.tsx‎

Lines changed: 71 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,7 @@ import {
1616
} from "lucide-react";
1717

1818
import { ScrollArea } from "@/components/ui/scrollArea";
19-
import {
20-
Tooltip,
21-
TooltipContent,
22-
TooltipProvider,
23-
TooltipTrigger,
24-
} from "@/components/ui/tooltip";
19+
import { Tooltip, TooltipProvider } from "@/components/ui/tooltip";
2520
import { Agent, SubAgentPoolProps } from "@/types/agentConfig";
2621

2722
import AgentCallRelationshipModal from "@/components/ui/AgentCallRelationshipModal";
@@ -176,14 +171,19 @@ export default function SubAgentPool({
176171
<div className="mb-4">
177172
<Row gutter={12}>
178173
<Col xs={24} sm={12}>
179-
<Tooltip>
180-
<TooltipTrigger asChild>
181-
<div
182-
className={`rounded-md p-2 flex items-center cursor-pointer transition-all duration-200 min-h-[70px] ${
183-
isCreatingNewAgent
184-
? "bg-blue-100 border border-blue-200 shadow-sm" // Highlight in creation mode
185-
: "bg-white hover:bg-blue-50 hover:shadow-sm"
186-
}`}
174+
<Tooltip
175+
title={
176+
isCreatingNewAgent
177+
? t("subAgentPool.tooltip.exitCreateMode")
178+
: t("subAgentPool.tooltip.createNewAgent")
179+
}
180+
>
181+
<div
182+
className={`rounded-md p-2 flex items-center cursor-pointer transition-all duration-200 min-h-[70px] ${
183+
isCreatingNewAgent
184+
? "bg-blue-100 border border-blue-200 shadow-sm" // Highlight in creation mode
185+
: "bg-white hover:bg-blue-50 hover:shadow-sm"
186+
}`}
187187
onClick={() => {
188188
if (isCreatingNewAgent) {
189189
// If currently in creation mode, click to exit creation mode
@@ -230,26 +230,25 @@ export default function SubAgentPool({
230230
: t("subAgentPool.description.createAgent")}
231231
</div>
232232
</div>
233-
</div>
234233
</div>
235-
</TooltipTrigger>
236-
<TooltipContent>
237-
{isCreatingNewAgent
238-
? t("subAgentPool.tooltip.exitCreateMode")
239-
: t("subAgentPool.tooltip.createNewAgent")}
240-
</TooltipContent>
234+
</div>
241235
</Tooltip>
242236
</Col>
243237

244238
<Col xs={24} sm={12}>
245-
<Tooltip>
246-
<TooltipTrigger asChild>
247-
<div
248-
className={`rounded-md p-2 flex items-center transition-all duration-200 min-h-[70px] ${
249-
isImporting
250-
? "bg-gray-100 cursor-not-allowed" // Importing: disabled state
251-
: "bg-white cursor-pointer hover:bg-green-50 hover:shadow-sm" // Normal state: clickable
252-
}`}
239+
<Tooltip
240+
title={
241+
isImporting
242+
? t("subAgentPool.description.importing")
243+
: t("subAgentPool.description.importAgent")
244+
}
245+
>
246+
<div
247+
className={`rounded-md p-2 flex items-center transition-all duration-200 min-h-[70px] ${
248+
isImporting
249+
? "bg-gray-100 cursor-not-allowed" // Importing: disabled state
250+
: "bg-white cursor-pointer hover:bg-green-50 hover:shadow-sm" // Normal state: clickable
251+
}`}
253252
onClick={isImporting ? undefined : onImportAgent}
254253
>
255254
<div
@@ -280,14 +279,8 @@ export default function SubAgentPool({
280279
: t("subAgentPool.description.importAgent")}
281280
</div>
282281
</div>
283-
</div>
284282
</div>
285-
</TooltipTrigger>
286-
<TooltipContent>
287-
{isImporting
288-
? t("subAgentPool.description.importing")
289-
: t("subAgentPool.description.importAgent")}
290-
</TooltipContent>
283+
</div>
291284
</Tooltip>
292285
</Col>
293286
</Row>
@@ -371,84 +364,64 @@ export default function SubAgentPool({
371364
<div className="flex items-center gap-1 ml-2 flex-shrink-0">
372365
{/* Copy agent button */}
373366
{onCopyAgent && (
374-
<Tooltip>
375-
<TooltipTrigger asChild>
376-
<Button
377-
type="text"
378-
size="small"
379-
icon={<Copy className="w-4 h-4" />}
380-
onClick={(e) => {
381-
e.preventDefault();
382-
e.stopPropagation();
383-
onCopyAgent(agent);
384-
}}
385-
className="agent-action-button agent-action-button-blue"
386-
/>
387-
</TooltipTrigger>
388-
<TooltipContent>
389-
{t("agent.contextMenu.copy")}
390-
</TooltipContent>
391-
</Tooltip>
392-
)}
393-
{/* View call relationship button */}
394-
<Tooltip>
395-
<TooltipTrigger asChild>
367+
<Tooltip title={t("agent.contextMenu.copy")}>
396368
<Button
397369
type="text"
398370
size="small"
399-
icon={<Network className="w-4 h-4" />}
371+
icon={<Copy className="w-4 h-4" />}
400372
onClick={(e) => {
401373
e.preventDefault();
402374
e.stopPropagation();
403-
handleViewCallRelationship(agent);
375+
onCopyAgent(agent);
404376
}}
405377
className="agent-action-button agent-action-button-blue"
406378
/>
407-
</TooltipTrigger>
408-
<TooltipContent>
409-
{t("agent.action.viewCallRelationship")}
410-
</TooltipContent>
379+
</Tooltip>
380+
)}
381+
{/* View call relationship button */}
382+
<Tooltip title={t("agent.action.viewCallRelationship")}>
383+
<Button
384+
type="text"
385+
size="small"
386+
icon={<Network className="w-4 h-4" />}
387+
onClick={(e) => {
388+
e.preventDefault();
389+
e.stopPropagation();
390+
handleViewCallRelationship(agent);
391+
}}
392+
className="agent-action-button agent-action-button-blue"
393+
/>
411394
</Tooltip>
412395
{/* Export button */}
413396
{onExportAgent && (
414-
<Tooltip>
415-
<TooltipTrigger asChild>
416-
<Button
417-
type="text"
418-
size="small"
419-
icon={<FileOutput className="w-4 h-4" />}
420-
onClick={(e) => {
421-
e.preventDefault();
422-
e.stopPropagation();
423-
onExportAgent(agent);
424-
}}
425-
className="agent-action-button agent-action-button-green"
426-
/>
427-
</TooltipTrigger>
428-
<TooltipContent>
429-
{t("agent.contextMenu.export")}
430-
</TooltipContent>
397+
<Tooltip title={t("agent.contextMenu.export")}>
398+
<Button
399+
type="text"
400+
size="small"
401+
icon={<FileOutput className="w-4 h-4" />}
402+
onClick={(e) => {
403+
e.preventDefault();
404+
e.stopPropagation();
405+
onExportAgent(agent);
406+
}}
407+
className="agent-action-button agent-action-button-green"
408+
/>
431409
</Tooltip>
432410
)}
433411
{/* Delete button */}
434412
{onDeleteAgent && (
435-
<Tooltip>
436-
<TooltipTrigger asChild>
437-
<Button
438-
type="text"
439-
size="small"
440-
icon={<Trash2 className="w-4 h-4" />}
441-
onClick={(e) => {
442-
e.preventDefault();
443-
e.stopPropagation();
444-
onDeleteAgent(agent);
445-
}}
446-
className="agent-action-button agent-action-button-red"
447-
/>
448-
</TooltipTrigger>
449-
<TooltipContent>
450-
{t("agent.contextMenu.delete")}
451-
</TooltipContent>
413+
<Tooltip title={t("agent.contextMenu.delete")}>
414+
<Button
415+
type="text"
416+
size="small"
417+
icon={<Trash2 className="w-4 h-4" />}
418+
onClick={(e) => {
419+
e.preventDefault();
420+
e.stopPropagation();
421+
onDeleteAgent(agent);
422+
}}
423+
className="agent-action-button agent-action-button-red"
424+
/>
452425
</Tooltip>
453426
)}
454427
</div>

0 commit comments

Comments
 (0)