fix: bug
This commit is contained in:
parent
a087cafc99
commit
6ca686f2c9
|
|
@ -131,18 +131,18 @@ export default function HomeScreen() {
|
||||||
}, [filteredTemplates, setLikeCountStates])
|
}, [filteredTemplates, setLikeCountStates])
|
||||||
|
|
||||||
// 状态判断 - 使用 useMemo 缓存
|
// 状态判断 - 使用 useMemo 缓存
|
||||||
// 统一 loading 状态:只要有任何一个在加载,就显示 loading
|
// 只在首次加载分类时显示 loading,切换分类时不显示 loading(提升体验)
|
||||||
const isLoading = useMemo(() =>
|
const isInitialLoading = useMemo(() =>
|
||||||
categoriesLoading || templatesLoading,
|
categoriesLoading || (templatesLoading && filteredTemplates.length === 0),
|
||||||
[categoriesLoading, templatesLoading]
|
[categoriesLoading, templatesLoading, filteredTemplates.length]
|
||||||
)
|
)
|
||||||
const showEmptyState = useMemo(() =>
|
const showEmptyState = useMemo(() =>
|
||||||
!isLoading && categoriesData?.categories?.length === 0,
|
!isInitialLoading && categoriesData?.categories?.length === 0,
|
||||||
[isLoading, categoriesData?.categories?.length]
|
[isInitialLoading, categoriesData?.categories?.length]
|
||||||
)
|
)
|
||||||
const showEmptyTemplates = useMemo(() =>
|
const showEmptyTemplates = useMemo(() =>
|
||||||
!isLoading && !showEmptyState && filteredTemplates.length === 0,
|
!isInitialLoading && !showEmptyState && !templatesLoading && filteredTemplates.length === 0,
|
||||||
[isLoading, showEmptyState, filteredTemplates.length]
|
[isInitialLoading, showEmptyState, templatesLoading, filteredTemplates.length]
|
||||||
)
|
)
|
||||||
|
|
||||||
const [refreshing, setRefreshing] = useState(false)
|
const [refreshing, setRefreshing] = useState(false)
|
||||||
|
|
@ -157,10 +157,10 @@ export default function HomeScreen() {
|
||||||
|
|
||||||
// 加载更多处理
|
// 加载更多处理
|
||||||
const handleEndReached = useCallback(() => {
|
const handleEndReached = useCallback(() => {
|
||||||
if (!loadingMore && hasMore && !isLoading) {
|
if (!loadingMore && hasMore && !templatesLoading) {
|
||||||
loadMore()
|
loadMore()
|
||||||
}
|
}
|
||||||
}, [loadingMore, hasMore, isLoading, loadMore])
|
}, [loadingMore, hasMore, templatesLoading, loadMore])
|
||||||
|
|
||||||
// 左右滑动切换分类
|
// 左右滑动切换分类
|
||||||
const handleSwipeLeft = useCallback(() => {
|
const handleSwipeLeft = useCallback(() => {
|
||||||
|
|
@ -299,7 +299,7 @@ export default function HomeScreen() {
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* 标签导航 */}
|
{/* 标签导航 */}
|
||||||
{!isLoading && !showEmptyState && (
|
{!isInitialLoading && !showEmptyState && (
|
||||||
<View
|
<View
|
||||||
onLayout={(e) => handleTabsLayout(e.nativeEvent.layout.y, e.nativeEvent.layout.height)}
|
onLayout={(e) => handleTabsLayout(e.nativeEvent.layout.y, e.nativeEvent.layout.height)}
|
||||||
style={isSticky ? { opacity: 0, height: tabsHeight } : undefined}
|
style={isSticky ? { opacity: 0, height: tabsHeight } : undefined}
|
||||||
|
|
@ -314,8 +314,8 @@ export default function HomeScreen() {
|
||||||
</View>
|
</View>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* 统一的加载状态 */}
|
{/* 统一的加载状态 - 只在首次加载时显示 */}
|
||||||
{isLoading && <LoadingState />}
|
{isInitialLoading && <LoadingState />}
|
||||||
|
|
||||||
{/* 错误状态 */}
|
{/* 错误状态 */}
|
||||||
{categoriesError && (
|
{categoriesError && (
|
||||||
|
|
@ -335,7 +335,7 @@ export default function HomeScreen() {
|
||||||
), [
|
), [
|
||||||
activatesData?.activities,
|
activatesData?.activities,
|
||||||
handleActivityPress,
|
handleActivityPress,
|
||||||
isLoading,
|
isInitialLoading,
|
||||||
showEmptyState,
|
showEmptyState,
|
||||||
isSticky,
|
isSticky,
|
||||||
tabsHeight,
|
tabsHeight,
|
||||||
|
|
@ -369,8 +369,8 @@ export default function HomeScreen() {
|
||||||
[filteredTemplates]
|
[filteredTemplates]
|
||||||
)
|
)
|
||||||
|
|
||||||
// 只有在非加载状态且有数据时才显示列表
|
// 只有在非首次加载状态且有数据时才显示列表
|
||||||
const showTemplateList = !isLoading && !showEmptyState && !showEmptyTemplates
|
const showTemplateList = !isInitialLoading && !showEmptyState && !showEmptyTemplates
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SafeAreaView style={styles.container} edges={['top']}>
|
<SafeAreaView style={styles.container} edges={['top']}>
|
||||||
|
|
@ -386,7 +386,7 @@ export default function HomeScreen() {
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* 吸顶标签导航 */}
|
{/* 吸顶标签导航 */}
|
||||||
{isSticky && !isLoading && !showEmptyState && (
|
{isSticky && !isInitialLoading && !showEmptyState && (
|
||||||
<View style={[styles.stickyTabsWrapper, { top: titleBarHeightRef.current + insets.top }]}>
|
<View style={[styles.stickyTabsWrapper, { top: titleBarHeightRef.current + insets.top }]}>
|
||||||
<TabNavigation
|
<TabNavigation
|
||||||
tabs={tabs}
|
tabs={tabs}
|
||||||
|
|
|
||||||
|
|
@ -503,6 +503,14 @@ export default function My() {
|
||||||
index % 3 !== 2 && styles.galleryItemMarginRight,
|
index % 3 !== 2 && styles.galleryItemMarginRight,
|
||||||
styles.galleryItemMarginBottom,
|
styles.galleryItemMarginBottom,
|
||||||
]}
|
]}
|
||||||
|
onPress={() => {
|
||||||
|
if (item.template?.id) {
|
||||||
|
router.push({
|
||||||
|
pathname: '/templateDetail' as any,
|
||||||
|
params: { id: item.template.id },
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Image
|
<Image
|
||||||
source={item.template?.coverImageUrl ? { uri: item.template.coverImageUrl } : require('@/assets/images/membership.png')}
|
source={item.template?.coverImageUrl ? { uri: item.template.coverImageUrl } : require('@/assets/images/membership.png')}
|
||||||
|
|
@ -558,6 +566,14 @@ export default function My() {
|
||||||
index % 3 !== 2 && styles.galleryItemMarginRight,
|
index % 3 !== 2 && styles.galleryItemMarginRight,
|
||||||
styles.galleryItemMarginBottom,
|
styles.galleryItemMarginBottom,
|
||||||
]}
|
]}
|
||||||
|
onPress={() => {
|
||||||
|
if (item.template?.id) {
|
||||||
|
router.push({
|
||||||
|
pathname: '/templateDetail' as any,
|
||||||
|
params: { id: item.template.id },
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Image
|
<Image
|
||||||
source={item.template?.coverImageUrl ? { uri: item.template.coverImageUrl } : require('@/assets/images/membership.png')}
|
source={item.template?.coverImageUrl ? { uri: item.template.coverImageUrl } : require('@/assets/images/membership.png')}
|
||||||
|
|
|
||||||
|
|
@ -17,10 +17,9 @@ import { useTranslation } from 'react-i18next'
|
||||||
import { LeftArrowIcon } from '@/components/icon'
|
import { LeftArrowIcon } from '@/components/icon'
|
||||||
import SearchResultsGrid from '@/components/SearchResultsGrid'
|
import SearchResultsGrid from '@/components/SearchResultsGrid'
|
||||||
import { DynamicForm, type FormSchema, type DynamicFormRef } from '@/components/DynamicForm'
|
import { DynamicForm, type FormSchema, type DynamicFormRef } from '@/components/DynamicForm'
|
||||||
import { useTemplateActions, useTemplateDetail, useTemplateGenerations, useTemplateLike, useTemplateFavorite, type TemplateGeneration } from '@/hooks'
|
import { useTemplateActions, useTemplateDetail, useTemplateGenerations, type TemplateGeneration } from '@/hooks'
|
||||||
import Toast from '@/components/ui/Toast'
|
import Toast from '@/components/ui/Toast'
|
||||||
import UploadReferenceImageDrawer from '@/components/drawer/UploadReferenceImageDrawer'
|
import UploadReferenceImageDrawer from '@/components/drawer/UploadReferenceImageDrawer'
|
||||||
import { SocialActionBar } from '@/components/blocks/ui'
|
|
||||||
import { uploadFile } from '@/lib/uploadFile'
|
import { uploadFile } from '@/lib/uploadFile'
|
||||||
|
|
||||||
const CARD_HEIGHTS = [214, 236, 200, 220, 210, 225]
|
const CARD_HEIGHTS = [214, 236, 200, 220, 210, 225]
|
||||||
|
|
@ -34,8 +33,6 @@ export default function TemplateDetailScreen() {
|
||||||
const { data: templateDetail, loading: templateLoading, error: templateError, execute: loadTemplateDetail } = useTemplateDetail()
|
const { data: templateDetail, loading: templateLoading, error: templateError, execute: loadTemplateDetail } = useTemplateDetail()
|
||||||
const { generations, loading: generationsLoading, execute: loadGenerations } = useTemplateGenerations()
|
const { generations, loading: generationsLoading, execute: loadGenerations } = useTemplateGenerations()
|
||||||
const { runTemplate } = useTemplateActions()
|
const { runTemplate } = useTemplateActions()
|
||||||
const { liked, loading: likeLoading, like, unlike, checkLiked } = useTemplateLike(templateId)
|
|
||||||
const { favorited, loading: favoriteLoading, favorite, unfavorite, checkFavorited } = useTemplateFavorite(templateId)
|
|
||||||
|
|
||||||
const [formSchema, setFormSchema] = useState<FormSchema | null>(null)
|
const [formSchema, setFormSchema] = useState<FormSchema | null>(null)
|
||||||
const [drawerVisible, setDrawerVisible] = useState(false)
|
const [drawerVisible, setDrawerVisible] = useState(false)
|
||||||
|
|
@ -56,14 +53,6 @@ export default function TemplateDetailScreen() {
|
||||||
}
|
}
|
||||||
}, [templateDetail])
|
}, [templateDetail])
|
||||||
|
|
||||||
// Initialize like and favorite status
|
|
||||||
useEffect(() => {
|
|
||||||
if (templateId) {
|
|
||||||
checkLiked()
|
|
||||||
checkFavorited()
|
|
||||||
}
|
|
||||||
}, [templateId, checkLiked, checkFavorited])
|
|
||||||
|
|
||||||
const handleStartCreating = useCallback(() => {
|
const handleStartCreating = useCallback(() => {
|
||||||
// Navigate to generateVideo page if no form schema
|
// Navigate to generateVideo page if no form schema
|
||||||
if (!templateDetail?.formSchema?.startNodes || templateDetail.formSchema.startNodes.length === 0) {
|
if (!templateDetail?.formSchema?.startNodes || templateDetail.formSchema.startNodes.length === 0) {
|
||||||
|
|
@ -236,23 +225,6 @@ export default function TemplateDetailScreen() {
|
||||||
</View>
|
</View>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
|
|
||||||
{/* Social Action Bar */}
|
|
||||||
{templateId && (
|
|
||||||
<View style={styles.socialActionBarContainer}>
|
|
||||||
<SocialActionBar
|
|
||||||
templateId={templateId}
|
|
||||||
liked={liked}
|
|
||||||
favorited={favorited}
|
|
||||||
loading={likeLoading || favoriteLoading}
|
|
||||||
onLike={like}
|
|
||||||
onUnlike={unlike}
|
|
||||||
onFavorite={favorite}
|
|
||||||
onUnfavorite={unfavorite}
|
|
||||||
testID="social-action-bar"
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* Upload Drawer - 移到最外层以确保从屏幕底部弹出 */}
|
{/* Upload Drawer - 移到最外层以确保从屏幕底部弹出 */}
|
||||||
<UploadReferenceImageDrawer
|
<UploadReferenceImageDrawer
|
||||||
visible={drawerVisible}
|
visible={drawerVisible}
|
||||||
|
|
@ -365,12 +337,5 @@ const styles = StyleSheet.create({
|
||||||
color: '#ABABAB',
|
color: '#ABABAB',
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
},
|
},
|
||||||
socialActionBarContainer: {
|
|
||||||
position: 'absolute',
|
|
||||||
bottom: 0,
|
|
||||||
left: 0,
|
|
||||||
right: 0,
|
|
||||||
backgroundColor: 'transparent',
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue