Fix oversized profile image crop uploads (#39958)
This commit is contained in:
parent
ced453a5fe
commit
6c6d06a2a1
@ -94,12 +94,12 @@ export const ImageUploadModal: FC<
|
|||||||
setStep('select');
|
setStep('select');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
void calculateCroppedImage(imageSrc, crop).then((blob) => {
|
void calculateCroppedImage(imageSrc, crop, location).then((blob) => {
|
||||||
setImageBlob(blob);
|
setImageBlob(blob);
|
||||||
setStep('alt');
|
setStep('alt');
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
[imageSrc],
|
[imageSrc, location],
|
||||||
);
|
);
|
||||||
|
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
@ -418,9 +418,14 @@ const StepAlt: FC<{
|
|||||||
async function calculateCroppedImage(
|
async function calculateCroppedImage(
|
||||||
imageSrc: string,
|
imageSrc: string,
|
||||||
crop: Area,
|
crop: Area,
|
||||||
|
location: ImageLocation,
|
||||||
): Promise<Blob> {
|
): Promise<Blob> {
|
||||||
const image = await dataUriToImage(imageSrc);
|
const image = await dataUriToImage(imageSrc);
|
||||||
const canvas = new OffscreenCanvas(crop.width, crop.height);
|
const maxWidth = location === 'avatar' ? 400 : 1500;
|
||||||
|
const scale = Math.min(1, maxWidth / crop.width);
|
||||||
|
const width = Math.round(crop.width * scale);
|
||||||
|
const height = Math.round(crop.height * scale);
|
||||||
|
const canvas = new OffscreenCanvas(width, height);
|
||||||
const ctx = canvas.getContext('2d');
|
const ctx = canvas.getContext('2d');
|
||||||
if (!ctx) {
|
if (!ctx) {
|
||||||
throw new Error('Failed to get canvas context');
|
throw new Error('Failed to get canvas context');
|
||||||
@ -437,8 +442,8 @@ async function calculateCroppedImage(
|
|||||||
crop.height,
|
crop.height,
|
||||||
0,
|
0,
|
||||||
0,
|
0,
|
||||||
crop.width,
|
width,
|
||||||
crop.height,
|
height,
|
||||||
);
|
);
|
||||||
|
|
||||||
return canvas.convertToBlob();
|
return canvas.convertToBlob();
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user