From 1e748e0d8a486f18966dbb3de511a56993b52075 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Thu, 25 Apr 2024 10:06:35 -0500
Subject: [PATCH] Add cache keys to photos

---
 src/admin/AdminPhotoMenuClient.tsx |  7 ++++++-
 src/photo/InfinitePhotoScroll.tsx  |  3 ++-
 src/photo/actions.tsx              | 13 +++++++++++--
 src/photo/index.ts                 |  2 ++
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/admin/AdminPhotoMenuClient.tsx b/src/admin/AdminPhotoMenuClient.tsx
index 24f23c70..575323cd 100644
--- a/src/admin/AdminPhotoMenuClient.tsx
+++ b/src/admin/AdminPhotoMenuClient.tsx
@@ -10,6 +10,7 @@ import { usePathname } from 'next/navigation';
 import { BiTrash } from 'react-icons/bi';
 import MoreMenu from '@/components/MoreMenu';
 import { useAppState } from '@/state/AppState';
+import { useSWRConfig } from 'swr';
 
 export default function AdminPhotoMenuClient({
   photo,
@@ -24,6 +25,8 @@ export default function AdminPhotoMenuClient({
   const shouldRedirectFav = isPathFavs(path) && isFav;
   const shouldRedirectDelete = pathForPhoto(photo.id) === path;
 
+  const { mutate } = useSWRConfig();
+
   return (
     isUserSignedIn
       ? <MoreMenu {...{
@@ -46,7 +49,9 @@ export default function AdminPhotoMenuClient({
             action: () => toggleFavoritePhotoAction(
               photo.id,
               shouldRedirectFav,
-            ),
+            ).then(() => {
+              if (photo.cacheKey) { mutate( photo.cacheKey ); }
+            }),             
           }, {
             label: 'Delete',
             icon: <BiTrash
diff --git a/src/photo/InfinitePhotoScroll.tsx b/src/photo/InfinitePhotoScroll.tsx
index 1655db2f..e90c66c3 100644
--- a/src/photo/InfinitePhotoScroll.tsx
+++ b/src/photo/InfinitePhotoScroll.tsx
@@ -15,7 +15,7 @@ export default function InfinitePhotoScroll({
   itemsPerPage = 12,
   prefetch = true,
   triggerOnView = true,
-  debug,
+  debug = true,
 }: {
   key?: string
   initialOffset?: number
@@ -34,6 +34,7 @@ export default function InfinitePhotoScroll({
     return getPhotosAction(
       initialOffset + offset * itemsPerPage,
       itemsPerPage,
+      key,
     );
   }, [initialOffset, itemsPerPage, debug]);
 
diff --git a/src/photo/actions.tsx b/src/photo/actions.tsx
index cd4a24bb..6f103858 100644
--- a/src/photo/actions.tsx
+++ b/src/photo/actions.tsx
@@ -220,5 +220,14 @@ export async function getPhotoItemsAction(query: string) {
     : [];
 }
 
-export const getPhotosAction = async (offset: number, limit: number) =>
-  getPhotosCachedCached({ offset, limit });
+export const getPhotosAction = async (
+  offset: number,
+  limit: number,
+  cacheKey: string,
+) =>
+  getPhotosCachedCached({ offset, limit }).then(photos =>
+    photos.map(photo => ({
+      ...photo,
+      cacheKey,
+    }))
+  );
diff --git a/src/photo/index.ts b/src/photo/index.ts
index a742c079..88f32127 100644
--- a/src/photo/index.ts
+++ b/src/photo/index.ts
@@ -64,6 +64,7 @@ export interface PhotoDbInsert extends PhotoExif {
   hidden?: boolean
   takenAt: string
   takenAtNaive: string
+  cacheKey?: string
 }
 
 // Raw db response
@@ -83,6 +84,7 @@ export interface Photo extends PhotoDb {
   exposureTimeFormatted?: string
   exposureCompensationFormatted?: string
   takenAtNaiveFormatted: string
+  cacheKey?: string
 }
 
 export const parsePhotoFromDb = (photoDbRaw: PhotoDb): Photo => {