# 이슈처리

42 스크롤 좌측으로 보여짐 :: 스크롤 위치 수정.
46 그룹 특수문자 입력 가능함 :: form validator 추가로 유효성 검사 추가.

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.scss

@@ -83,7 +83,7 @@
     display: flex;
     background-color: #f9f9f9;
     dt {
-      font-weight:600;
+      font-weight: 600;
     }
     dd {
       margin-left: auto;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.scss

@@ -4,6 +4,10 @@
 
 //조직도 레이아웃 변경
 ::ng-deep .dialog-org {
+  .ps__rail-y {
+    left: auto !important;
+  }
+
   .oraganization-tab {
     width: 100%;
     height: 380px;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.ts

@@ -4,10 +4,15 @@ import {
   OnInit,
   OnDestroy,
   Inject,
-  EventEmitter,
   ChangeDetectorRef
 } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import {
+  FormGroup,
+  FormBuilder,
+  Validators,
+  ValidatorFn,
+  AbstractControl
+} from '@angular/forms';
 import {
   MatDialogRef,
   MAT_DIALOG_DATA,
@@ -15,11 +20,10 @@ import {
 } from '@angular/material';
 import { NGXLogger } from 'ngx-logger';
 import { Observable, combineLatest, Subscription, of } from 'rxjs';
-import { map, tap, catchError, take } from 'rxjs/operators';
+import { map, tap, catchError } from 'rxjs/operators';
 
 import { Store, select } from '@ngrx/store';
 import * as AppStore from '@app/store';
-import * as QueryStore from '@app/store/messenger/query';
 import * as StatusStore from '@app/store/messenger/status';
 
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
@@ -240,7 +244,7 @@ export class CreateChatDialogComponent implements OnInit, OnDestroy {
       .subscribe();
 
     this.inputForm = this.formBuilder.group({
-      groupName: ['', [Validators.required]]
+      groupName: ['', [Validators.required, this.checkSpecialCharacter()]]
     });
 
     if (this.data.type === UserSelectDialogType.EditChatMember) {
@@ -250,6 +254,15 @@ export class CreateChatDialogComponent implements OnInit, OnDestroy {
     this.currentTabIndex = 0;
   }
 
+  checkSpecialCharacter(): ValidatorFn {
+    return (control: AbstractControl): { [key: string]: any } | null => {
+      const forbidden = /[\{\}\[\]\/?.;:|\)*~`!^+<>@\#$%&\\\=\(\'\"]/g.test(
+        control.value
+      );
+      return forbidden ? { groupName: { value: control.value } } : null;
+    };
+  }
+
   ngOnDestroy(): void {
     if (!!this.roomSubscription) {
       this.roomSubscription.unsubscribe();

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/group/edit-group.dialog.component.html

@@ -29,7 +29,12 @@
     >
       {{ 'common.messages.no' | translate }}
     </button>
-    <button mat-flat-button (click)="onClickChoice(true)" class="mat-primary">
+    <button
+      mat-flat-button
+      (click)="onClickChoice(true)"
+      [disabled]="this.inputForm.invalid"
+      class="mat-primary"
+    >
       {{ 'common.messages.yes' | translate }}
     </button>
   </mat-card-actions>

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/group/edit-group.dialog.component.ts

@@ -1,5 +1,11 @@
 import { Component, OnInit, Inject } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import {
+  FormGroup,
+  FormBuilder,
+  Validators,
+  ValidatorFn,
+  AbstractControl
+} from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 import { GroupDetailData } from '@ucap-webmessenger/protocol-sync';
 
@@ -31,10 +37,22 @@ export class EditGroupDialogComponent implements OnInit {
 
   ngOnInit(): void {
     this.inputForm = this.formBuilder.group({
-      groupName: [this.data.group.name, [Validators.required]]
+      groupName: [
+        this.data.group.name,
+        [Validators.required, this.checkSpecialCharacter()]
+      ]
     });
   }
 
+  checkSpecialCharacter(): ValidatorFn {
+    return (control: AbstractControl): { [key: string]: any } | null => {
+      const forbidden = /[\{\}\[\]\/?.;:|\)*~`!^+<>@\#$%&\\\=\(\'\"]/g.test(
+        control.value
+      );
+      return forbidden ? { groupName: { value: control.value } } : null;
+    };
+  }
+
   onClickChoice(choice: boolean): void {
     this.dialogRef.close({
       choice,

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

@@ -191,7 +191,7 @@
     "removeEvent": "대화 삭제",
     "recallEvent": "대화 회수",
     "modifyRoomMember": "대화방 멤버 편집",
-    "ejectFromRoom": "강퇴",
+    "ejectFromRoom": "강제 퇴장",
     "confirmEjectFromRoom": "{{targetMember}} 님을 대화방에서 퇴장 시키겠습니까?",
     "badgeDescriptionForUnread": "확인하지 않은 메시지가 있습니다.",
     "getRoomNameInProgress": "대화방명을 가져오고 있습니다.",