diff --git a/apps/www/components/LaunchWeek/Ticket/TicketsGrid.tsx b/apps/www/components/LaunchWeek/Ticket/TicketsGrid.tsx index a0a83f068b4..66f504702a5 100644 --- a/apps/www/components/LaunchWeek/Ticket/TicketsGrid.tsx +++ b/apps/www/components/LaunchWeek/Ticket/TicketsGrid.tsx @@ -6,9 +6,10 @@ import { useMobileViewport } from '../../../hooks/useMobileViewport' interface Props { loadedUsers: any[] isLoading: boolean + pageCount: number } -export default function TicketsGrid({ loadedUsers, isLoading }: Props) { +export default function TicketsGrid({ loadedUsers, isLoading, pageCount }: Props) { const STORAGE_URL = 'https://obuldanrptloktxcffvn.supabase.co/storage/v1/object/public/images/lw7' const getOgUrl = (username: string) => `${STORAGE_URL}/tickets/gallery/${username}.png` const isMobile = useMobileViewport(768) @@ -58,7 +59,23 @@ export default function TicketsGrid({ loadedUsers, isLoading }: Props) { ) })} {/* TODO: Add PAGE_COUNT length skeleton loaders when loading */} - {isLoading &&
} + {/* {isLoading && } */} + {isLoading && + Array.from({ length: pageCount }, (_, i) => ( + + ))}
) } diff --git a/apps/www/pages/launch-week/tickets/index.tsx b/apps/www/pages/launch-week/tickets/index.tsx index df5f9cb2fc6..fb82e4b9dc5 100644 --- a/apps/www/pages/launch-week/tickets/index.tsx +++ b/apps/www/pages/launch-week/tickets/index.tsx @@ -61,13 +61,13 @@ export default function TicketsPage({ users }: Props) { const loadMoreUsers = async (offset: number) => { if (isLast) return - setOffset((prev) => prev + 1) setIsLoading(true) + setOffset((prev) => prev + 1) const { data: users } = await loadUsers(offset, PAGE_COUNT) console.log(`loaded users (offset ${offset}): `, users) setLoadedUsers((prevUsers) => [...prevUsers, ...(users as any[])]) - setIsLoading(false) if ((users as any[]).length < PAGE_COUNT) setIsLast(true) + setIsLoading(false) } useEffect(() => { @@ -85,7 +85,7 @@ export default function TicketsPage({ users }: Props) { useEffect(() => { window.addEventListener( 'scroll', - debounce(() => !isLast && isBottomInView(), 500) + debounce(() => !isLast && isBottomInView(), 200) ) return () => { @@ -138,7 +138,7 @@ export default function TicketsPage({ users }: Props) {
- +