[ISSUE 195] fixed

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts

@@ -1160,22 +1160,18 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
           fui => fui.file.size > fileAllowSize * 1024 * 1024
         ).length
       ) {
-        this.dialogService.open<
-          AlertDialogComponent,
-          AlertDialogData,
-          AlertDialogResult
-        >(AlertDialogComponent, {
-          width: '360px',
-          data: {
-            title: '',
-            message: this.translateService.instant(
-              'common.file.errors.oversize',
-              {
+        this.snackBarService.open(
+          this.translateService.instant('common.file.errors.oversize', {
             maxSize: fileAllowSize
+          }),
+          '',
+          {
+            duration: 1000,
+            verticalPosition: 'bottom',
+            horizontalPosition: 'center'
           }
-            )
-          }
-        });
+        );
+
         if (!!this.fileUploadQueue) {
           this.fileUploadQueue.onUploadComplete();
         }
@@ -1191,22 +1187,18 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
         this.fileUploadQueue.onUploadComplete();
       }
 
-      this.dialogService.open<
-        AlertDialogComponent,
-        AlertDialogData,
-        AlertDialogResult
-      >(AlertDialogComponent, {
-        data: {
-          title: 'Alert',
-          html: `${this.translateService.instant(
-            'common.file.errors.notSupporedType'
-          )} ${
-            checkExt.reject.length > 0
-              ? '<br/>(' + checkExt.reject.join(',') + ')'
-              : ''
-          }`
+      this.snackBarService.open(
+        this.translateService.instant('common.file.errors.notSupporedType', {
+          supporedType:
+            checkExt.reject.length > 0 ? checkExt.reject.join(',') : ''
+        }),
+        '',
+        {
+          duration: 1000,
+          verticalPosition: 'bottom',
+          horizontalPosition: 'center'
         }
-      });
+      );
 
       return;
     }

projects/ucap-webmessenger-app/src/assets/i18n/en.json

@@ -434,7 +434,7 @@
         "expired": "This file has expired",
         "noPreview": "This file does not support preview.",
         "cantPlay": "This file does not support playing.",
-        "notSupporedType": "File format is not supported.",
+        "notSupporedType": "File format is not supported. <br/> ({{supporedType}})",
         "oversize": "You cannot upload files larger than {{size}} megabytes."
       }
     },

projects/ucap-webmessenger-app/src/assets/i18n/ko.json

@@ -434,7 +434,7 @@
         "expired": "기간이 만료된 파일입니다",
         "noPreview": "미리보기를 지원하지 않는 파일입니다.",
         "cantPlay": "재생을 지원하지 않는 파일입니다.",
-        "notSupporedType": "지원하지 않는 파일형식입니다.",
+        "notSupporedType": "지원하지 않는 파일형식입니다. <br/> ({{supporedType}})",
         "oversize": "{{maxSize}}MB 이상 파일을 업로드 할 수 없습니다."
       }
     },

projects/ucap-webmessenger-ui-message/src/lib/components/write.component.ts

@@ -8,7 +8,8 @@ import {
   ChangeDetectorRef,
   OnDestroy,
   ElementRef,
-  Input
+  Input,
+  NgZone
 } from '@angular/core';
 
 import {
@@ -16,7 +17,8 @@ import {
   DialogService,
   AlertDialogResult,
   AlertDialogComponent,
-  AlertDialogData
+  AlertDialogData,
+  SnackBarService
 } from '@ucap-webmessenger/ui';
 
 import { NGXLogger } from 'ngx-logger';
@@ -118,6 +120,8 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
     private changeDetectorRef: ChangeDetectorRef,
     private translateService: TranslateService,
     private commonApiService: CommonApiService,
+    private snackBarService: SnackBarService,
+    private readonly ngZone: NgZone,
     private logger: NGXLogger
   ) {}
 
@@ -193,6 +197,7 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
       const fileList: FileList = this.fileInput.nativeElement.files;
 
       if (!this.validUploadFile(fileList)) {
+        self.fileInput.nativeElement.value = '';
         return;
       }
 
