diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6739ae2a..5a11f131 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,7 +6,6 @@ import {
import PhotosEmptyState from '@/photo/PhotosEmptyState';
import { Metadata } from 'next/types';
import { MAX_PHOTOS_TO_SHOW_OG } from '@/image-response';
-import PhotosLarge from '@/photo/PhotosLarge';
import InfinitePhotoScroll from '../photo/InfinitePhotoScroll';
export const dynamic = 'force-static';
@@ -30,12 +29,8 @@ export default async function HomePage() {
return (
photos.length > 0
?
diff --git a/src/photo/InfinitePhotoScroll.tsx b/src/photo/InfinitePhotoScroll.tsx
index e90c66c3..822b1a8c 100644
--- a/src/photo/InfinitePhotoScroll.tsx
+++ b/src/photo/InfinitePhotoScroll.tsx
@@ -8,8 +8,10 @@ import SiteGrid from '@/components/SiteGrid';
import Spinner from '@/components/Spinner';
import { getPhotosAction } from '@/photo/actions';
import { useAppState } from '@/state/AppState';
+import { Photo } from '.';
export default function InfinitePhotoScroll({
+ initialPhotos,
key = 'PHOTOS',
initialOffset = 0,
itemsPerPage = 12,
@@ -17,6 +19,7 @@ export default function InfinitePhotoScroll({
triggerOnView = true,
debug = true,
}: {
+ initialPhotos?: Photo[]
key?: string
initialOffset?: number
itemsPerPage?: number
@@ -29,8 +32,8 @@ export default function InfinitePhotoScroll({
const buttonRef = useRef(null);
const fetcher = useCallback((key: string) => {
+ if (debug) { console.log('Fetching', key); }
const offset = parseInt(key.split('-')[1]);
- if (debug) { console.log('Fetching', offset); }
return getPhotosAction(
initialOffset + offset * itemsPerPage,
itemsPerPage,
@@ -39,15 +42,16 @@ export default function InfinitePhotoScroll({
}, [initialOffset, itemsPerPage, debug]);
const { data, isLoading, error, mutate, size, setSize } = useSwrInfinite(
- (size, prev: []) => prev && prev.length === 0
+ (size: number, prev: []) => prev && prev.length === 0
? null
:`${key}-${size}`,
fetcher,
- {
+ {
revalidateOnFocus: isUserSignedIn,
revalidateOnReconnect: isUserSignedIn,
revalidateFirstPage: isUserSignedIn,
- }
+ ...initialPhotos && { fallbackData: [initialPhotos] },
+ },
);
const isFinished = useMemo(() =>
@@ -56,7 +60,7 @@ export default function InfinitePhotoScroll({
useEffect(() => {
if (prefetch) {
- preload(`${key}-${size}`, fetcher);
+ preload(`${key}-${size ?? 0 + 1}`, fetcher);
}
}, [prefetch, key, size, fetcher]);