Revert image fetch change

src/image-response/components/ImagePhotoGrid.tsx

@@ -7,7 +7,6 @@ import {
   doAllPhotosHaveOptimizedFiles,
   getOptimizedPhotoUrl,
 } from '@/photo/storage';
-import { fetchBase64ImageFromUrl } from '@/utility/image';
 
 export default async function ImagePhotoGrid({
   photos,
@@ -54,24 +53,7 @@ export default async function ImagePhotoGrid({
 
   const doOptimizedFilesExist = await doAllPhotosHaveOptimizedFiles(photos);
 
-  const photoData = await Promise.all(photos.map(async ({ id, url }) => {
+  const renderPhoto = ({ id, url }: Photo, width: number, height: number) =>
-    const data = await fetchBase64ImageFromUrl(
-      getOptimizedPhotoUrl({
-        imageUrl: url,
-        size: nextImageWidth,
-        addBypassSecret: IS_PREVIEW,
-        compatibilityMode: !doOptimizedFilesExist,
-      }),
-      { mode: 'no-cors' },
-    );
-    return { id, data };
-  }));
-
-  const renderPhoto = (
-    { id, data }: typeof photoData[number],
-    width: number,
-    height: number,
-  ) =>
     <div
       key={id}
       style={{
@@ -83,7 +65,12 @@ export default async function ImagePhotoGrid({
       }}
     >
       <img {...{
-        src: data,
+        src: getOptimizedPhotoUrl({
+          imageUrl: url,
+          size: nextImageWidth,
+          addBypassSecret: IS_PREVIEW,
+          compatibilityMode: !doOptimizedFilesExist,
+        }),
         style: {
           ...imageStyle,
           width: '100%',
@@ -113,7 +100,7 @@ export default async function ImagePhotoGrid({
             width: cellWidth,
             height: cellHeight * 2,
           }}>
-            {renderPhoto(photoData[0], cellWidth, cellHeight * 2)}
+            {renderPhoto(photos[0], cellWidth, cellHeight * 2)}
           </div>
           {/* Small images (R) */}
           <div style={{
@@ -122,12 +109,12 @@ export default async function ImagePhotoGrid({
             width: cellWidth,
             height: cellHeight,
           }}>
-            {photoData.slice(1).map(photo =>
+            {photos.slice(1).map(photo =>
               renderPhoto(photo, cellWidth, cellHeight),
             )}
           </div>
         </>
-        : photoData.slice(0, count).map(photo =>
+        : photos.slice(0, count).map(photo =>
           renderPhoto(photo, cellWidth, cellHeight),
         )}
     </div>