From 495b64aaecbaba6b5ce7fa46777e77a84d7dc8d8 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Sat, 17 Feb 2024 11:35:55 -0600
Subject: [PATCH] Prioritize initial /grid photos

---
 src/app/grid/page.tsx         | 2 +-
 src/components/ImageSmall.tsx | 3 +++
 src/photo/PhotoGrid.tsx       | 3 +++
 src/photo/PhotoSmall.tsx      | 3 +++
 4 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/app/grid/page.tsx b/src/app/grid/page.tsx
index 5d94e19e..6a139fc8 100644
--- a/src/app/grid/page.tsx
+++ b/src/app/grid/page.tsx
@@ -36,7 +36,7 @@ export default async function GridPage() {
     photos.length > 0
       ? <SiteGrid
         contentMain={<div className="space-y-0.5 sm:space-y-1">
-          <PhotoGrid {...{ photos }} />
+          <PhotoGrid {...{ photos, photoPriority: true }} />
           <Suspense>
             <MorePhotosGrid
               initialOffset={INFINITE_SCROLL_MULTIPLE_GRID}
diff --git a/src/components/ImageSmall.tsx b/src/components/ImageSmall.tsx
index 5c8cfec8..60a9f9ff 100644
--- a/src/components/ImageSmall.tsx
+++ b/src/components/ImageSmall.tsx
@@ -7,18 +7,21 @@ export default function ImageSmall({
   alt,
   aspectRatio,
   blurData,
+  priority,
 }: {
   className?: string
   src: string
   alt: string
   aspectRatio: number
   blurData?: string
+  priority?: boolean
 }) {
   return (
     <ImageBlurFallback {...{
       className,
       src,
       alt,
+      priority,
       blurDataURL: blurData,
       placeholder: 'blur',
       width: IMAGE_SMALL_WIDTH,
diff --git a/src/photo/PhotoGrid.tsx b/src/photo/PhotoGrid.tsx
index cd77b495..fe83b0bb 100644
--- a/src/photo/PhotoGrid.tsx
+++ b/src/photo/PhotoGrid.tsx
@@ -12,6 +12,7 @@ export default function PhotoGrid({
   tag,
   camera,
   simulation,
+  photoPriority,
   fast,
   animate = true,
   animateOnFirstLoadOnly,
@@ -24,6 +25,7 @@ export default function PhotoGrid({
   tag?: string
   camera?: Camera
   simulation?: FilmSimulation
+  photoPriority?: boolean
   fast?: boolean
   animate?: boolean
   animateOnFirstLoadOnly?: boolean
@@ -72,6 +74,7 @@ export default function PhotoGrid({
             camera,
             simulation,
             selected: photo.id === selectedPhoto?.id,
+            priority: photoPriority,
           }} />
         </div>).concat(additionalTile ?? [])}
     />
diff --git a/src/photo/PhotoSmall.tsx b/src/photo/PhotoSmall.tsx
index b560de25..48883fff 100644
--- a/src/photo/PhotoSmall.tsx
+++ b/src/photo/PhotoSmall.tsx
@@ -15,6 +15,7 @@ export default function PhotoSmall({
   simulation,
   selected,
   showAdminMenu,
+  priority,
 }: {
   photo: Photo
   tag?: string
@@ -22,6 +23,7 @@ export default function PhotoSmall({
   simulation?: FilmSimulation
   selected?: boolean
   showAdminMenu?: boolean
+  priority?: boolean
 }) {
   return (
     <Link
@@ -48,6 +50,7 @@ export default function PhotoSmall({
         blurData={photo.blurData}
         className="w-full"
         alt={titleForPhoto(photo)}
+        priority={priority}
       />
     </Link>
   );