Fix s3 images uploading

Author: MrBartusek

apps/api/src/images/images.service.ts

@@ -24,25 +24,26 @@ export class ImagesService {
 		dto: ImageDto,
 	): Promise<string | null> {
 		const documentHasImage = document.imageKey != null;
+		const newImageReceived = dto.data != null;
 
-		if (dto.hasImage && !documentHasImage) {
-			if (!dto.data) {
-				throw new BadRequestException(
-					'Malformed ImageDto, object does not have and image, data property expected',
-				);
-			}
-			return this.uploadBase64(dto.data);
-		} else if (!dto.hasImage && documentHasImage) {
-			await this.s3Service.deleteObject(document.imageKey);
-			return null;
-		} else if (dto.hasImage && documentHasImage && dto.data) {
+		const shouldUploadImage = dto.hasImage && newImageReceived;
+		const shouldDeleteImage = documentHasImage && (shouldUploadImage || !dto.hasImage);
+
+		if (shouldDeleteImage) {
 			await this.s3Service.deleteObject(document.imageKey);
+		}
+		if (shouldUploadImage) {
 			return this.uploadBase64(dto.data);
 		}
+		return null;
+	}
+
+	private base64ToBuffer(base64: string) {
+		return Buffer.from(base64.replace(/^data:image\/\w+;base64,/, ''), 'base64');
 	}
 
 	private async uploadBase64(base64: string) {
-		const buffer = Buffer.from(base64, 'base64');
+		const buffer = this.base64ToBuffer(base64);
 		const key = await this.s3Service.uploadObject(buffer);
 		return key;
 	}

apps/api/src/s3/s3.service.ts

@@ -16,17 +16,18 @@ export class S3Service {
 
 	private readonly logger = new Logger(S3Service.name);
 
-	async uploadObject(file: Buffer): Promise<string> {
+	async uploadObject(buffer: Buffer): Promise<string> {
 		const key = this.generateFileKey();
+
 		const params: PutObjectCommandInput = {
 			Bucket: AWS_BUCKET_NAME,
-			Body: file,
+			Body: buffer,
 			Key: key,
 		};
 
 		await this.s3.putObject(params);
 
-		this.logger.log(`Uploaded S3 object with key: ${key}`);
+		this.logger.log(`Uploaded S3 object! Key: "${key}"`);
 		return key;
 	}
 

packages/shared-types/src/ImageDto.ts

@@ -1,4 +1,4 @@
-import { IsBoolean, IsDataURI, IsEmpty, IsOptional } from "class-validator";
+import { IsBoolean, IsDataURI, IsEmpty, IsMimeType, IsOptional } from "class-validator";
 
 export class ImageDto {
     @IsBoolean()
@@ -10,5 +10,5 @@ export class ImageDto {
 
     @IsOptional()
     @IsDataURI()
-    data?: string;
+    data?: string
 }