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"
},