better loading

This commit is contained in:
songtianlun 2025-08-03 00:32:47 +08:00
parent 8b10e64128
commit ccae3cbc3d

View File

@ -57,13 +57,12 @@ export default function StudioPage() {
const t = useTranslations('studio')
const [prompts, setPrompts] = useState<Prompt[]>([])
const [filteredPrompts, setFilteredPrompts] = useState<Prompt[]>([])
const [searchQuery, setSearchQuery] = useState('')
const [selectedTag, setSelectedTag] = useState<string>('')
const [sortField, setSortField] = useState<SortField>('updatedAt')
const [sortOrder, setSortOrder] = useState<SortOrder>('desc')
const [viewMode, setViewMode] = useState<ViewMode>('grid')
const [isLoading, setIsLoading] = useState(true)
const [isLoading, setIsLoading] = useState(false)
const [allTags, setAllTags] = useState<string[]>([])
// Edit Modal
@ -152,10 +151,7 @@ export default function StudioPage() {
}, [currentPage, searchQuery, selectedTag, sortField, sortOrder, user, fetchPrompts])
// Since filtering and sorting is now done on the server,
// we just use the prompts directly
useEffect(() => {
setFilteredPrompts(prompts)
}, [prompts])
// we use prompts directly without additional state
const handleCreatePrompt = () => {
router.push('/studio/new')
@ -178,7 +174,6 @@ export default function StudioPage() {
const handleEditModalSave = (updatedPrompt: Prompt) => {
// Update the prompt in the local state
setPrompts(prev => prev.map(p => p.id === updatedPrompt.id ? updatedPrompt : p))
setFilteredPrompts(prev => prev.map(p => p.id === updatedPrompt.id ? updatedPrompt : p))
}
const handleShowDetails = (prompt: Prompt) => {
@ -215,7 +210,6 @@ export default function StudioPage() {
// Update the prompt in local state
const updatedPrompt = await response.json()
setPrompts(prev => prev.map(p => p.id === promptId ? { ...p, permissions: updatedPrompt.permissions, visibility: updatedPrompt.visibility } : p))
setFilteredPrompts(prev => prev.map(p => p.id === promptId ? { ...p, permissions: updatedPrompt.permissions, visibility: updatedPrompt.visibility } : p))
} catch (error) {
console.error('Error updating permissions:', error)
throw error
@ -273,7 +267,7 @@ export default function StudioPage() {
}
// Use server-side pagination
const currentPrompts = filteredPrompts
const currentPrompts = prompts
if (loading) {
return null
@ -394,9 +388,9 @@ export default function StudioPage() {
{/* Quick Stats */}
<div className="flex items-center justify-between mt-4 pt-3 border-t border-border/30">
<div className="text-sm text-muted-foreground">
{filteredPrompts.length > 0 ? (
{prompts.length > 0 ? (
<span>
Showing <span className="font-medium text-foreground">{filteredPrompts.length}</span> of <span className="font-medium text-foreground">{pagination.total}</span> prompts
Showing <span className="font-medium text-foreground">{prompts.length}</span> of <span className="font-medium text-foreground">{pagination.total}</span> prompts
</span>
) : (
<span>No prompts found</span>
@ -423,7 +417,7 @@ export default function StudioPage() {
<LoadingRing size="lg" className="mb-4" />
<p className="text-muted-foreground">{t('loadingStudio')}</p>
</div>
) : filteredPrompts.length === 0 ? (
) : prompts.length === 0 ? (
<div className="text-center py-16">
<div className="bg-muted/30 rounded-full w-24 h-24 flex items-center justify-center mx-auto mb-6">
<FileText className="h-12 w-12 text-muted-foreground" />