@@ -222,21 +227,18 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
         }
       }
       if (!valid) {
-        this.dialogService.open<
-          AlertDialogComponent,
-          AlertDialogData,
-          AlertDialogResult
-        >(AlertDialogComponent, {
-          width: '360px',
-          data: {
-            title: '',
-            message: this.translateService.instant(
-              'common.file.errors.oversize',
-              {
+        this.ngZone.run(() => {
+          this.snackBarService.open(
+            this.translateService.instant('common.file.errors.oversize', {
               maxSize: this.fileAllowSize
+            }),
+            '',
+            {
+              duration: 1000,
+              verticalPosition: 'bottom',
+              horizontalPosition: 'center'
             }
-            )
-          }
+          );
         });
 
         return valid;
@@ -247,23 +249,20 @@ export class WriteComponent implements OnInit, OnDestroy, AfterViewInit {
       FileUtil.getExtensions(fileList)
     );
     if (!checkExt.accept) {
-      this.dialogService.open<
-        AlertDialogComponent,
-        AlertDialogData,
-        AlertDialogResult
-      >(AlertDialogComponent, {
-        data: {
-          title: 'Alert',
-          html: `${this.translateService.instant(
-            'common.file.errors.notSupporedType'
-          )} ${
-            checkExt.reject.length > 0
-              ? '<br/>(' + checkExt.reject.join(',') + ')'
-              : ''
-          }`
+      this.ngZone.run(() => {
+        this.snackBarService.open(
+          this.translateService.instant('common.file.errors.notSupporedType', {
+            supporedType:
+              checkExt.reject.length > 0 ? checkExt.reject.join(',') : ''
+          }),
+          '',
+          {
+            duration: 1000,
+            verticalPosition: 'bottom',
+            horizontalPosition: 'center'
           }
+        );
       });
-
       return valid;
     }
 

projects/ucap-webmessenger-ui/src/lib/directives/file-upload-for.directive.ts

@@ -13,13 +13,13 @@ import { FileUploadQueueComponent } from '../components/file-upload-queue.compon
 import { FileUploadItem } from '@ucap-webmessenger/api';
 import { CommonApiService } from '@ucap-webmessenger/api-common';
 import { FileUtil } from '@ucap-webmessenger/core';
-import { DialogService } from '../services/dialog.service';
 import {
   AlertDialogComponent,
   AlertDialogResult,
   AlertDialogData
 } from '../dialogs/alert.dialog.component';
 import { TranslateService } from '@ngx-translate/core';
+import { SnackBarService } from '../services/snack-bar.service';
 
 @Directive({
   selector: 'input[ucapFileUploadFor], div[ucapFileUploadFor]'
@@ -47,7 +47,7 @@ export class FileUploadForDirective implements AfterViewInit {
     private elementRef: ElementRef,
     private logger: NGXLogger,
     private translateService: TranslateService,
-    private dialogService: DialogService
+    private snackBarService: SnackBarService
   ) {}
 
   ngAfterViewInit(): void {}
@@ -121,22 +121,18 @@ export class FileUploadForDirective implements AfterViewInit {
       this.elementRef.nativeElement.value = '';
       this.dragOver = false;
 
-      this.dialogService.open<
-        AlertDialogComponent,
-        AlertDialogData,
-        AlertDialogResult
-      >(AlertDialogComponent, {
-        data: {
-          title: 'Alert',
-          html: `${this.translateService.instant(
-            'common.file.errors.notSupporedType'
-          )} ${
-            checkExt.reject.length > 0
-              ? '<br/>(' + checkExt.reject.join(',') + ')'
-              : ''
-          }`
+      this.snackBarService.open(
+        this.translateService.instant('common.file.errors.notSupporedType', {
+          supporedType:
+            checkExt.reject.length > 0 ? checkExt.reject.join(',') : ''
+        }),
+        '',
+        {
+          duration: 1000,
+          verticalPosition: 'bottom',
+          horizontalPosition: 'center'
         }
-      });
+      );
 
       return;
     }