Skip to content

Commit

Permalink
UI chore: move TooltipProvider to root
Browse files Browse the repository at this point in the history
Signed-off-by: Ryan Hopper-Lowe <[email protected]>
  • Loading branch information
ryanhopperlowe committed Nov 8, 2024
1 parent 4053e5a commit f7df46b
Show file tree
Hide file tree
Showing 23 changed files with 647 additions and 749 deletions.
25 changes: 10 additions & 15 deletions ui/admin/app/components/TruncatedText.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import { TypographyP } from "~/components/Typography";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "~/components/ui/tooltip";

Expand All @@ -16,19 +15,15 @@ export function TruncatedText({
className?: string;
}) {
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div className={cn(`truncate cursor-pointer`, className)}>
<TypographyP className="truncate">
{content}
</TypographyP>
</div>
</TooltipTrigger>
<TooltipContent>
<p>{content}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div className={cn(`truncate cursor-pointer`, className)}>
<TypographyP className="truncate">{content}</TypographyP>
</div>
</TooltipTrigger>
<TooltipContent>
<p>{content}</p>
</TooltipContent>
</Tooltip>
);
}
115 changes: 55 additions & 60 deletions ui/admin/app/components/agent/PastThreads.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,6 @@ import {
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "~/components/ui/tooltip";

Expand Down Expand Up @@ -60,64 +59,60 @@ export const PastThreads: React.FC<PastThreadsProps> = ({
};

return (
<TooltipProvider>
<Tooltip>
<Popover open={open} onOpenChange={handleOpenChange}>
<PopoverTrigger asChild>
<TooltipTrigger asChild>
<Button variant="secondary" size="icon">
<ChevronUpIcon className="w-4 h-4" />
</Button>
</TooltipTrigger>
</PopoverTrigger>
<TooltipContent>Switch threads</TooltipContent>
<PopoverContent className="w-80 p-0">
<Command className="flex-col-reverse">
<CommandInput placeholder="Search threads..." />
<CommandList>
<CommandEmpty>No threads found.</CommandEmpty>
{isLoading ? (
<div className="flex justify-center items-center h-20">
<LoadingSpinner size={24} />
</div>
) : error ? (
<div className="text-center text-red-500 p-2">
Failed to load threads
</div>
) : threads && threads.length > 0 ? (
<CommandGroup>
{threads.map((thread: Thread) => (
<CommandItem
key={thread.id}
onSelect={() =>
handleThreadSelect(
thread.id
)
}
className="cursor-pointer"
>
<div>
<TypographyP className="font-semibold">
Thread
<span className="ml-2 text-muted-foreground">
{thread.id}
</span>
</TypographyP>
<TypographyP className="text-sm text-gray-500">
{new Date(
thread.created
).toLocaleString()}
</TypographyP>
</div>
</CommandItem>
))}
</CommandGroup>
) : null}
</CommandList>
</Command>
</PopoverContent>
</Popover>
</Tooltip>
</TooltipProvider>
<Tooltip>
<Popover open={open} onOpenChange={handleOpenChange}>
<PopoverTrigger asChild>
<TooltipTrigger asChild>
<Button variant="secondary" size="icon">
<ChevronUpIcon className="w-4 h-4" />
</Button>
</TooltipTrigger>
</PopoverTrigger>
<TooltipContent>Switch threads</TooltipContent>
<PopoverContent className="w-80 p-0">
<Command className="flex-col-reverse">
<CommandInput placeholder="Search threads..." />
<CommandList>
<CommandEmpty>No threads found.</CommandEmpty>
{isLoading ? (
<div className="flex justify-center items-center h-20">
<LoadingSpinner size={24} />
</div>
) : error ? (
<div className="text-center text-red-500 p-2">
Failed to load threads
</div>
) : threads && threads.length > 0 ? (
<CommandGroup>
{threads.map((thread: Thread) => (
<CommandItem
key={thread.id}
onSelect={() =>
handleThreadSelect(thread.id)
}
className="cursor-pointer"
>
<div>
<TypographyP className="font-semibold">
Thread
<span className="ml-2 text-muted-foreground">
{thread.id}
</span>
</TypographyP>
<TypographyP className="text-sm text-gray-500">
{new Date(
thread.created
).toLocaleString()}
</TypographyP>
</div>
</CommandItem>
))}
</CommandGroup>
) : null}
</CommandList>
</Command>
</PopoverContent>
</Popover>
</Tooltip>
);
};
52 changes: 24 additions & 28 deletions ui/admin/app/components/agent/ToolForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import { Switch } from "~/components/ui/switch";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "~/components/ui/tooltip";

Expand Down Expand Up @@ -164,33 +163,30 @@ export function ToolForm({
tool={field.tool}
onDelete={() => removeTools([field.tool])}
actions={
<TooltipProvider>
<Tooltip>
<TooltipTrigger>
<Switch
checked={
field.variant ===
ToolVariant.DEFAULT
}
onCheckedChange={(checked) =>
updateVariant(
field.tool,
checked
? ToolVariant.DEFAULT
: ToolVariant.AVAILABLE
)
}
/>
</TooltipTrigger>

<TooltipContent>
{field.variant ===
ToolVariant.DEFAULT
? "Active by Default"
: "Inactive by Default"}
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Tooltip>
<TooltipTrigger>
<Switch
checked={
field.variant ===
ToolVariant.DEFAULT
}
onCheckedChange={(checked) =>
updateVariant(
field.tool,
checked
? ToolVariant.DEFAULT
: ToolVariant.AVAILABLE
)
}
/>
</TooltipTrigger>

<TooltipContent>
{field.variant === ToolVariant.DEFAULT
? "Active by Default"
: "Inactive by Default"}
</TooltipContent>
</Tooltip>
}
/>
))}
Expand Down
74 changes: 35 additions & 39 deletions ui/admin/app/components/chat/CallFrames.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import { Card, CardContent } from "~/components/ui/card";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "~/components/ui/tooltip";

