feat: add DeepSeek official API support and capture reasoning content

- Add DeepSeek provider routing: deepseek-chat/deepseek-reasoner use
  api.deepseek.com, other models use SiliconFlow
- Add stream_with_reasoning() using raw OpenAI SDK to capture
  reasoning_content (langchain_openai strips this field)
- RAG chain and conversation chain both use stream_with_reasoning
  for proper reasoning display in thinking models
- Frontend model selector: grouped by provider (DeepSeek official +
  SiliconFlow), default changed to deepseek-chat
- Regenerate message converted to streaming with reasoning capture
- Minor UI: globals.css additions, chat store refactoring

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

web/src/components/chat/model-selector.tsx

@@ -8,9 +8,10 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
   DropdownMenuSeparator,
+  DropdownMenuLabel,
 } from "@/components/ui/dropdown-menu";
 import { Badge } from "@/components/ui/badge";
-import { ChevronDown, Cpu, Zap, Sparkles } from "lucide-react";
+import { ChevronDown, Cpu, Zap, Sparkles, Brain } from "lucide-react";
 import { cn } from "@/lib/utils";
 
 export interface ModelOption {
@@ -18,6 +19,7 @@ export interface ModelOption {
   name: string;
   description: string;
   provider: string;
+  providerLabel: string;
   icon?: React.ComponentType<{ className?: string }>;
 }
 
@@ -27,31 +29,64 @@ interface ModelSelectorProps {
   className?: string;
 }
 
-const models: ModelOption[] = [
+const modelGroups = [
   {
-    id: "deepseek-ai/DeepSeek-V3",
-    name: "DeepSeek-V3",
-    description: "DeepSeek 最新版本，强大的推理能力",
-    provider: "DeepSeek",
-    icon: Sparkles,
+    provider: "deepseek-official",
+    label: "DeepSeek 官方",
+    models: [
+      {
+        id: "deepseek-chat",
+        name: "DeepSeek-V3",
+        description: "DeepSeek 最新通用模型，速度快、能力强",
+        provider: "deepseek-official",
+        providerLabel: "DeepSeek",
+        icon: Sparkles,
+      },
+      {
+        id: "deepseek-reasoner",
+        name: "DeepSeek-R1",
+        description: "深度推理模型，适合复杂分析任务",
+        provider: "deepseek-official",
+        providerLabel: "DeepSeek",
+        icon: Brain,
+      },
+    ],
   },
   {
-    id: "Qwen/QwQ-32B",
-    name: "QwQ-32B",
-    description: "Qwen 量子化模型，高效推理",
-    provider: "Qwen",
-    icon: Zap,
+    provider: "siliconflow",
+    label: "SiliconFlow（硅基流动）",
+    models: [
+      {
+        id: "deepseek-ai/DeepSeek-V3",
+        name: "DeepSeek-V3",
+        description: "通过硅基流动调用，稳定的推理能力",
+        provider: "siliconflow",
+        providerLabel: "硅基流动",
+        icon: Sparkles,
+      },
+      {
+        id: "Qwen/QwQ-32B",
+        name: "QwQ-32B",
+        description: "Qwen 推理模型，高效准确",
+        provider: "siliconflow",
+        providerLabel: "硅基流动",
+        icon: Zap,
+      },
+    ],
   },
 ];
 
-export default function ModelSelector({ 
-  selectedModel, 
-  onModelChange, 
-  className 
+const allModels = modelGroups.flatMap((g) => g.models);
+
+export default function ModelSelector({
+  selectedModel,
+  onModelChange,
+  className,
 }: ModelSelectorProps) {
   const [isOpen, setIsOpen] = useState(false);
-  
-  const selectedModelData = models.find(model => model.id === selectedModel) || models[0];
+
+  const selectedModelData =
+    allModels.find((model) => model.id === selectedModel) || allModels[0];
   const IconComponent = selectedModelData.icon || Cpu;
 
   return (
@@ -68,53 +103,55 @@ export default function ModelSelector({
         >
           <IconComponent className="w-4 h-4 mr-2" />
           <span className="hidden sm:inline">{selectedModelData.name}</span>
-          <span className="sm:hidden">{selectedModelData.name.split(' ')[0]}</span>
+          <span className="sm:hidden">{selectedModelData.name.split(" ")[0]}</span>
           <ChevronDown className="w-3 h-3 ml-1 opacity-50" />
         </Button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="start" className="w-64">
+      <DropdownMenuContent align="start" className="w-72">
         <div className="px-2 py-1.5 text-xs font-medium text-muted-foreground">
           选择AI模型
         </div>
         <DropdownMenuSeparator />
-        {models.map((model) => {
-          const ModelIcon = model.icon || Cpu;
-          const isSelected = model.id === selectedModel;
-          
-          return (
-            <DropdownMenuItem
-              key={model.id}
-              onClick={() => {
-                onModelChange(model.id);
-                setIsOpen(false);
-              }}
-              className={cn(
-                "flex items-start space-x-3 p-3 cursor-pointer",
-                isSelected && "bg-muted/50"
-              )}
-            >
-              <ModelIcon className="w-4 h-4 mt-0.5 flex-shrink-0" />
-              <div className="flex-1 min-w-0">
-                <div className="flex items-center space-x-2">
-                  <span className="font-medium text-sm">{model.name}</span>
-                  {isSelected && (
-                    <Badge variant="secondary" className="text-xs">
-                      已选择
-                    </Badge>
+        {modelGroups.map((group) => (
+          <div key={group.provider}>
+            <DropdownMenuLabel className="text-xs text-muted-foreground/70 font-normal px-2 pt-2">
+              {group.label}
+            </DropdownMenuLabel>
+            {group.models.map((model) => {
+              const ModelIcon = model.icon || Cpu;
+              const isSelected = model.id === selectedModel;
+
+              return (
+                <DropdownMenuItem
+                  key={model.id}
+                  onClick={() => {
+                    onModelChange(model.id);
+                    setIsOpen(false);
+                  }}
+                  className={cn(
+                    "flex items-start space-x-3 p-3 cursor-pointer",
+                    isSelected && "bg-muted/50"
                   )}
-                </div>
-                <p className="text-xs text-muted-foreground mt-0.5">
-                  {model.description}
-                </p>
-                <div className="flex items-center space-x-1 mt-1">
-                  <span className="text-xs text-muted-foreground">
-                    {model.provider}
-                  </span>
-                </div>
-              </div>
-            </DropdownMenuItem>
-          );
-        })}
+                >
+                  <ModelIcon className="w-4 h-4 mt-0.5 flex-shrink-0" />
+                  <div className="flex-1 min-w-0">
+                    <div className="flex items-center space-x-2">
+                      <span className="font-medium text-sm">{model.name}</span>
+                      {isSelected && (
+                        <Badge variant="secondary" className="text-xs">
+                          已选择
+                        </Badge>
+                      )}
+                    </div>
+                    <p className="text-xs text-muted-foreground mt-0.5">
+                      {model.description}
+                    </p>
+                  </div>
+                </DropdownMenuItem>
+              );
+            })}
+          </div>
+        ))}
       </DropdownMenuContent>
     </DropdownMenu>
   );