apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-04-26 01:06:23 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: streamline ApprovalCard component across various tools

Browse source
This commit is contained in:
Anish Sarkar 2026-03-20 20:53:59 +05:30
parent bd2d633546
commit 4bd2071a8d
14 changed files with 225 additions and 267 deletions
Download patch file Download diff file Expand all files Collapse all files

37
surfsense_web/components/tool-ui/gmail/create-draft.tsx
View file

@ -129,6 +129,7 @@ function ApprovalCard({
const [decided, setDecided] = useState<"approve" | "reject" | "edit" | null>(
interruptData.__decided__ ?? null
);
const wasAlreadyDecided = interruptData.__decided__ != null;
const [isPanelOpen, setIsPanelOpen] = useState(false);
const openHitlEditPanel = useSetAtom(openHitlEditPanelAtom);
@ -175,8 +176,6 @@ function ApprovalCard({
return () => window.removeEventListener("keydown", handler);
}, [handleApprove]);
if (decided && decided !== "reject") return null;
return (
<div className="my-4 max-w-lg overflow-hidden rounded-2xl border bg-muted/30 transition-all duration-300">
{/* Header */}
@ -190,15 +189,21 @@ function ApprovalCard({
? "Gmail Draft Approved"
: "Create Gmail Draft"}
</p>
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Draft creation was cancelled"
: decided === "edit"
? "Draft creation is in progress with your changes"
: decided === "approve"
? "Draft creation is in progress"
: "Requires your approval to proceed"}
</p>
{decided === "approve" || decided === "edit" ? (
wasAlreadyDecided ? (
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "edit" ? "Draft created with your changes" : "Draft created"}
</p>
) : (
<TextShimmerLoader text={decided === "edit" ? "Creating draft with your changes" : "Creating draft"} size="sm" />
)
) : (
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Draft creation was cancelled"
: "Requires your approval to proceed"}
</p>
)}
</div>
</div>
{!decided && canEdit && (
@ -436,15 +441,7 @@ export const CreateGmailDraftToolUI = makeAssistantToolUI<
CreateGmailDraftResult
>({
toolName: "create_gmail_draft",
render: function CreateGmailDraftUI({ args, result, status }) {
if (status.type === "running") {
return (
<div className="my-4 max-w-lg rounded-2xl border bg-muted/30 px-5 py-4 select-none">
<TextShimmerLoader text="Creating Gmail draft..." size="sm" />
</div>
);
}
render: function CreateGmailDraftUI({ args, result, status: _status }) {
if (!result) return null;
if (isInterruptResult(result)) {

37
surfsense_web/components/tool-ui/gmail/send-email.tsx
View file

@ -130,6 +130,7 @@ function ApprovalCard({
const [decided, setDecided] = useState<"approve" | "reject" | "edit" | null>(
interruptData.__decided__ ?? null
);
const wasAlreadyDecided = interruptData.__decided__ != null;
const [isPanelOpen, setIsPanelOpen] = useState(false);
const openHitlEditPanel = useSetAtom(openHitlEditPanelAtom);
@ -176,8 +177,6 @@ function ApprovalCard({
return () => window.removeEventListener("keydown", handler);
}, [handleApprove]);
if (decided && decided !== "reject") return null;
return (
<div className="my-4 max-w-lg overflow-hidden rounded-2xl border bg-muted/30 transition-all duration-300">
{/* Header */}
@ -192,15 +191,21 @@ function ApprovalCard({
? "Email Sending Approved"
: "Send Email"}
</p>
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Email sending was cancelled"
: decided === "edit"
? "Email is being sent with your changes"
: decided === "approve"
? "Email is being sent"
: "This will send the email immediately"}
</p>
{decided === "approve" || decided === "edit" ? (
wasAlreadyDecided ? (
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "edit" ? "Email sent with your changes" : "Email sent"}
</p>
) : (
<TextShimmerLoader text={decided === "edit" ? "Sending email with your changes" : "Sending email"} size="sm" />
)
) : (
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Email sending was cancelled"
: "Requires your approval to proceed"}
</p>
)}
</div>
</div>
{!decided && canEdit && (
@ -439,15 +444,7 @@ export const SendGmailEmailToolUI = makeAssistantToolUI<
SendGmailEmailResult
>({
toolName: "send_gmail_email",
render: function SendGmailEmailUI({ args, result, status }) {
if (status.type === "running") {
return (
<div className="my-4 max-w-lg rounded-2xl border bg-muted/30 px-5 py-4 select-none">
<TextShimmerLoader text="Sending email..." size="sm" />
</div>
);
}
render: function SendGmailEmailUI({ args, result, status: _status }) {
if (!result) return null;
if (isInterruptResult(result)) {

31
surfsense_web/components/tool-ui/gmail/trash-email.tsx
View file

@ -149,6 +149,7 @@ function ApprovalCard({
const [decided, setDecided] = useState<"approve" | "reject" | null>(
interruptData.__decided__ ?? null
);
const wasAlreadyDecided = interruptData.__decided__ != null;
const [deleteFromKb, setDeleteFromKb] = useState(false);
const account = interruptData.context?.account;
@ -180,8 +181,6 @@ function ApprovalCard({
return () => window.removeEventListener("keydown", handler);
}, [handleApprove]);
if (decided && decided !== "reject") return null;
return (
<div className="my-4 max-w-lg overflow-hidden rounded-2xl border bg-muted/30 transition-all duration-300">
{/* Header */}
@ -196,13 +195,19 @@ function ApprovalCard({
? "Email Trash Approved"
: "Trash Email"}
</p>
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Email trash was cancelled"
: decided === "approve"
? "Email is being trashed"
{decided === "approve" ? (
wasAlreadyDecided ? (
<p className="text-xs text-muted-foreground mt-0.5">Email trashed</p>
) : (
<TextShimmerLoader text="Trashing email" size="sm" />
)
) : (
<p className="text-xs text-muted-foreground mt-0.5">
{decided === "reject"
? "Email trash was cancelled"
: "Requires your approval to proceed"}
</p>
</p>
)}
</div>
</div>
</div>
@ -396,15 +401,7 @@ export const TrashGmailEmailToolUI = makeAssistantToolUI<
TrashGmailEmailResult
>({
toolName: "trash_gmail_email",
render: function TrashGmailEmailUI({ result, status }) {
if (status.type === "running") {
return (
<div className="my-4 max-w-lg rounded-2xl border bg-muted/30 px-5 py-4 select-none">
<TextShimmerLoader text="Trashing email..." size="sm" />
</div>
);
}
render: function TrashGmailEmailUI({ result, status: _status }) {
if (!result) return null;
if (isInterruptResult(result)) {