Expand Down Expand Up @@ -331,44 +330,41 @@ const CallFrames = ({ calls }: { calls: CallsType }) => {
<div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-bold">Call Frames</h2>
<div className="flex gap-2">
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
onClick={handleDownload}
size="icon"
variant="outline"
className="text-gray-800 dark:text-white"
>
<DownloadIcon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Download calls data</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
onClick={() => setAllOpen(!allOpen)}
size="icon"
variant="outline"
className="text-gray-800 dark:text-white"
>
{allOpen ? (
<ChevronUpIcon />
) : (
<ChevronDownIcon />
)}
</Button>
</TooltipTrigger>
<TooltipContent>
<p>{allOpen ? "Collapse all" : "Expand all"}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
onClick={handleDownload}
size="icon"
variant="outline"
className="text-gray-800 dark:text-white"
>
<DownloadIcon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Download calls data</p>
</TooltipContent>
</Tooltip>

<Tooltip>
<TooltipTrigger asChild>
<Button
onClick={() => setAllOpen(!allOpen)}
size="icon"
variant="outline"
className="text-gray-800 dark:text-white"
>
{allOpen ? (
<ChevronUpIcon />
) : (
<ChevronDownIcon />
)}
</Button>
</TooltipTrigger>
<TooltipContent>
<p>{allOpen ? "Collapse all" : "Expand all"}</p>
</TooltipContent>
</Tooltip>
</div>
</div>
{rootNodes?.length > 0 ? (
Expand Down
48 changes: 23 additions & 25 deletions ui/admin/app/components/chat/MessageDebug.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ import {
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "~/components/ui/tooltip";

Expand All @@ -32,30 +31,29 @@ export function MessageDebug({ runId, variant }: MessageDebugProps) {

return (
<Dialog>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<DialogTrigger asChild>
<Button
size="icon"
variant={variant}
onClick={() => {
RunsService.getRunDebugById(runId).then(
(runDebug) => {
setRunDebug(runDebug.frames);
}
);
}}
>
<CodeIcon className="w-4 h-4" />
</Button>
</DialogTrigger>
</TooltipTrigger>
<TooltipContent>
<p>View details</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<DialogTrigger asChild>
<Button
size="icon"
variant={variant}
onClick={() => {
RunsService.getRunDebugById(runId).then(
(runDebug) => {
setRunDebug(runDebug.frames);
}
);
}}
>
<CodeIcon className="w-4 h-4" />
</Button>
</DialogTrigger>
</TooltipTrigger>
<TooltipContent>
<p>View details</p>
</TooltipContent>
</Tooltip>

<DialogContent
className={`transition-all duration-300 ease-in-out ${
isFullscreen
Expand Down
Loading

0 comments on commit f7df46b

Please sign in to comment.