Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.html

@@ -91,6 +91,7 @@
     <ucap-room-list-item
       *ngFor="let room of searchRoomList"
       [loginRes]="loginRes"
+      [isSelected]="(selectedRoomInfo$ | async)?.roomSeq === room.roomSeq"
       [roomInfo]="room"
       [roomUserInfo]="getRoomUserList(room)"
       [sessionVerinfo]="sessionVerinfo"

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

@@ -209,27 +209,27 @@ export class OrganizationComponent
             .pipe(
               take(1),
               select(AppStore.AccountSelector.AuthenticationSelector.loginRes),
-              map(loginRes => {
+              tap(loginRes => {
-                this.store.dispatch(
+                if (!!loginRes) {
-                  QueryStore.myDeptUser({
+                  this.store.dispatch(
-                    divCd: 'ORG',
+                    QueryStore.myDeptUser({
-                    companyCode: this.loginInfo.companyCode,
+                      divCd: 'ORG',
-                    seq: loginRes.departmentCode,
+                      companyCode: this.loginInfo.companyCode,
-                    search: '',
+                      seq: loginRes.departmentCode,
-                    searchRange: DeptSearchType.All,
+                      search: '',
-                    senderCompanyCode: this.loginInfo.companyCode,
+                      searchRange: DeptSearchType.All,
-                    senderEmployeeType: loginRes.userInfo.employeeType
+                      senderCompanyCode: this.loginInfo.companyCode,
-                  })
+                      senderEmployeeType: loginRes.userInfo.employeeType
-                );
+                    })
-                return loginRes;
+                  );
-              }),
+
-              map(loginRes => {
+                  this.selectedDepartmentName = {
+                    name: loginRes.userInfo.deptName,
+                    nameEn: loginRes.userInfo.deptNameEn,
+                    nameCn: loginRes.userInfo.deptNameCn
+                  };
+                }
                 this.loginRes = loginRes;
-                this.selectedDepartmentName = {
-                  name: loginRes.userInfo.deptName,
-                  nameEn: loginRes.userInfo.deptNameEn,
-                  nameCn: loginRes.userInfo.deptNameCn
-                };
               })
             )
             .subscribe();

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

@@ -64,6 +64,7 @@ import {
 } from '@ucap-webmessenger/ui';
 import { TranslateService, TranslateParser } from '@ngx-translate/core';
 import { environment } from '../../../../../environments/environment';
+import { StringUtil } from '@ucap-webmessenger/core';
 
 export interface CreateChatDialogData {
   type?: string;

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

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

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

@@ -8,6 +8,7 @@ import {
 } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 import { GroupDetailData } from '@ucap-webmessenger/protocol-sync';
+import { StringUtil } from '@ucap-webmessenger/core';
 
 export interface EditGroupDialogData {
   title: string;
@@ -39,20 +40,11 @@ export class EditGroupDialogComponent implements OnInit {
     this.inputForm = this.formBuilder.group({
       groupName: [
         this.data.group.name,
-        [Validators.required, this.checkSpecialCharacter()]
+        [Validators.required, StringUtil.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/app/layouts/messenger/dialogs/group/select-group.dialog.component.html

@@ -17,35 +17,38 @@
         <span class="mat-fab__label">{{ 'group.addNew' | translate }}</span>
       </button>
       <div *ngIf="isShowAddGroupField" class="input-groupname-box">
-        <mat-form-field
+        <form name="inputForm" [formGroup]="inputForm" novalidate>
-          hintLabel="{{
+          <mat-form-field
-            'common.useOnlyForSpecialCharacter'
+            hintLabel="{{
-              | translate: { specialCharacter: '-,_' }
+              'common.useOnlyForSpecialCharacter'
-          }}"
+                | translate: { specialCharacter: '-,_' }
-        >
+            }}"
-          <input
-            matInput
-            #inputGroupName
-            type="text"
-            maxlength="20"
-            placeholder="{{ 'group.name' | translate }}"
-            value=""
-          />
-
-          <button
-            mat-button
-            matSuffix
-            mat-icon-button
-            aria-label="Clear"
-            (click)="inputGroupName.value = ''"
           >
-            <mat-icon>close</mat-icon>
+            <input
-          </button>
+              matInput
+              #inputGroupName
+              type="text"
+              maxlength="20"
+              placeholder="{{ 'group.name' | translate }}"
+              value=""
+              formControlName="groupName"
+            />
 
-          <mat-hint align="end"
+            <button
-            >{{ inputGroupName.value?.length || 0 }}/20</mat-hint
+              mat-button
-          >
+              matSuffix
-        </mat-form-field>
+              mat-icon-button
+              aria-label="Clear"
+              (click)="inputGroupName.value = ''"
+            >
+              <mat-icon>close</mat-icon>
+            </button>
+
+            <mat-hint align="end"
+              >{{ inputGroupName.value?.length || 0 }}/20</mat-hint
+            >
+          </mat-form-field>
+        </form>
 
         <div class="btn-box">
           <button mat-stroked-button (click)="onClickAddGroupCancel()">
@@ -56,6 +59,7 @@
             color="accent"
             (click)="onClickAddGroup(inputGroupName.value)"
             class="mat-accent"
+            [disabled]="inputForm.invalid"
           >
             {{ 'group.addNew' | translate }}
           </button>

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

@@ -21,6 +21,8 @@ import {
 import { GroupDetailData, UserInfo } from '@ucap-webmessenger/protocol-sync';
 import { environment } from '../../../../../environments/environment';
 import { TranslateService } from '@ngx-translate/core';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { StringUtil } from '@ucap-webmessenger/core';
 
 export interface SelectGroupDialogData {
   title: string;
@@ -38,6 +40,9 @@ export interface SelectGroupDialogResult {
   styleUrls: ['./select-group.dialog.component.scss']
 })
 export class SelectGroupDialogComponent implements OnInit {
+  groupName: string;
+  inputForm: FormGroup;
+
   constructor(
     public dialogRef: MatDialogRef<
       SelectGroupDialogData,
@@ -46,7 +51,8 @@ export class SelectGroupDialogComponent implements OnInit {
     @Inject(MAT_DIALOG_DATA) public data: SelectGroupDialogData,
     private store: Store<any>,
     private dialogService: DialogService,
-    private translateService: TranslateService
+    private translateService: TranslateService,
+    private formBuilder: FormBuilder
   ) {}
 
   @ViewChild('groups', { static: true }) groups: MatSelectionList;
@@ -57,6 +63,10 @@ export class SelectGroupDialogComponent implements OnInit {
   isShowAddGroupField = false;
 
   ngOnInit(): void {
+    this.inputForm = this.formBuilder.group({
+      groupName: ['', [Validators.required, StringUtil.checkSpecialCharacter()]]
+    });
+
     this.groups.selectionChange.subscribe((s: MatSelectionListChange) => {
       this.groups.deselectAll();
       s.option.selected = true;

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html

@@ -257,7 +257,12 @@
     <button mat-stroked-button (click)="onClickConfirm()" class="mat-primary">
       {{ 'common.messages.confirm' | translate }}
     </button>
-    <button mat-flat-button (click)="onClickReply()" class="mat-primary">
+    <button
+      mat-flat-button
+      *ngIf="messageDetail.msgInfo.type === MessageType.Receive"
+      (click)="onClickReply()"
+      class="mat-primary"
+    >
       {{ 'message.sendReply' | translate }}
     </button>
   </mat-card-actions>

projects/ucap-webmessenger-app/src/app/store/messenger/chat/actions.ts

@@ -21,6 +21,8 @@ export const clearSelectedRoom = createAction(
   '[Messenger::Chat] clearSelectedRoom'
 );
 
+export const clearEvent = createAction('[Messenger::Room] Clear Event');
+
 export const newEventMessage = createAction(
   '[Messenger::Chat] newEventMessage',
   props<{

projects/ucap-webmessenger-app/src/app/store/messenger/event/reducers.ts

@@ -144,7 +144,7 @@ export const reducer = createReducer(
     };
   }),
 
-  on(ChatStore.selectedRoom, (state, action) => {
+  on(ChatStore.clearEvent, (state, action) => {
     return {
       ...initialState
     };

projects/ucap-webmessenger-app/src/app/store/messenger/room/effects.ts

@@ -76,20 +76,35 @@ import { LoginInfo, KEY_LOGIN_INFO } from '@app/types';
 
 @Injectable()
 export class Effects {
-  selectedRoomForInfo$ = createEffect(() =>
+  selectedRoomForInfo$ = createEffect(
-    this.actions$.pipe(
+    () => {
-      ofType(ChatStore.selectedRoom),
+      return this.actions$.pipe(
-      map(action => {
+        ofType(ChatStore.selectedRoom),
-        const loginInfo = this.sessionStorageService.get<LoginInfo>(
+        withLatestFrom(
-          KEY_LOGIN_INFO
+          this.store.pipe(
-        );
+            select((state: any) => state.messenger.room.roomInfo as RoomInfo)
-        return info({
+          )
-          roomSeq: action.roomSeq,
+        ),
-          isDetail: true,
+        map(([action, roomInfo]) => {
-          localeCode: loginInfo.localeCode
+          if (!!roomInfo && roomInfo.roomSeq === action.roomSeq) {
-        });
+          } else {
-      })
+            this.store.dispatch(ChatStore.clearEvent());
-    )
+
+            const loginInfo = this.sessionStorageService.get<LoginInfo>(
+              KEY_LOGIN_INFO
+            );
+            this.store.dispatch(
+              info({
+                roomSeq: action.roomSeq,
+                isDetail: true,
+                localeCode: loginInfo.localeCode
+              })
+            );
+          }
+        })
+      );
+    },
+    { dispatch: false }
   );
 
   info$ = createEffect(

projects/ucap-webmessenger-core/src/lib/utils/string.util.ts

@@ -1,3 +1,5 @@
+import { ValidatorFn, AbstractControl } from '@angular/forms';
+
 export enum CharactorType {
   Number = 'Number',
   Charactor = 'Charactor',
@@ -128,7 +130,7 @@ export class StringUtil {
   }
 
   /**
-   * isIncrements
+   * isDecrements
    */
   public static isDecrements(target: string, repeatTime: number) {
     for (let i = 0; i < target.length - (repeatTime - 1); i++) {
@@ -181,4 +183,13 @@ export class StringUtil {
   public static isAlphaNumeric(char: number): boolean {
     return StringUtil.isAlphabet(char) || StringUtil.isNumeric(char);
   }
+
+  public static checkSpecialCharacter(): ValidatorFn {
+    return (control: AbstractControl): { [key: string]: any } | null => {
+      const forbidden = /[\{\}\[\]\/?.;:|\)*~`!^+<>@\#$%&\\\=\(\'\"]/g.test(
+        control.value
+      );
+      return forbidden ? { groupName: { value: control.value } } : null;
+    };
+  }
 }