better loading

This commit is contained in:
songtianlun 2025-08-03 00:37:33 +08:00
parent ccae3cbc3d
commit 8b5d5ce5eb

View File

@ -63,6 +63,7 @@ export default function StudioPage() {
const [sortOrder, setSortOrder] = useState<SortOrder>('desc')
const [viewMode, setViewMode] = useState<ViewMode>('grid')
const [isLoading, setIsLoading] = useState(false)
const [isInitialLoad, setIsInitialLoad] = useState(true)
const [allTags, setAllTags] = useState<string[]>([])
// Edit Modal
@ -87,11 +88,13 @@ export default function StudioPage() {
})
// Fetch prompts from API
const fetchPrompts = useCallback(async () => {
const fetchPrompts = useCallback(async (showLoading = false) => {
if (!user) return
try {
setIsLoading(true)
if (showLoading) {
setIsLoading(true)
}
const params = new URLSearchParams({
userId: user.id,
page: currentPage.toString(),
@ -111,9 +114,14 @@ export default function StudioPage() {
} catch (error) {
console.error('Error fetching prompts:', error)
} finally {
setIsLoading(false)
if (showLoading) {
setIsLoading(false)
}
if (isInitialLoad) {
setIsInitialLoad(false)
}
}
}, [user, currentPage, itemsPerPage, searchQuery, selectedTag, sortField, sortOrder])
}, [user, currentPage, itemsPerPage, searchQuery, selectedTag, sortField, sortOrder, isInitialLoad])
// Initialize and fetch tags only once
useEffect(() => {
@ -144,11 +152,11 @@ export default function StudioPage() {
if (!user) return
const timeoutId = setTimeout(() => {
fetchPrompts()
fetchPrompts(isInitialLoad)
}, searchQuery ? 300 : 0) // Debounce search queries
return () => clearTimeout(timeoutId)
}, [currentPage, searchQuery, selectedTag, sortField, sortOrder, user, fetchPrompts])
}, [currentPage, searchQuery, selectedTag, sortField, sortOrder, user, fetchPrompts, isInitialLoad])
// Since filtering and sorting is now done on the server,
// we use prompts directly without additional state
@ -248,7 +256,7 @@ export default function StudioPage() {
}
// Refresh the prompts list
await fetchPrompts()
await fetchPrompts(false)
setIsBulkAddModalOpen(false)
} catch (error) {
console.error('Error bulk adding prompts:', error)