feat(mentions): add sidebar mention event atom and enhance document mention handling in the editor

This commit is contained in:
Anish Sarkar 2026-04-28 17:50:21 +05:30
parent f607636ba6
commit 960f761c6c
4 changed files with 227 additions and 27 deletions

View file

@ -23,7 +23,10 @@ import { useTranslations } from "next-intl";
import type React from "react";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { toast } from "sonner";
import { sidebarSelectedDocumentsAtom } from "@/atoms/chat/mentioned-documents.atom";
import {
sidebarMentionEventAtom,
sidebarSelectedDocumentsAtom,
} from "@/atoms/chat/mentioned-documents.atom";
import { connectorDialogOpenAtom } from "@/atoms/connector-dialog/connector-dialog.atoms";
import { connectorsAtom } from "@/atoms/connectors/connector-query.atoms";
import { deleteDocumentMutationAtom } from "@/atoms/documents/document-mutation.atoms";
@ -413,6 +416,7 @@ function AuthenticatedDocumentsSidebarBase({
const { mutateAsync: deleteDocumentMutation } = useAtomValue(deleteDocumentMutationAtom);
const [sidebarDocs, setSidebarDocs] = useAtom(sidebarSelectedDocumentsAtom);
const setSidebarMentionEvent = useSetAtom(sidebarMentionEventAtom);
const mentionedDocIds = useMemo(() => new Set(sidebarDocs.map((d) => d.id)), [sidebarDocs]);
// Folder state
@ -857,19 +861,42 @@ function AuthenticatedDocumentsSidebarBase({
const handleToggleChatMention = useCallback(
(doc: { id: number; title: string; document_type: string }, isMentioned: boolean) => {
const key = `${doc.document_type}:${doc.id}`;
if (isMentioned) {
setSidebarDocs((prev) => prev.filter((d) => d.id !== doc.id));
setSidebarDocs((prev) => prev.filter((d) => `${d.document_type}:${d.id}` !== key));
setSidebarMentionEvent({
kind: "remove",
docs: [
{
id: doc.id,
title: doc.title,
document_type: doc.document_type as DocumentTypeEnum,
},
],
nonce: Date.now(),
});
} else {
setSidebarDocs((prev) => {
if (prev.some((d) => d.id === doc.id)) return prev;
if (prev.some((d) => `${d.document_type}:${d.id}` === key)) return prev;
return [
...prev,
{ id: doc.id, title: doc.title, document_type: doc.document_type as DocumentTypeEnum },
];
});
setSidebarMentionEvent({
kind: "add",
docs: [
{
id: doc.id,
title: doc.title,
document_type: doc.document_type as DocumentTypeEnum,
},
],
nonce: Date.now(),
});
}
},
[setSidebarDocs]
[setSidebarDocs, setSidebarMentionEvent]
);
const handleToggleFolderSelect = useCallback(
@ -891,10 +918,18 @@ function AuthenticatedDocumentsSidebarBase({
if (subtreeDocs.length === 0) return;
if (selectAll) {
const existingKeys = new Set(sidebarDocs.map((d) => `${d.document_type}:${d.id}`));
const docsToAdd = subtreeDocs
.filter((d) => !existingKeys.has(`${d.document_type}:${d.id}`))
.map((d) => ({
id: d.id,
title: d.title,
document_type: d.document_type as DocumentTypeEnum,
}));
setSidebarDocs((prev) => {
const existingIds = new Set(prev.map((d) => d.id));
const existingDocKeys = new Set(prev.map((d) => `${d.document_type}:${d.id}`));
const newDocs = subtreeDocs
.filter((d) => !existingIds.has(d.id))
.filter((d) => !existingDocKeys.has(`${d.document_type}:${d.id}`))
.map((d) => ({
id: d.id,
title: d.title,
@ -902,12 +937,35 @@ function AuthenticatedDocumentsSidebarBase({
}));
return newDocs.length > 0 ? [...prev, ...newDocs] : prev;
});
if (docsToAdd.length > 0) {
setSidebarMentionEvent({
kind: "add",
docs: docsToAdd,
nonce: Date.now(),
});
}
} else {
const idsToRemove = new Set(subtreeDocs.map((d) => d.id));
setSidebarDocs((prev) => prev.filter((d) => !idsToRemove.has(d.id)));
const keysToRemove = new Set(subtreeDocs.map((d) => `${d.document_type}:${d.id}`));
const docsToRemove = sidebarDocs
.filter((d) => keysToRemove.has(`${d.document_type}:${d.id}`))
.map((d) => ({
id: d.id,
title: d.title,
document_type: d.document_type as DocumentTypeEnum,
}));
setSidebarDocs((prev) =>
prev.filter((d) => !keysToRemove.has(`${d.document_type}:${d.id}`))
);
if (docsToRemove.length > 0) {
setSidebarMentionEvent({
kind: "remove",
docs: docsToRemove,
nonce: Date.now(),
});
}
}
},
[treeDocuments, foldersByParent, setSidebarDocs]
[treeDocuments, foldersByParent, sidebarDocs, setSidebarDocs, setSidebarMentionEvent]
);
const searchFilteredDocuments = useMemo(() => {
@ -1568,23 +1626,47 @@ function AnonymousDocumentsSidebar({
const [search, setSearch] = useState("");
const [sidebarDocs, setSidebarDocs] = useAtom(sidebarSelectedDocumentsAtom);
const setSidebarMentionEvent = useSetAtom(sidebarMentionEventAtom);
const mentionedDocIds = useMemo(() => new Set(sidebarDocs.map((d) => d.id)), [sidebarDocs]);
const handleToggleChatMention = useCallback(
(doc: { id: number; title: string; document_type: string }, isMentioned: boolean) => {
const key = `${doc.document_type}:${doc.id}`;
if (isMentioned) {
setSidebarDocs((prev) => prev.filter((d) => d.id !== doc.id));
setSidebarDocs((prev) => prev.filter((d) => `${d.document_type}:${d.id}` !== key));
setSidebarMentionEvent({
kind: "remove",
docs: [
{
id: doc.id,
title: doc.title,
document_type: doc.document_type as DocumentTypeEnum,
},
],
nonce: Date.now(),
});
} else {
setSidebarDocs((prev) => {
if (prev.some((d) => d.id === doc.id)) return prev;
if (prev.some((d) => `${d.document_type}:${d.id}` === key)) return prev;
return [
...prev,
{ id: doc.id, title: doc.title, document_type: doc.document_type as DocumentTypeEnum },
];
});
setSidebarMentionEvent({
kind: "add",
docs: [
{
id: doc.id,
title: doc.title,
document_type: doc.document_type as DocumentTypeEnum,
},
],
nonce: Date.now(),
});
}
},
[setSidebarDocs]
[setSidebarDocs, setSidebarMentionEvent]
);
const uploadedDoc = anonMode.isAnonymous ? anonMode.uploadedDoc : null;