Merge branch 'ji' of http://192.168.0.200/knowledge-base-bj/deerflow-server into ji

frontend-web/src/components/workspace/recent-chat-list.tsx

@@ -7,7 +7,10 @@ import {
   FileText,
   MoreHorizontal,
   Pencil,
+  Pin,
+  PinOff,
   Share2,
+  Star,
   Trash2,
 } from "lucide-react";
 import Link from "next/link";
@@ -54,9 +57,17 @@ import {
   useDeleteThread,
   useRenameThread,
   useThreads,
+  useToggleThreadFavorite,
+  useToggleThreadPin,
 } from "@/core/threads/hooks";
 import type { AgentThread, AgentThreadState } from "@/core/threads/types";
-import { pathOfThread, titleOfThread } from "@/core/threads/utils";
+import {
+  isThreadFavorite,
+  isThreadPinned,
+  pathOfThread,
+  sortThreadsPinnedFirst,
+  titleOfThread,
+} from "@/core/threads/utils";
 import { env } from "@/env";
 import { desensitize } from "@/lib/desensitize";
 import { isIMEComposing } from "@/lib/ime";
@@ -82,6 +93,8 @@ export function RecentChatList() {
   const { data: threads = [] } = useThreads();
   const { mutate: deleteThread } = useDeleteThread();
   const { mutate: renameThread } = useRenameThread();
+  const { toggle: togglePin } = useToggleThreadPin();
+  const { toggle: toggleFavorite } = useToggleThreadFavorite();
 
   // Rename dialog state
   const [renameDialogOpen, setRenameDialogOpen] = useState(false);
@@ -160,11 +173,13 @@ export function RecentChatList() {
     [t],
   );
 
-  const visibleThreads = threads.filter(
-    (thread) =>
-      thread.metadata?.thread_type !== "scheduler" &&
-      thread.metadata?.thread_type !== "bootstrap" &&
-      thread.metadata?.thread_type !== "roundtable",
+  const visibleThreads = sortThreadsPinnedFirst(
+    threads.filter(
+      (thread) =>
+        thread.metadata?.thread_type !== "scheduler" &&
+        thread.metadata?.thread_type !== "bootstrap" &&
+        thread.metadata?.thread_type !== "roundtable",
+    ),
   );
 
   if (visibleThreads.length === 0) {
@@ -195,6 +210,8 @@ export function RecentChatList() {
             <div className="flex w-full flex-col gap-0.5">
               {visibleThreads.map((thread) => {
                 const isActive = pathOfThread(thread) === pathname;
+                const pinned = isThreadPinned(thread);
+                const favorited = isThreadFavorite(thread);
                 return (
                   <SidebarMenuItem
                     key={thread.thread_id}
@@ -210,10 +227,15 @@ export function RecentChatList() {
                       }
                     >
                       <Link
-                        className="block w-full whitespace-nowrap group-hover/side-menu-item:overflow-hidden"
+                        className="flex w-full items-center gap-1 whitespace-nowrap group-hover/side-menu-item:overflow-hidden"
                         href={pathOfThread(thread)}
                       >
-                        {desensitize(titleOfThread(thread, t.pages.newChat))}
+                        {pinned && (
+                          <Pin className="size-3 shrink-0 text-muted-foreground/70" />
+                        )}
+                        <span className="truncate">
+                          {desensitize(titleOfThread(thread, t.pages.newChat))}
+                        </span>
                       </Link>
                     </SidebarMenuButton>
                     {env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY !== "true" && (
@@ -243,6 +265,36 @@ export function RecentChatList() {
                             <Pencil className="text-muted-foreground" />
                             <span>{t.common.rename}</span>
                           </DropdownMenuItem>
+                          <DropdownMenuItem
+                            onSelect={() =>
+                              togglePin(thread.thread_id, !pinned)
+                            }
+                          >
+                            {pinned ? (
+                              <PinOff className="text-muted-foreground" />
+                            ) : (
+                              <Pin className="text-muted-foreground" />
+                            )}
+                            <span>{pinned ? t.common.unpin : t.common.pin}</span>
+                          </DropdownMenuItem>
+                          <DropdownMenuItem
+                            onSelect={() =>
+                              toggleFavorite(thread.thread_id, !favorited)
+                            }
+                          >
+                            <Star
+                              className={
+                                favorited
+                                  ? "fill-amber-400 text-amber-400"
+                                  : "text-muted-foreground"
+                              }
+                            />
+                            <span>
+                              {favorited
+                                ? t.common.unfavorite
+                                : t.common.favorite}
+                            </span>
+                          </DropdownMenuItem>
                           <DropdownMenuItem
                             onSelect={() => handleShare(thread)}
                           >