feat: refactor plugin market interaction and migrate to LangBot Space

- Replace plugin detail dialog with hover buttons interaction
- Add "Install" and "View Details" hover buttons on plugin cards
- Remove PluginDetailDialog component
- Update plugin marketplace URL format to /market/{author}/{plugin}
- Redirect all plugin detail views to LangBot Space
- Add i18n support for 4 languages (zh-Hans, en-US, zh-Hant, ja-JP)
- Optimize hover overlay styles for light/dark theme

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: RockChinQ

web/src/app/home/plugins/components/plugin-market/PluginMarketComponent.tsx

@@ -14,7 +14,6 @@ import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group';
 import { Search, Loader2, Wrench, AudioWaveform, Hash } from 'lucide-react';
 import PluginMarketCardComponent from './plugin-market-card/PluginMarketCardComponent';
 import { PluginMarketCardVO } from './plugin-market-card/PluginMarketCardVO';
-import PluginDetailDialog from './plugin-detail-dialog/PluginDetailDialog';
 import { getCloudServiceClientSync } from '@/app/infra/http';
 import { useTranslation } from 'react-i18next';
 import { PluginV4 } from '@/app/infra/entities/plugin';
@@ -48,15 +47,6 @@ function MarketPageContent({
   const [total, setTotal] = useState(0);
   const [sortOption, setSortOption] = useState('install_count_desc');
 
-  // Plugin detail dialog state
-  const [selectedPluginAuthor, setSelectedPluginAuthor] = useState<
-    string | null
-  >(null);
-  const [selectedPluginName, setSelectedPluginName] = useState<string | null>(
-    null,
-  );
-  const [dialogOpen, setDialogOpen] = useState(false);
-
   const pageSize = 16; // 每页16个，4行x4列
   const searchTimeoutRef = useRef<NodeJS.Timeout | null>(null);
   const scrollContainerRef = useRef<HTMLDivElement | null>(null);
@@ -230,34 +220,47 @@ function MarketPageContent({
     fetchPlugins(1, !!searchQuery.trim(), true);
   }, [sortOption, componentFilter]);
 
-  // 处理URL参数，检查是否需要打开插件详情对话框
+  // 处理URL参数，重定向到 LangBot Space
   useEffect(() => {
     const author = searchParams.get('author');
     const pluginName = searchParams.get('plugin');
 
     if (author && pluginName) {
-      setSelectedPluginAuthor(author);
-      setSelectedPluginName(pluginName);
-      setDialogOpen(true);
+      const detailUrl = `https://space.langbot.app/market/${author}/${pluginName}`;
+      window.open(detailUrl, '_blank');
     }
   }, [searchParams]);
 
-  // 插件详情对话框处理函数
-  const handlePluginClick = useCallback(
-    (author: string, pluginName: string) => {
-      setSelectedPluginAuthor(author);
-      setSelectedPluginName(pluginName);
-      setDialogOpen(true);
+  // 处理安装插件
+  const handleInstallPlugin = useCallback(
+    async (author: string, pluginName: string) => {
+      try {
+        // Find the full plugin object from the list
+        const pluginVO = plugins.find(
+          (p) => p.author === author && p.pluginName === pluginName,
+        );
+        if (!pluginVO) {
+          console.error('Plugin not found:', author, pluginName);
+          return;
+        }
+
+        // Fetch full plugin details to get PluginV4 object
+        const response = await getCloudServiceClientSync().getPluginDetail(
+          author,
+          pluginName,
+        );
+        const pluginV4: PluginV4 = response.plugin;
+
+        // Call the install function passed from parent
+        installPlugin(pluginV4);
+      } catch (error) {
+        console.error('Failed to install plugin:', error);
+        toast.error(t('market.installFailed'));
+      }
     },
-    [],
+    [plugins, installPlugin, t],
   );
 
-  const handleDialogClose = useCallback(() => {
-    setDialogOpen(false);
-    setSelectedPluginAuthor(null);
-    setSelectedPluginName(null);
-  }, []);
-
   // 清理定时器
   useEffect(() => {
     return () => {
@@ -459,7 +462,7 @@ function MarketPageContent({
                 <PluginMarketCardComponent
                   key={plugin.pluginId}
                   cardVO={plugin}
-                  onPluginClick={handlePluginClick}
+                  onInstall={handleInstallPlugin}
                 />
               ))}
             </div>
@@ -490,15 +493,6 @@ function MarketPageContent({
           </>
         )}
       </div>
-
-      {/* Plugin detail dialog */}
-      <PluginDetailDialog
-        open={dialogOpen}
-        onOpenChange={handleDialogClose}
-        author={selectedPluginAuthor}
-        pluginName={selectedPluginName}
-        installPlugin={installPlugin}
-      />
     </div>
   );
 }