apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-04-25 08:46:22 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(web): improve comment panel and trigger UI

Browse source
This commit is contained in:
CREDO23 2026-01-19 14:37:38 +02:00
parent d99722cfdc
commit f008acecfc
8 changed files with 56 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

25
surfsense_web/components/chat-comments/comment-trigger/comment-trigger.tsx
View file

@ -5,25 +5,32 @@ import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";
import type { CommentTriggerProps } from "./types";
export function CommentTrigger({ commentCount, isOpen, onClick }: CommentTriggerProps) {
export function CommentTrigger({ commentCount, isOpen, onClick, disabled }: CommentTriggerProps) {
const hasComments = commentCount > 0;
return (
<Button
variant={isOpen ? "secondary" : "ghost"}
size="sm"
variant={hasComments ? "outline" : isOpen ? "secondary" : "ghost"}
size="icon"
disabled={disabled}
className={cn(
"h-8 gap-1.5 px-2 transition-opacity",
isOpen ? "text-foreground" : "text-muted-foreground",
!hasComments && !isOpen && "opacity-0 group-hover:opacity-100"
"relative size-10 rounded-full transition-all duration-200",
hasComments
? "border-primary/50 bg-primary/5 text-primary hover:bg-primary/10 hover:border-primary"
: isOpen
? "text-foreground"
: "text-muted-foreground hover:text-foreground",
!hasComments && !isOpen && "opacity-0 group-hover:opacity-100",
disabled && "cursor-not-allowed opacity-50"
)}
onClick={onClick}
>
<MessageSquare className={cn("size-4", isOpen && "fill-current")} />
<MessageSquare className={cn("size-5", (hasComments || isOpen) && "fill-current")} />
{hasComments && (
<span className="min-w-5 text-xs font-medium">{commentCount}</span>
<span className="absolute -top-1 -right-1 flex size-5 items-center justify-center rounded-full bg-primary text-[10px] font-bold text-primary-foreground">
{commentCount > 9 ? "9+" : commentCount}
</span>
)}
</Button>
);
}