feat: add artifact library and improve public wiki

frontend-web/src/components/workspace/chats/chat-box.tsx

@@ -1,7 +1,7 @@
 import type { Message } from "@langchain/langgraph-sdk";
 import { useQuery } from "@tanstack/react-query";
 import { FilesIcon, XIcon } from "lucide-react";
-import { usePathname } from "next/navigation";
+import { usePathname, useSearchParams } from "next/navigation";
 import { useEffect, useMemo, useRef, useState } from "react";
 import type { GroupImperativeHandle } from "react-resizable-panels";
 
@@ -15,6 +15,7 @@ import {
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { apiFetch } from "@/core/api";
 import {
+  artifactPathname,
   listThreadArtifacts,
   mergeArtifactPaths,
 } from "@/core/artifacts/listing";
@@ -87,7 +88,13 @@ const ChatBox: React.FC<{
 }) => {
   const { isMock, thread } = useThread();
   const pathname = usePathname();
+  const searchParams = useSearchParams();
+  const requestedArtifact = useMemo(() => {
+    const value = searchParams.get("artifact")?.trim();
+    return value ? artifactPathname(value) : null;
+  }, [searchParams]);
   const threadIdRef = useRef(threadId);
+  const openedRequestedArtifactRef = useRef<string | null>(null);
   const artifactsCountRef = useRef(0);
   const layoutRef = useRef<GroupImperativeHandle>(null);
   const latestReferenceBatchIdRef = useRef<string | null>(null);
@@ -120,7 +127,7 @@ const ChatBox: React.FC<{
   const { skills } = useSkills();
 
   const canScanArtifactDirectory =
-    artifactDirectoryModeEnabled &&
+    (artifactDirectoryModeEnabled || !!requestedArtifact) &&
     !disableArtifacts &&
     !isMock &&
     !!threadId &&
@@ -138,17 +145,21 @@ const ChatBox: React.FC<{
   );
   const checkpointArtifactSignature = checkpointArtifacts.join("\n");
   const availableArtifacts = useMemo(
-    () =>
-      artifactDirectoryModeEnabled
-        ? mergeArtifactPaths(
-            checkpointArtifacts,
-            (artifactListingQuery.data?.files ?? []).map((file) => file.path),
-          )
-        : checkpointArtifacts,
+    () => {
+      if (!artifactDirectoryModeEnabled && !requestedArtifact) {
+        return checkpointArtifacts;
+      }
+      const discoveredArtifacts = (artifactListingQuery.data?.files ?? []).map(
+        (file) => file.path,
+      );
+      if (requestedArtifact) discoveredArtifacts.push(requestedArtifact);
+      return mergeArtifactPaths(checkpointArtifacts, discoveredArtifacts);
+    },
     [
       artifactDirectoryModeEnabled,
       artifactListingQuery.data?.files,
       checkpointArtifacts,
+      requestedArtifact,
     ],
   );
 
@@ -191,6 +202,29 @@ const ChatBox: React.FC<{
       thread.isLoading,
     );
   }, [referencesEnabled, skillDisplayMap, thread.isLoading, thread.values.messages]);
+  useEffect(() => {
+    if (
+      disableArtifacts ||
+      !requestedArtifact ||
+      !threadId ||
+      threadId === "new"
+    ) {
+      return;
+    }
+    const requestKey = `${threadId}:${artifactPathname(requestedArtifact)}`;
+    if (openedRequestedArtifactRef.current === requestKey) return;
+    openedRequestedArtifactRef.current = requestKey;
+    selectArtifact(requestedArtifact);
+    setArtifactsOpen(true);
+    setSideTab("document");
+  }, [
+    disableArtifacts,
+    requestedArtifact,
+    selectArtifact,
+    setArtifactsOpen,
+    threadId,
+  ]);
+
   useEffect(() => {
     if (!shouldFetchBackendReferenceBatches) {
       setBackendReferenceBatches([]);