diff --git a/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.html b/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.html index 7af6767..31b6ca8 100644 --- a/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.html +++ b/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.html @@ -63,7 +63,8 @@ (click)="targetChatUser($event)" > - @if (downloadFilesService.uploadFiles.length >= 1){ + @if (downloadFilesService.uploadFiles.length >= 1 && !fileDataError && + !fileSizeError){

{{ "channel-msg-box.text0" | translate }}

@@ -71,6 +72,10 @@

{{ "channel-msg-box.text1" | translate }}

+ } @if(fileSizeError){ +

+ {{ "channel-msg-box.text2" | translate }} +

}
@if (toggleBoolean.selectUserInMsgBox) { diff --git a/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.ts b/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.ts index 69f0eec..3d17aa0 100644 --- a/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.ts +++ b/src/app/components/main-chat/chat-msg-box/chat-msg-box.component.ts @@ -47,6 +47,7 @@ export class ChatMsgBoxComponent { hasFile: boolean = false; fileDataError: boolean = false; + fileSizeError: boolean = false; currentFiles!: FileList; getFileIcons = [ './assets/img/documentIcon.svg', @@ -104,9 +105,11 @@ export class ChatMsgBoxComponent { onFileChange(event: any) { if (this.downloadFilesService.uploadFiles.length < 1) { const file = event.target.files[0]; - const icon = this.checkIcon({ type: file.type }); - if (icon !== null) { + const fileIcon = this.checkIcon({ type: file.type }); + const fileSize = this.checkFileSize(file.size); + if (fileIcon !== null && fileIcon && fileSize) { this.fileDataError = false; + this.fileSizeError = false; this.currentFiles = event.target.files; this.hasFile = this.currentFiles.length > 0; if (this.currentFiles) { @@ -115,12 +118,23 @@ export class ChatMsgBoxComponent { this.downloadFilesService.uploadFiles.push(fileInfo); } } + } else if (fileIcon) { + this.fileSizeError = true; } else { this.fileDataError = true; } } } + checkFileSize(fileSize: number): boolean { + const maxSizeInBytes = 1 * 1024 * 1024; // Maximum file size of 1 MB + if (fileSize <= maxSizeInBytes) { + return true; + } else { + return false; + } + } + /** * Checks the file type and returns the corresponding icon. * Img (1): PNG, GIF, JPG, JPEG diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json index 4cd7b74..16c54a6 100644 --- a/src/assets/i18n/de.json +++ b/src/assets/i18n/de.json @@ -75,6 +75,7 @@ "channel-msg-box": { "text0": "Maximal eine Datei pro Nachricht", "text1": "Dieses Dateiformat ist ungültig", + "text2": "Dateigröße max. 1 MB", "placeholder": "Geben Sie Ihre Nachricht ein" }, diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index ac8af6d..b5c3180 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -75,6 +75,7 @@ "channel-msg-box": { "text0": "Maximum one file per message", "text1": "This file format is invalid", + "text2": "File size max. 1 MB", "placeholder": "Enter your message" },