Skip to content

Commit 54c457f

Browse files
tinomarquestinomarques
authored
Requests Drawer Refresh (#3491)
1 parent 303bd46 commit 54c457f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+3459
-4130
lines changed

‎web/components/layout/SidebarHelpDropdown.tsx

+17-19
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const SidebarHelpDropdown = ({
3838

3939
const [chatOpen, setChatOpen] = useState(false);
4040
return (
41-
<div className="flex flex-col items-start w-full gap-1.5">
41+
<div className="w-full flex flex-col items-center gap-2">
4242
<DropdownMenu
4343
modal={false}
4444
onOpenChange={
@@ -49,11 +49,11 @@ const SidebarHelpDropdown = ({
4949
>
5050
<DropdownMenuTrigger asChild>
5151
<Button
52-
variant="ghost"
53-
size="sm"
52+
variant="outline"
53+
size="none"
5454
className={clsx(
55-
"flex items-center text-xs text-muted-foreground hover:text-foreground w-full h-7",
56-
isCollapsed ? "justify-center px-0" : "justify-start px-2 gap-1.5"
55+
"h-9 flex items-center text-xs text-muted-foreground hover:text-foreground",
56+
isCollapsed ? "w-9" : "w-full gap-1"
5757
)}
5858
>
5959
<div className="relative flex items-center">
@@ -145,8 +145,8 @@ const SidebarHelpDropdown = ({
145145
</DropdownMenu>
146146

147147
<Button
148-
variant="ghost"
149-
size="sm"
148+
variant="outline"
149+
size="none"
150150
onClick={() => {
151151
if (window.Pylon) {
152152
if (chatOpen) {
@@ -158,21 +158,19 @@ const SidebarHelpDropdown = ({
158158
}
159159
}}
160160
className={clsx(
161-
"flex items-center text-xs text-muted-foreground hover:text-foreground w-full h-7",
162-
isCollapsed ? "justify-center px-0" : "justify-start px-2 gap-1.5",
161+
"flex items-center text-xs text-muted-foreground hover:text-foreground",
162+
isCollapsed ? "h-9 w-9" : "h-7 w-full gap-1",
163163
chatOpen && "text-primary"
164164
)}
165165
>
166-
<div className="relative flex items-center">
167-
<MessageCircleMore
168-
size={12}
169-
className={clsx(
170-
chatOpen
171-
? "text-primary"
172-
: "text-muted-foreground hover:text-primary"
173-
)}
174-
/>
175-
</div>
166+
<MessageCircleMore
167+
size={12}
168+
className={clsx(
169+
chatOpen
170+
? "text-primary"
171+
: "text-muted-foreground hover:text-primary"
172+
)}
173+
/>
176174
{!isCollapsed && <span>Message us</span>}
177175
</Button>
178176
</div>

‎web/components/layout/orgDropdown.tsx

+5-4
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ import {
1010
DropdownMenuTrigger,
1111
} from "@/components/ui/dropdown-menu";
1212
import { Switch } from "@/components/ui/switch";
13-
import { cn } from "@/lib/utils";
1413
import { Database } from "@/db/database.types";
15-
import { Cog6ToothIcon } from "@heroicons/react/24/outline";
14+
import { cn } from "@/lib/utils";
1615
import { useSupabaseClient, useUser } from "@supabase/auth-helpers-react";
17-
import { LogOutIcon } from "lucide-react";
16+
17+
import { getTierDisplayInfo } from "@/utils/pricingConfigs";
1818
import { useTheme } from "next-themes";
1919
import Link from "next/link";
2020
import { useRouter } from "next/router";
@@ -29,7 +29,8 @@ import {
2929
import { UpgradeProDialog } from "../templates/organization/plan/upgradeProDialog";
3030
import { useOrg } from "./org/organizationContext";
3131
import OrgMoreDropdown from "./orgMoreDropdown";
32-
import { getTierDisplayInfo } from "@/utils/pricingConfigs";
32+
import { Cog6ToothIcon } from "@heroicons/react/24/outline";
33+
import { LogOutIcon } from "lucide-react";
3334

3435
interface OrgDropdownProps {}
3536

‎web/components/shared/Header.tsx

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { ReactNode } from "react";
2+
import { P } from "../ui/typography";
3+
4+
interface HeaderProps {
5+
title: string;
6+
leftActions?: ReactNode;
7+
rightActions?: ReactNode;
8+
}
9+
export default function Header(props: HeaderProps) {
10+
const { title, leftActions, rightActions } = props;
11+
return (
12+
<header className="h-16 shrink-0 bg-slate-100 dark:bg-slate-900 flex flex-row justify-between items-center w-full border-b border-border px-4">
13+
<div className="h-full flex flex-row items-center gap-2">
14+
<P className="text-muted-foreground font-semibold">{title}</P>
15+
{leftActions}
16+
</div>
17+
18+
<div className="h-full flex flex-row items-center gap-2">
19+
{rightActions}
20+
</div>
21+
</header>
22+
);
23+
}

‎web/components/shared/LivePill.tsx

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import { ArrowPathIcon } from "@heroicons/react/24/outline";
2+
import clsx from "clsx";
3+
import { Button } from "../ui/button";
4+
5+
interface LivePillProps {
6+
isLive: boolean;
7+
setIsLive: (isLive: boolean) => void;
8+
isDataLoading: boolean;
9+
isRefetching: boolean;
10+
refetch: () => void;
11+
}
12+
export default function LivePill(props: LivePillProps) {
13+
const { isLive, setIsLive, isDataLoading, isRefetching, refetch } = props;
14+
return (
15+
<div className="h-8 w-full flex flex-row items-center justify-between bg-slate-50 dark:bg-slate-950 rounded-lg border border-border divide-x divide-border">
16+
<Button
17+
variant="none"
18+
size="none"
19+
className="h-full px-2.5 flex flex-row gap-2 items-center rounded-l-lg rounded-r-none hover:bg-slate-100 dark:hover:bg-slate-900 active:bg-slate-200 active:dark:bg-slate-800"
20+
onClick={() => setIsLive(!isLive)}
21+
>
22+
<div
23+
className={clsx(
24+
isLive ? "bg-green-500 animate-pulse" : "bg-slate-500",
25+
"h-2 w-2 rounded-full"
26+
)}
27+
/>
28+
<span className="text-xs whitespace-nowrap">
29+
{isLive ? "Live" : "Start Live"}
30+
</span>
31+
</Button>
32+
33+
<Button
34+
variant="none"
35+
size="none"
36+
className="h-full px-2.5 flex flex-row gap-1 items-center rounded-l-none rounded-r-lg hover:bg-slate-100 dark:hover:bg-slate-900 active:bg-slate-200 active:dark:bg-slate-800"
37+
onClick={() => {
38+
refetch();
39+
}}
40+
>
41+
<ArrowPathIcon
42+
className={clsx(
43+
isDataLoading || isRefetching ? "animate-spin" : "",
44+
"h-4 w-4 inline duration-500 ease-in-out"
45+
)}
46+
/>
47+
</Button>
48+
</div>
49+
);
50+
}

‎web/components/shared/prompts/ParametersPanel.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -358,7 +358,7 @@ export default function ParametersPanel({
358358
</ParameterLabel>
359359
<div className="flex gap-2">
360360
<Select value={selectedCreator} onValueChange={handleCreatorChange}>
361-
<SelectTrigger className="w-28 h-8">
361+
<SelectTrigger variant="helicone" className="w-28 h-8">
362362
<SelectValue placeholder="Creator" />
363363
</SelectTrigger>
364364
<SelectContent>
@@ -373,7 +373,7 @@ export default function ParametersPanel({
373373
value={currentModelName || ""}
374374
onValueChange={handleModelChange}
375375
>
376-
<SelectTrigger className="w-44 h-8">
376+
<SelectTrigger variant="helicone" className="w-36 h-8">
377377
<SelectValue placeholder="Model" />
378378
</SelectTrigger>
379379
<SelectContent>
@@ -388,7 +388,7 @@ export default function ParametersPanel({
388388
value={parameters.provider as string}
389389
onValueChange={handleProviderChange}
390390
>
391-
<SelectTrigger className="w-32 h-8">
391+
<SelectTrigger variant="helicone" className="w-28 h-8">
392392
<SelectValue placeholder="Provider" />
393393
</SelectTrigger>
394394
<SelectContent>
@@ -463,7 +463,7 @@ export default function ParametersPanel({
463463
})
464464
}
465465
>
466-
<SelectTrigger className="w-28 h-8">
466+
<SelectTrigger variant="helicone" className="w-28 h-8">
467467
<SelectValue placeholder="Effort" />
468468
</SelectTrigger>
469469
<SelectContent>

‎web/components/shared/prompts/ResponsePanel.tsx

+9-9
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export default function ResponsePanel({
124124
}
125125

126126
// Define custom components for ReactMarkdown
127-
const markdownComponents: Components = {
127+
export const markdownComponents: Components = {
128128
code({ className, children, ...props }) {
129129
// Check if this is an inline code block by examining the parent node
130130
const isInline = !className?.includes("language-");
@@ -165,29 +165,29 @@ const markdownComponents: Components = {
165165
},
166166
// Add styling for other markdown elements
167167
p({ children }) {
168-
return <p className="mb-4 leading-6">{children}</p>;
168+
return <p className="leading-6">{children}</p>;
169169
},
170170
ul({ children }) {
171-
return <ul className="mb-4 ml-6 list-disc">{children}</ul>;
171+
return <ul className="ml-6 list-disc">{children}</ul>;
172172
},
173173
ol({ children }) {
174-
return <ol className="mb-4 ml-6 list-decimal">{children}</ol>;
174+
return <ol className="ml-6 list-decimal">{children}</ol>;
175175
},
176176
li({ children }) {
177-
return <li className="mb-2">{children}</li>;
177+
return <li className="">{children}</li>;
178178
},
179179
h1({ children }) {
180-
return <h1 className="mb-4 text-2xl font-semibold">{children}</h1>;
180+
return <h1 className="text-2xl font-semibold">{children}</h1>;
181181
},
182182
h2({ children }) {
183-
return <h2 className="mb-3 text-xl font-semibold">{children}</h2>;
183+
return <h2 className="text-xl font-semibold">{children}</h2>;
184184
},
185185
h3({ children }) {
186-
return <h3 className="mb-3 text-lg font-semibold">{children}</h3>;
186+
return <h3 className="text-lg font-semibold">{children}</h3>;
187187
},
188188
blockquote({ children }) {
189189
return (
190-
<blockquote className="mb-4 border-l-4 border-muted-foreground/30 pl-4 italic text-muted-foreground">
190+
<blockquote className="border-l-4 border-muted-foreground/30 pl-4 italic text-muted-foreground">
191191
{children}
192192
</blockquote>
193193
);

‎web/components/shared/themed/table/exportButton.tsx

+12-14
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,3 @@
1-
import { ArrowDownTrayIcon, ArrowPathIcon } from "@heroicons/react/24/outline";
2-
import Link from "next/link";
3-
import Papa from "papaparse";
4-
import { useState } from "react";
5-
import { clsx } from "../../clsx";
6-
import useNotification from "../../notification/useNotification";
7-
import ThemedModal from "../themedModal";
81
import { Button } from "@/components/ui/button";
92
import {
103
Select,
@@ -19,6 +12,14 @@ import {
1912
TooltipProvider,
2013
TooltipTrigger,
2114
} from "@/components/ui/tooltip";
15+
import { ArrowPathIcon } from "@heroicons/react/24/outline";
16+
import Link from "next/link";
17+
import Papa from "papaparse";
18+
import { useState } from "react";
19+
import { LuDownload } from "react-icons/lu";
20+
import { clsx } from "../../clsx";
21+
import useNotification from "../../notification/useNotification";
22+
import ThemedModal from "../themedModal";
2223

2324
interface ExportButtonProps<T> {
2425
rows: T[];
@@ -89,15 +90,12 @@ export default function ExportButton<T>(props: ExportButtonProps<T>) {
8990
<Tooltip>
9091
<TooltipTrigger asChild>
9192
<Button
92-
variant="ghost"
93+
variant="none"
94+
size="none"
95+
className="h-9 w-9 shrink-0 flex items-center justify-center text-slate-700 dark:text-slate-300 hover:bg-slate-200 dark:hover:bg-slate-800"
9396
onClick={() => setOpen(true)}
94-
className={clsx(
95-
"flex items-center gap-2 text-slate-700 dark:text-slate-400",
96-
className
97-
)}
98-
size="xs"
9997
>
100-
<ArrowDownTrayIcon className="h-4 w-4" />
98+
<LuDownload className="h-4 w-4" />
10199
</Button>
102100
</TooltipTrigger>
103101
<TooltipContent>Export data</TooltipContent>

‎web/components/shared/themed/table/requestRowView.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ const RequestRowView = (props: RequestRowViewProps) => {
3434
</ul>
3535
{selectedRow ? (
3636
<div className="flex flex-col space-y-2 w-full h-full overflow-auto">
37-
<RenderMappedRequest mapperContent={selectedRow} />
37+
<RenderMappedRequest mappedRequest={selectedRow} />
3838
</div>
3939
) : (
4040
<div className="flex flex-col space-y-4 justify-center items-center w-full h-screen bg-white border border-gray-300 dark:bg-black dark:border-gray-700 rounded-lg">

0 commit comments

Comments
 (0)