Revert image fetch change
This commit is contained in:
parent
7c9b99bff0
commit
053faae9b6
@ -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 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,
|
||||
) =>
|
||||
const renderPhoto = ({ id, url }: Photo, 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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user