apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-06-30 21:59:46 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat: replace checkbox inputs with Checkbox component in file deletion UIs

Browse source 
- Updated the file deletion UI components for Google Drive, Linear, and Notion to use the new Checkbox component for better consistency and styling.
- Enhanced the accessibility of the checkbox inputs by associating labels with their respective checkboxes, improving user experience during file deletion operations.
This commit is contained in:
Anish Sarkar 2026-03-20 15:46:43 +05:30
parent 3d6ff39bf4
commit db5fddb104
3 changed files with 42 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

27
surfsense_web/components/tool-ui/google-drive/trash-file.tsx
View file

@ -12,6 +12,7 @@ import { useParams } from "next/navigation";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import { toast } from "sonner"; import { toast } from "sonner";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Checkbox } from "@/components/ui/checkbox";
import { TextShimmerLoader } from "@/components/prompt-kit/loader"; import { TextShimmerLoader } from "@/components/prompt-kit/loader";
import { authenticatedFetch } from "@/lib/auth-utils"; import { authenticatedFetch } from "@/lib/auth-utils";
@ -274,21 +275,21 @@ function ApprovalCard({
<p className="text-xs text-muted-foreground"> <p className="text-xs text-muted-foreground">
The file will be moved to Google Drive trash. You can restore it from trash within 30 days. The file will be moved to Google Drive trash. You can restore it from trash within 30 days.
</p> </p>
<label className="flex items-start gap-2 cursor-pointer"> <div className="flex items-center gap-2.5">
<input <Checkbox
type="checkbox" id="delete-from-kb"
checked={deleteFromKb} checked={deleteFromKb}
onChange={(e) => setDeleteFromKb(e.target.checked)} onCheckedChange={(v) => setDeleteFromKb(v === true)}
className="mt-0.5" className="shrink-0"
/> />
<div className="flex-1"> <label htmlFor="delete-from-kb" className="flex-1 cursor-pointer">
<span className="text-sm text-foreground">Also remove from knowledge base</span> <span className="text-sm text-foreground">Also remove from knowledge base</span>
<p className="text-xs text-muted-foreground mt-1"> <p className="text-xs text-muted-foreground mt-0.5">
This will permanently delete the file from your knowledge base (cannot be undone) This will permanently delete the file from your knowledge base (cannot be undone)
</p> </p>
</div>
</label> </label>
</div> </div>
</div>
</> </>
)} )}

27
surfsense_web/components/tool-ui/linear/delete-linear-issue.tsx
View file

@ -4,6 +4,7 @@ import { makeAssistantToolUI } from "@assistant-ui/react";
import { CornerDownLeftIcon, TriangleAlertIcon } from "lucide-react"; import { CornerDownLeftIcon, TriangleAlertIcon } from "lucide-react";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Checkbox } from "@/components/ui/checkbox";
import { TextShimmerLoader } from "@/components/prompt-kit/loader"; import { TextShimmerLoader } from "@/components/prompt-kit/loader";
interface InterruptResult { interface InterruptResult {
@ -228,21 +229,21 @@ function ApprovalCard({
<> <>
<div className="mx-5 h-px bg-border/50" /> <div className="mx-5 h-px bg-border/50" />
<div className="px-5 py-4 select-none"> <div className="px-5 py-4 select-none">
<label className="flex items-start gap-2 cursor-pointer"> <div className="flex items-center gap-2.5">
<input <Checkbox
type="checkbox" id="linear-delete-from-kb"
checked={deleteFromKb} checked={deleteFromKb}
onChange={(e) => setDeleteFromKb(e.target.checked)} onCheckedChange={(v) => setDeleteFromKb(v === true)}
className="mt-0.5" className="shrink-0"
/> />
<div className="flex-1"> <label htmlFor="linear-delete-from-kb" className="flex-1 cursor-pointer">
<span className="text-sm text-foreground">Also remove from knowledge base</span> <span className="text-sm text-foreground">Also remove from knowledge base</span>
<p className="text-xs text-muted-foreground mt-1"> <p className="text-xs text-muted-foreground mt-0.5">
This will permanently delete the issue from your knowledge base (cannot be undone) This will permanently delete the issue from your knowledge base (cannot be undone)
</p> </p>
</div>
</label> </label>
</div> </div>
</div>
</> </>
)} )}

27
surfsense_web/components/tool-ui/notion/delete-notion-page.tsx
View file

@ -4,6 +4,7 @@ import { makeAssistantToolUI } from "@assistant-ui/react";
import { CornerDownLeftIcon, TriangleAlertIcon } from "lucide-react"; import { CornerDownLeftIcon, TriangleAlertIcon } from "lucide-react";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Checkbox } from "@/components/ui/checkbox";
import { TextShimmerLoader } from "@/components/prompt-kit/loader"; import { TextShimmerLoader } from "@/components/prompt-kit/loader";
interface InterruptResult { interface InterruptResult {
@ -228,21 +229,21 @@ function ApprovalCard({
<> <>
<div className="mx-5 h-px bg-border/50" /> <div className="mx-5 h-px bg-border/50" />
<div className="px-5 py-4 select-none"> <div className="px-5 py-4 select-none">
<label className="flex items-start gap-2 cursor-pointer"> <div className="flex items-center gap-2.5">
<input <Checkbox
type="checkbox" id="notion-delete-from-kb"
checked={deleteFromKb} checked={deleteFromKb}
onChange={(e) => setDeleteFromKb(e.target.checked)} onCheckedChange={(v) => setDeleteFromKb(v === true)}
className="mt-0.5" className="shrink-0"
/> />
<div className="flex-1"> <label htmlFor="notion-delete-from-kb" className="flex-1 cursor-pointer">
<span className="text-sm text-foreground">Also remove from knowledge base</span> <span className="text-sm text-foreground">Also remove from knowledge base</span>
<p className="text-xs text-muted-foreground mt-1"> <p className="text-xs text-muted-foreground mt-0.5">
This will permanently delete the page from your knowledge base (cannot be undone) This will permanently delete the page from your knowledge base (cannot be undone)
</p> </p>
</div>
</label> </label>
</div> </div>
</div>
</> </>
)} )}