refactor: replace react markdown with streamdown (#32971)

Co-authored-by: Stephen Zhou <hi@hyoban.cc>
Co-authored-by: Stephen Zhou <38493346+hyoban@users.noreply.github.com>
Co-authored-by: yyh <92089059+lyzno1@users.noreply.github.com>

web/app/components/devtools/tanstack/devtools.tsx

@@ -1,23 +0,0 @@
-'use client'
-
-import { TanStackDevtools } from '@tanstack/react-devtools'
-import { formDevtoolsPlugin } from '@tanstack/react-form-devtools'
-import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools'
-import * as React from 'react'
-
-export function TanStackDevtoolsWrapper() {
-  return (
-    <TanStackDevtools
-      plugins={[
-        // Query Devtools (Official Plugin)
-        {
-          name: 'React Query',
-          render: () => <ReactQueryDevtoolsPanel />,
-        },
-
-        // Form Devtools (Official Plugin)
-        formDevtoolsPlugin(),
-      ]}
-    />
-  )
-}

web/app/components/devtools/tanstack/loader.tsx

@@ -1,21 +1,27 @@
 'use client'
 
-import { lazy, Suspense } from 'react'
-import { IS_DEV } from '@/config'
+import { TanStackDevtools } from '@tanstack/react-devtools'
+import { formDevtoolsPlugin } from '@tanstack/react-form-devtools'
 
-const TanStackDevtoolsWrapper = lazy(() =>
-  import('./devtools').then(module => ({
-    default: module.TanStackDevtoolsWrapper,
-  })),
-)
+import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools'
+import { IS_DEV } from '@/config'
 
 export const TanStackDevtoolsLoader = () => {
   if (!IS_DEV)
     return null
 
   return (
-    <Suspense fallback={null}>
-      <TanStackDevtoolsWrapper />
-    </Suspense>
+    <TanStackDevtools
+      plugins={[
+        // Query Devtools (Official Plugin)
+        {
+          name: 'React Query',
+          render: () => <ReactQueryDevtoolsPanel />,
+        },
+
+        // Form Devtools (Official Plugin)
+        formDevtoolsPlugin(),
+      ]}
+    />
   )
 }