refactor: rename

frontend/src/app/workspace/chats/[thread_id]/page.tsx

@@ -10,13 +10,13 @@ import {
   ResizablePanel,
   ResizablePanelGroup,
 } from "@/components/ui/resizable";
-import { ArtifactFileDetail } from "@/components/workspace/artifacts";
 import {
+  ArtifactFileDetail,
   ArtifactsProvider,
   useArtifacts,
-} from "@/components/workspace/artifacts/context";
+} from "@/components/workspace/artifacts";
 import { InputBox } from "@/components/workspace/input-box";
-import { MessageList } from "@/components/workspace/message-list/message-list";
+import { MessageList } from "@/components/workspace/messages";
 import {
   WorkspaceContainer,
   WorkspaceBody,

frontend/src/components/workspace/artifacts/artifact-file-detail.tsx

@@ -1,8 +1,22 @@
-import { FileIcon } from "lucide-react";
+import { FileIcon, XIcon } from "lucide-react";
+import { useCallback } from "react";
+
+import { Button } from "@/components/ui/button";
+
+import { useArtifacts } from "./context";
 
 export function ArtifactFileDetail({ filepath }: { filepath: string }) {
+  const { setOpen } = useArtifacts();
+  const handleClose = useCallback(() => {
+    setOpen(false);
+  }, [setOpen]);
   return (
-    <div className="flex size-full items-center justify-center">
+    <div className="relative flex size-full items-center justify-center">
+      <div className="absolute top-1 right-1">
+        <Button size="icon-sm" variant="ghost" onClick={handleClose}>
+          <XIcon />
+        </Button>
+      </div>
       <div className="flex items-center gap-2">
         <div>
           <FileIcon />