Add grid-first site configuration

README.md

@@ -99,6 +99,7 @@ _⚠️ READ BEFORE PROCEEDING_
 Application behavior can be changed by configuring the following environment variables:
 
 - `NEXT_PUBLIC_PRO_MODE = 1` enables higher quality image storage (results in increased storage usage)
+- `NEXT_PUBLIC_SHOW_GRID_FIRST = 1` shows grid layout on homepage
 - `NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES = 1` enables static optimization for pages, i.e., renders pages at build time (results in increased project usage)—⚠️ _Experimental_
 - `NEXT_PUBLIC_STATICALLY_OPTIMIZE_OG_IMAGES = 1` enables static optimization for OG images, i.e., renders images at build time (results in increased project usage)—⚠️ _Experimental_
 - `NEXT_PUBLIC_MATTE_PHOTOS = 1` constrains the size of each photo, and enables a surrounding border (potentially useful for photos with tall aspect ratios)

src/site/SiteChecklistClient.tsx

@@ -49,6 +49,7 @@ export default function SiteChecklistClient({
   showFilmSimulations,
   showExifInfo,
   isProModeEnabled,
+  isGridFirst,
   isStaticallyOptimized,
   arePagesStaticallyOptimized,
   areOGImagesStaticallyOptimized,
@@ -424,6 +425,15 @@ export default function SiteChecklistClient({
               higher quality image storage:
               {renderEnvVars(['NEXT_PUBLIC_PRO_MODE'])}
             </ChecklistRow>
+            <ChecklistRow
+              title="Show grid first"
+              status={isGridFirst}
+              optional
+            >
+              Set environment variable to {'"1"'} to show grid layout
+              on homepage:
+              {renderEnvVars(['NEXT_PUBLIC_SHOW_GRID_FIRST'])}
+            </ChecklistRow>
             <ChecklistRow
               title="Static Optimization"
               status={isStaticallyOptimized}

src/site/config.ts

@@ -116,6 +116,8 @@ export const CURRENT_STORAGE: StorageType =
 
 export const PRO_MODE_ENABLED =
   process.env.NEXT_PUBLIC_PRO_MODE === '1';
+export const SHOW_GRID_FIRST =
+  process.env.NEXT_PUBLIC_SHOW_GRID_FIRST === '1';
 export const STATICALLY_OPTIMIZED_PAGES =
   process.env.NEXT_PUBLIC_STATICALLY_OPTIMIZE_PAGES === '1';
 export const STATICALLY_OPTIMIZED_OG_IMAGES =
@@ -183,6 +185,7 @@ export const CONFIG_CHECKLIST_STATUS = {
   showFilmSimulations: SHOW_FILM_SIMULATIONS,
   showExifInfo: SHOW_EXIF_DATA,
   isProModeEnabled: PRO_MODE_ENABLED,
+  isGridFirst: SHOW_GRID_FIRST,
   isStaticallyOptimized: (
     STATICALLY_OPTIMIZED_PAGES ||
     STATICALLY_OPTIMIZED_OG_IMAGES