fix: bug

app/(tabs)/index.tsx

@@ -1,6 +1,7 @@
 import { Image } from 'expo-image'
+import { VideoView, useVideoPlayer } from 'expo-video'
 import { LinearGradient } from 'expo-linear-gradient'
-import { useRouter } from 'expo-router'
+import { useRouter, useLocalSearchParams } from 'expo-router'
 import { StatusBar } from 'expo-status-bar'
 import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
@@ -23,10 +24,29 @@ import { useCategories } from '@/hooks/use-categories'
 
 const { width: screenWidth } = Dimensions.get('window')
 
+// 视频预览组件
+function VideoPreview({ source, style }: { source: string; style: any }) {
+    const player = useVideoPlayer(source, (player) => {
+        player.loop = true
+        player.muted = true
+        player.play()
+    })
+
+    return (
+        <VideoView
+            style={style}
+            player={player}
+            allowsFullscreen
+            allowsPictureInPicture
+        />
+    )
+}
+
 export default function HomeScreen() {
     const { t } = useTranslation()
     const insets = useSafeAreaInsets()
     const router = useRouter()
+    const params = useLocalSearchParams()
     const [activeTab, setActiveTab] = useState(0)
     const [selectedCategoryId, setSelectedCategoryId] = useState<string | null>(null)
 
@@ -50,6 +70,19 @@ export default function HomeScreen() {
         }
     }, [categoriesData, categoriesError])
 
+    // 监听从 channels 页面传递过来的 categoryId 参数
+    useEffect(() => {
+        const categoryIdFromParams = params.categoryId as string | undefined
+        if (categoryIdFromParams && categoriesData?.categories) {
+            setSelectedCategoryId(categoryIdFromParams)
+            // 同时更新 activeTab 索引
+            const categoryIndex = categoriesData.categories.findIndex(cat => cat.id === categoryIdFromParams)
+            if (categoryIndex !== -1) {
+                setActiveTab(categoryIndex)
+            }
+        }
+    }, [params.categoryId, categoriesData])
+
     // 使用接口返回的分类数据，如果没有则使用默认翻译
     const categories = categoriesData?.categories || []
     const tabs = categories.length > 0
@@ -69,17 +102,22 @@ export default function HomeScreen() {
 
     // 将 CategoryTemplate 数据转换为卡片数据格式
     const displayCardData = categoryTemplates.length > 0
-        ? categoryTemplates.map((template, idx) => ({
-            id: template.id || `template-${idx}`,
-            title: template.title,
-            image: { uri: template.previewUrl || template.coverImageUrl || `` },
-            isHot: false,
-            users: 0,
-            height: undefined,
-            previewUrl: template.previewUrl,
-            aspectRatio: template.aspectRatio,
-            tag: template.tag,
-        }))
+        ? categoryTemplates.map((template, idx) => {
+            const previewUrl = (template as any).webpPreviewUrl || template.previewUrl || template.coverImageUrl || ``
+            const isVideo = previewUrl.includes('.mp4') || previewUrl.includes('.mov') || previewUrl.includes('.webm')
+            return {
+                id: template.id || `template-${idx}`,
+                title: template.title,
+                image: { uri: previewUrl },
+                isHot: false,
+                users: 0,
+                height: undefined,
+                previewUrl: template.previewUrl,
+                aspectRatio: template.aspectRatio,
+                tag: template.tag,
+                isVideo,
+            }
+        })
         : []
     const [gridWidth, setGridWidth] = useState(screenWidth)
     const [showTabArrow, setShowTabArrow] = useState(false)
@@ -164,7 +202,10 @@ export default function HomeScreen() {
                     >
                         <Pressable
                             style={styles.tabArrow}
-                            onPress={() => router.push('/channels')}
+                            onPress={() => router.push({
+                                pathname: '/channels' as any,
+                                params: selectedCategoryId ? { categoryId: selectedCategoryId } : undefined,
+                            })}
                         >
                             <DownArrowIcon />
                         </Pressable>
@@ -321,11 +362,15 @@ export default function HomeScreen() {
                                         { height: card.height || cardWidth * 1.2 },
                                     ]}
                                 >
-                                    <Image
-                                        source={card.image}
-                                        style={styles.cardImage}
-                                        contentFit="cover"
-                                    />
+                                    {card.isVideo ? (
+                                        <VideoPreview source={card.image.uri} style={styles.cardImage} />
+                                    ) : (
+                                        <Image
+                                            source={card.image}
+                                            style={styles.cardImage}
+                                            contentFit="cover"
+                                        />
+                                    )}
                                     <LinearGradient
                                         colors={['rgba(17, 17, 17, 0)', 'rgba(17, 17, 17, 0.9)']}
                                         start={{ x: 0, y: 0 }}