diff --git a/src/app/admin/photos/page.tsx b/src/app/admin/photos/page.tsx
index b59a38f8..cb8f78bf 100644
--- a/src/app/admin/photos/page.tsx
+++ b/src/app/admin/photos/page.tsx
@@ -33,6 +33,7 @@ import { PRO_MODE_ENABLED } from '@/site/config';
import SubmitButtonWithStatus from '@/components/SubmitButtonWithStatus';
import IconGrSync from '@/site/IconGrSync';
import { getStoragePhotoUrlsNoStore } from '@/services/storage/cache';
+import PhotoDate from '@/photo/PhotoDate';
const DEBUG_PHOTO_BLOBS = false;
@@ -103,7 +104,7 @@ export default async function AdminPhotosPage({
'lg:w-[50%] uppercase',
'text-dim',
)}>
- {photo.takenAtNaive}
+
+ {/* Mobile */}
+
+ {formatDate(date, true)}
+
+ {/* Desktop */}
+
+ {formatDate(date)}
+
+ >
+ );
+}
diff --git a/src/photo/PhotoDate.tsx b/src/photo/PhotoDate.tsx
new file mode 100644
index 00000000..c2a9ea24
--- /dev/null
+++ b/src/photo/PhotoDate.tsx
@@ -0,0 +1,17 @@
+import ResponsiveDate from '@/components/ResponsiveDate';
+import { Photo } from '.';
+import { useMemo } from 'react';
+
+export default function PhotoDate({
+ photo: { takenAtNaive },
+}: {
+ photo: Photo
+}) {
+ const date = useMemo(() => {
+ const date = new Date(takenAtNaive);
+ return isNaN(date.getTime()) ? new Date() : date;
+ }, [takenAtNaive]);
+ return (
+
+ );
+}
diff --git a/src/site/CommandK.tsx b/src/site/CommandK.tsx
index 523207bf..b006f7b6 100644
--- a/src/site/CommandK.tsx
+++ b/src/site/CommandK.tsx
@@ -21,7 +21,6 @@ import { authCached } from '@/auth/cache';
import { getPhotos } from '@/services/vercel-postgres';
import { getKeywordsForPhoto, photoQuantityText, titleForPhoto } from '@/photo';
import PhotoTiny from '@/photo/PhotoTiny';
-import { formatDate } from '@/utility/date';
import { formatCount, formatCountDescriptive } from '@/utility/string';
import { BiLockAlt, BiSolidUser } from 'react-icons/bi';
import { sortTagsObject } from '@/tag';
@@ -31,6 +30,7 @@ import { TbPhoto } from 'react-icons/tb';
import { IoMdCamera } from 'react-icons/io';
import { HiDocumentText } from 'react-icons/hi';
import { signOutAction } from '@/auth/actions';
+import PhotoDate from '@/photo/PhotoDate';
export default async function CommandK() {
const [
@@ -147,14 +147,7 @@ export default async function CommandK() {
items: photos.map(photo => ({
label: titleForPhoto(photo),
keywords: getKeywordsForPhoto(photo),
- annotation: <>
-
- {formatDate(photo.takenAt)}
-
-
- {formatDate(photo.takenAt, true)}
-
- >,
+ annotation:
,
accessory:
,
path: pathForPhoto(photo),
})),