refactor: extract components folder

web/src/app/chat/components/input-box.tsx

@@ -11,6 +11,8 @@ import {
   useState,
 } from "react";
 
+import { Detective } from "~/components/deer-flow/icons/detective";
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { Button } from "~/components/ui/button";
 import type { Option } from "~/core/messages";
 import {
@@ -19,10 +21,6 @@ import {
 } from "~/core/store";
 import { cn } from "~/lib/utils";
 
-import { Detective } from "../_icons/detective";
-
-import { Tooltip } from "./tooltip";
-
 export function InputBox({
   className,
   size,

web/src/app/chat/components/message-list-view.tsx

@@ -6,6 +6,12 @@ import { motion } from "framer-motion";
 import { Download, Headphones } from "lucide-react";
 import { useCallback, useMemo, useState } from "react";
 
+import { LoadingAnimation } from "~/components/deer-flow/loading-animation";
+import { Markdown } from "~/components/deer-flow/markdown";
+import { RainbowText } from "~/components/deer-flow/rainbow-text";
+import { RollingText } from "~/components/deer-flow/rolling-text";
+import { ScrollContainer } from "~/components/deer-flow/scroll-container";
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { Button } from "~/components/ui/button";
 import {
   Card,
@@ -25,13 +31,6 @@ import {
 import { parseJSON } from "~/core/utils";
 import { cn } from "~/lib/utils";
 
-import { LoadingAnimation } from "./loading-animation";
-import { Markdown } from "./markdown";
-import { RainbowText } from "./rainbow-text";
-import { RollingText } from "./rolling-text";
-import { ScrollContainer } from "./scroll-container";
-import { Tooltip } from "./tooltip";
-
 export function MessageListView({
   className,
   onFeedback,

web/src/app/chat/components/messages-block.tsx

@@ -5,6 +5,7 @@ import { motion } from "framer-motion";
 import { FastForward, Play } from "lucide-react";
 import { useCallback, useRef, useState } from "react";
 
+import { RainbowText } from "~/components/deer-flow/rainbow-text";
 import { Button } from "~/components/ui/button";
 import {
   Card,
@@ -21,7 +22,6 @@ import { cn } from "~/lib/utils";
 import { ConversationStarter } from "./conversation-starter";
 import { InputBox } from "./input-box";
 import { MessageListView } from "./message-list-view";
-import { RainbowText } from "./rainbow-text";
 import { Welcome } from "./welcome";
 
 export function MessagesBlock({ className }: { className?: string }) {

web/src/app/chat/components/research-activities-block.tsx

@@ -11,6 +11,12 @@ import SyntaxHighlighter from "react-syntax-highlighter";
 import { docco } from "react-syntax-highlighter/dist/esm/styles/hljs";
 import { dark } from "react-syntax-highlighter/dist/esm/styles/prism";
 
+import { FavIcon } from "~/components/deer-flow/fav-icon";
+import Image from "~/components/deer-flow/image";
+import { LoadingAnimation } from "~/components/deer-flow/loading-animation";
+import { Markdown } from "~/components/deer-flow/markdown";
+import { RainbowText } from "~/components/deer-flow/rainbow-text";
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import {
   Accordion,
   AccordionContent,
@@ -24,13 +30,6 @@ import { useMessage, useStore } from "~/core/store";
 import { parseJSON } from "~/core/utils";
 import { cn } from "~/lib/utils";
 
-import { FavIcon } from "./fav-icon";
-import Image from "./image";
-import { LoadingAnimation } from "./loading-animation";
-import { Markdown } from "./markdown";
-import { RainbowText } from "./rainbow-text";
-import { Tooltip } from "./tooltip";
-
 export function ResearchActivitiesBlock({
   className,
   researchId,

web/src/app/chat/components/research-block.tsx

@@ -4,6 +4,8 @@
 import { Check, Copy, Headphones, X } from "lucide-react";
 import { useCallback, useEffect, useState } from "react";
 
+import { ScrollContainer } from "~/components/deer-flow/scroll-container";
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { Button } from "~/components/ui/button";
 import { Card } from "~/components/ui/card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "~/components/ui/tabs";
@@ -13,8 +15,6 @@ import { cn } from "~/lib/utils";
 
 import { ResearchActivitiesBlock } from "./research-activities-block";
 import { ResearchReportBlock } from "./research-report-block";
-import { ScrollContainer } from "./scroll-container";
-import { Tooltip } from "./tooltip";
 
 export function ResearchBlock({
   className,
@@ -102,7 +102,9 @@ export function ResearchBlock({
               className="text-gray-400"
               size="sm"
               variant="ghost"
-              onClick={() => { closeResearch(); }}
+              onClick={() => {
+                closeResearch();
+              }}
             >
               <X />
             </Button>

web/src/app/chat/components/research-report-block.tsx

@@ -3,14 +3,13 @@
 
 import { useCallback, useRef } from "react";
 
+import { LoadingAnimation } from "~/components/deer-flow/loading-animation";
+import { Markdown } from "~/components/deer-flow/markdown";
 import ReportEditor from "~/components/editor";
 import { useReplay } from "~/core/replay";
 import { useMessage, useStore } from "~/core/store";
 import { cn } from "~/lib/utils";
 
-import { LoadingAnimation } from "./loading-animation";
-import { Markdown } from "./markdown";
-
 export function ResearchReportBlock({
   className,
   messageId,

web/src/app/chat/main.tsx

@@ -8,8 +8,8 @@ import { useMemo } from "react";
 import { useStore } from "~/core/store";
 import { cn } from "~/lib/utils";
 
-import { MessagesBlock } from "../_components/messages-block";
-import { ResearchBlock } from "../_components/research-block";
+import { MessagesBlock } from "./components/messages-block";
+import { ResearchBlock } from "./components/research-block";
 
 export default function Main() {
   const openResearchId = useStore((state) => state.openResearchId);

web/src/app/chat/page.tsx

@@ -10,10 +10,10 @@ import { Suspense } from "react";
 
 import { Button } from "~/components/ui/button";
 
-import { Logo } from "../_components/logo";
-import { ThemeToggle } from "../_components/theme-toggle";
-import { Tooltip } from "../_components/tooltip";
-import { SettingsDialog } from "../_settings/dialogs/settings-dialog";
+import { Logo } from "../../components/deer-flow/logo";
+import { ThemeToggle } from "../../components/deer-flow/theme-toggle";
+import { Tooltip } from "../../components/deer-flow/tooltip";
+import { SettingsDialog } from "../settings/dialogs/settings-dialog";
 
 const Main = dynamic(() => import("./main"), { ssr: false });
 

web/src/app/landing/components/multi-agent-visualization.tsx

@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: MIT
 
 "use client";
+
 import {
   ReactFlow,
   Background,
@@ -31,12 +32,11 @@ import {
 } from "react";
 import "@xyflow/react/dist/style.css";
 
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { ShineBorder } from "~/components/magicui/shine-border";
 import { Button } from "~/components/ui/button";
 import { useIntersectionObserver } from "~/hooks/use-intersection-observer";
 
-import { Tooltip } from "../../_components/tooltip";
-
 const ROW_HEIGHT = 85;
 const ROW_1 = 0;
 const ROW_2 = ROW_HEIGHT;

web/src/app/layout.tsx

@@ -6,10 +6,10 @@ import "~/styles/globals.css";
 import { type Metadata } from "next";
 import { Geist } from "next/font/google";
 
-import { ThemeProviderWrapper } from "~/app/_components/theme-provider-wrapper";
+import { ThemeProviderWrapper } from "~/components/deer-flow/theme-provider-wrapper";
 import { TooltipProvider } from "~/components/ui/tooltip";
 
-import { Toaster } from "./_components/toaster";
+import { Toaster } from "../components/deer-flow/toaster";
 
 export const metadata: Metadata = {
   title: "🦌 DeerFlow",

web/src/app/page.tsx

@@ -5,14 +5,14 @@ import { GithubOutlined } from "@ant-design/icons";
 import Link from "next/link";
 import { useMemo } from "react";
 
+import { Ray } from "~/components/deer-flow/ray";
 import { Button } from "~/components/ui/button";
 
-import { Ray } from "./_components/ray";
-import { CaseStudySection } from "./landing/_components/case-study-section";
-import { CoreFeatureSection } from "./landing/_components/core-features-section";
-import { JoinCommunitySection } from "./landing/_components/join-community-section";
-import { Jumbotron } from "./landing/_components/jumbotron";
-import { MultiAgentSection } from "./landing/_components/multi-agent-section";
+import { CaseStudySection } from "./landing/components/case-study-section";
+import { CoreFeatureSection } from "./landing/components/core-features-section";
+import { JoinCommunitySection } from "./landing/components/join-community-section";
+import { Jumbotron } from "./landing/components/jumbotron";
+import { MultiAgentSection } from "./landing/components/multi-agent-section";
 
 export default function HomePage() {
   return (

web/src/app/settings/dialogs/settings-dialog.tsx

@@ -4,6 +4,7 @@
 import { Settings } from "lucide-react";
 import { useCallback, useEffect, useMemo, useState } from "react";
 
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { Badge } from "~/components/ui/badge";
 import { Button } from "~/components/ui/button";
 import {
@@ -25,7 +26,6 @@ import {
 } from "~/core/store";
 import { cn } from "~/lib/utils";
 
-import { Tooltip } from "../../_components/tooltip";
 import { SETTINGS_TABS } from "../tabs";
 
 export function SettingsDialog() {

web/src/app/settings/tabs/about-tab.tsx

@@ -3,7 +3,7 @@
 
 import { BadgeInfo } from "lucide-react";
 
-import { Markdown } from "~/app/_components/markdown";
+import { Markdown } from "~/components/deer-flow/markdown";
 
 import about from "./about.md";
 import type { Tab } from "./types";

web/src/app/settings/tabs/mcp-tab.tsx

@@ -5,7 +5,7 @@ import { motion } from "framer-motion";
 import { Blocks, PencilRuler, Trash } from "lucide-react";
 import { useCallback, useState } from "react";
 
-import { Tooltip } from "~/app/_components/tooltip";
+import { Tooltip } from "~/components/deer-flow/tooltip";
 import { Button } from "~/components/ui/button";
 import { Switch } from "~/components/ui/switch";
 import type { MCPServerMetadata } from "~/core/mcp";

web/src/components/deer-flow/ray.tsx

@@ -1,3 +1,6 @@
+// Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+// SPDX-License-Identifier: MIT
+
 export function Ray() {
   return (
     <svg