feat(web): improve comment editing and mention rendering

This commit is contained in:
CREDO23 2026-01-19 14:37:45 +02:00
parent f008acecfc
commit 0b675dfc3b
4 changed files with 29 additions and 21 deletions

View file

@ -239,7 +239,11 @@ export function CommentComposer({
return ( return (
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
<Popover open={mentionState.isActive} onOpenChange={(open) => !open && closeMentionPicker()} modal={false}> <Popover
open={mentionState.isActive}
onOpenChange={(open) => !open && closeMentionPicker()}
modal={false}
>
<PopoverAnchor asChild> <PopoverAnchor asChild>
<Textarea <Textarea
ref={textareaRef} ref={textareaRef}

View file

@ -27,7 +27,12 @@ export interface CommentItemProps {
isReply?: boolean; isReply?: boolean;
isEditing?: boolean; isEditing?: boolean;
isSubmitting?: boolean; isSubmitting?: boolean;
members?: Array<{ id: string; displayName: string | null; email: string; avatarUrl?: string | null }>; members?: Array<{
id: string;
displayName: string | null;
email: string;
avatarUrl?: string | null;
}>;
membersLoading?: boolean; membersLoading?: boolean;
} }

View file

@ -129,28 +129,27 @@ export function CommentThread({
{isReplyComposerOpen ? ( {isReplyComposerOpen ? (
<> <>
<div className="pt-3"> <div className="pt-3">
<CommentComposer <CommentComposer
members={members} members={members}
membersLoading={membersLoading} membersLoading={membersLoading}
placeholder="Write a reply..." placeholder="Write a reply..."
submitLabel="Reply" submitLabel="Reply"
isSubmitting={isSubmitting} isSubmitting={isSubmitting}
onSubmit={handleReplySubmit} onSubmit={handleReplySubmit}
onCancel={handleReplyCancel} onCancel={handleReplyCancel}
autoFocus autoFocus
/> />
</div> </div>
</> </>
) : ( ) : (
<Button variant="ghost" size="sm" className="h-7 px-2 text-xs" onClick={handleReply}> <Button variant="ghost" size="sm" className="h-7 px-2 text-xs" onClick={handleReply}>
<MessageSquare className="mr-1.5 size-3" /> <MessageSquare className="mr-1.5 size-3" />
Reply Reply
</Button> </Button>
)} )}
</div>
</div> </div>
</div>
)} )}
{/* Reply button when no replies yet */} {/* Reply button when no replies yet */}