기능구현 :: 대화방 > 대화 회수, 삭제

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

@@ -10,7 +10,10 @@ import {
   ucapAnimations,
   SnackBarService,
   ClipboardService,
-  DialogService
+  DialogService,
+  ConfirmDialogComponent,
+  ConfirmDialogData,
+  ConfirmDialogResult
 } from '@ucap-webmessenger/ui';
 import { Store, select } from '@ngrx/store';
 import { NGXLogger } from 'ngx-logger';
@@ -336,31 +339,50 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewChecked {
       case 'DELETE':
         {
           const result = await this.dialogService.open<
-            DeleteMessageDialogComponent,
+            ConfirmDialogComponent,
-            DeleteMessageDialogData,
+            ConfirmDialogData,
-            DeleteMessageDialogResult
+            ConfirmDialogResult
-          >(DeleteMessageDialogComponent, {
+          >(ConfirmDialogComponent, {
             width: '220px',
             data: {
-              title: 'Logout',
+              title: 'Delete',
-              message: 'Logout ?'
+              html: `선택한 메시지를 삭제하시겠습니까?<br/>삭제된 메시지는 내 대화방에서만 적용되며 상대방의 대화방에서는 삭제되지 않습니다.`
             }
           });
+
+          if (!!result && !!result.choice && result.choice) {
+            this.store.dispatch(
+              EventStore.del({
+                roomSeq: this.roomInfo.roomSeq,
+                eventSeq: message.seq
+              })
+            );
+          }
         }
         break;
       case 'RECALL':
         {
           const result = await this.dialogService.open<
-            RecallMessageDialogComponent,
+            ConfirmDialogComponent,
-            RecallMessageDialogData,
+            ConfirmDialogData,
-            RecallMessageDialogResult
+            ConfirmDialogResult
-          >(RecallMessageDialogComponent, {
+          >(ConfirmDialogComponent, {
             width: '220px',
             data: {
-              title: 'Logout',
+              title: 'ReCall',
-              message: 'Logout ?'
+              html: `해당 대화를 회수하시겠습니까?<br/>상대방 대화창에서도 회수됩니다.`
             }
           });
+
+          if (!!result && !!result.choice && result.choice) {
+            this.store.dispatch(
+              EventStore.cancel({
+                roomSeq: this.roomInfo.roomSeq,
+                eventSeq: message.seq,
+                deviceType: this.environmentsInfo.deviceType
+              })
+            );
+          }
         }
         break;
       default:

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

@@ -9,7 +9,11 @@ import {
   ReadNotification,
   CancelNotification,
   DelNotification,
-  ReadRequest
+  ReadRequest,
+  DelRequest,
+  DelResponse,
+  CancelRequest,
+  CancelResponse
 } from '@ucap-webmessenger/protocol-event';
 
 export const info = createAction(
@@ -38,13 +42,6 @@ export const newInfo = createAction(
   }>()
 );
 
-export const recallInfoList = createAction(
-  '[Messenger::Event] recall InfoList',
-  props<{
-    eventSeq: number;
-  }>()
-);
-
 export const appendInfoList = createAction(
   '[Messenger::Event] Append InfoList',
   props<{
@@ -70,6 +67,11 @@ export const sendFailure = createAction(
   props<{ error: any }>()
 );
 
+export const sendNotification = createAction(
+  '[Messenger::Event] Send Notification',
+  props<{ noti: SendNotification }>()
+);
+
 export const read = createAction(
   '[Messenger::Event] read',
   props<ReadRequest>()
@@ -88,22 +90,49 @@ export const readFailure = createAction(
   props<{ error: any }>()
 );
 
-export const sendNotification = createAction(
-  '[Messenger::Event] Send Notification',
-  props<{ noti: SendNotification }>()
-);
-
 export const readNotification = createAction(
   '[Messenger::Event] Read Notification',
   props<{ noti: ReadNotification }>()
 );
 
+/** 대화 회수 */
+export const cancel = createAction(
+  '[Messenger::Event] Cancel',
+  props<CancelRequest>()
+);
+export const cancelFailure = createAction(
+  '[Messenger::Event] Cancel Failure',
+  props<{ error: any }>()
+);
 export const cancelNotification = createAction(
-  '[Messenger::Event] Cancel Notification',
+  '[Messenger::Event] Cancel Notification || Response',
-  props<{ noti: CancelNotification }>()
+  props<{ noti: CancelNotification | CancelResponse }>()
+);
+/** 대화 회수시 열린 대화방의 대화 내용 갱신 */
+export const recallInfoList = createAction(
+  '[Messenger::Event] Cancel InfoList',
+  props<{
+    eventSeq: number;
+  }>()
 );
 
-export const delNotification = createAction(
+/** 대화 삭제 */
-  '[Messenger::Event] Delete Notification',
+export const del = createAction(
-  props<{ noti: DelNotification }>()
+  '[Messenger::Event] Delete',
+  props<DelRequest>()
+);
+export const delFailure = createAction(
+  '[Messenger::Event] Delete Failure',
+  props<{ error: any }>()
+);
+export const delNotification = createAction(
+  '[Messenger::Event] Delete Notification || Response',
+  props<{ noti: DelNotification | DelResponse }>()
+);
+/** 대화 삭제시 열린 대화방의 대화 내용 갱신 */
+export const delInfoList = createAction(
+  '[Messenger::Event] Delete InfoList',
+  props<{
+    eventSeq: number;
+  }>()
 );

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

@@ -23,7 +23,9 @@ import {
   SSVC_TYPE_EVENT_INFO_DATA,
   SSVC_TYPE_EVENT_INFO_RES,
   SendResponse,
-  ReadResponse
+  ReadResponse,
+  DelResponse,
+  CancelResponse
 } from '@ucap-webmessenger/protocol-event';
 
 import * as ChatStore from '@app/store/messenger/chat';
@@ -44,11 +46,15 @@ import {
   delNotification,
   recallInfoList,
   read,
-  readFailure
+  readFailure,
+  del,
+  delFailure,
+  delInfoList,
+  cancel,
+  cancelFailure
 } from './actions';
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
 import { RoomInfo } from '@ucap-webmessenger/protocol-room';
-import { refreshRoom } from '../sync';
 import { LoginInfo, KEY_LOGIN_INFO } from '@app/types';
 import { Dictionary } from '@ngrx/entity';
 
@@ -124,12 +130,7 @@ export class Effects {
         switchMap(req => {
           return this.eventProtocolService.read(req).pipe(
             map((res: ReadResponse) => {
-              this.store.dispatch(
+              readNotification({ noti: res });
-                SyncStore.updateUnreadCount({
-                  roomSeq: res.roomSeq,
-                  noReadCnt: 0
-                })
-              );
             }),
             catchError(error => of(readFailure({ error })))
           );
@@ -139,6 +140,24 @@ export class Effects {
     { dispatch: false }
   );
 
+  readNotification$ = createEffect(
+    () => {
+      return this.actions$.pipe(
+        ofType(readNotification),
+        map(action => action.noti),
+        tap(noti => {
+          this.store.dispatch(
+            SyncStore.updateUnreadCount({
+              roomSeq: noti.roomSeq,
+              noReadCnt: 0
+            })
+          );
+        })
+      );
+    },
+    { dispatch: false }
+  );
+
   send$ = createEffect(() =>
     this.actions$.pipe(
       ofType(send),
@@ -246,15 +265,18 @@ export class Effects {
     { dispatch: false }
   );
 
-  readNotification$ = createEffect(
+  cancel$ = createEffect(() =>
-    () => {
+    this.actions$.pipe(
-      return this.actions$.pipe(
+      ofType(cancel),
-        ofType(readNotification),
+      exhaustMap(req =>
-        map(action => action.noti),
+        this.eventProtocolService.cancel(req).pipe(
-        tap(noti => {})
+          map((res: CancelResponse) => {
-      );
+            return cancelNotification({ noti: res });
-    },
+          }),
-    { dispatch: false }
+          catchError(error => of(cancelFailure({ error })))
+        )
+      )
+    )
   );
 
   cancelNotification$ = createEffect(
@@ -269,7 +291,6 @@ export class Effects {
         tap(([action, roomInfo]) => {
           // 현재 방이 오픈되어 있으면 방내용 갱신
           if (!!roomInfo && roomInfo.roomSeq === action.noti.roomSeq) {
-            this.logger.debug('cancelNotification$', action, roomInfo);
             this.store.dispatch(
               recallInfoList({ eventSeq: action.noti.eventSeq })
             );
@@ -291,12 +312,48 @@ export class Effects {
     { dispatch: false }
   );
 
+  del$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(del),
+      exhaustMap(req =>
+        this.eventProtocolService.del(req).pipe(
+          map((res: DelResponse) => {
+            return delNotification({ noti: res });
+          }),
+          catchError(error => of(delFailure({ error })))
+        )
+      )
+    )
+  );
+
   delNotification$ = createEffect(
     () => {
       return this.actions$.pipe(
         ofType(delNotification),
         map(action => action.noti),
-        tap(noti => {})
+        withLatestFrom(
+          this.store.pipe(
+            select((state: any) => state.messenger.room.roomInfo as RoomInfo)
+          )
+        ),
+        tap(([noti, roomInfo]) => {
+          // 현재 방이 오픈되어 있으면 방내용 갱신
+          if (!!roomInfo && roomInfo.roomSeq === noti.roomSeq) {
+            this.store.dispatch(delInfoList({ eventSeq: noti.eventSeq }));
+          }
+
+          // 대화 > 리스트의 항목 갱신
+          const loginInfo = this.sessionStorageService.get<LoginInfo>(
+            KEY_LOGIN_INFO
+          );
+          this.store.dispatch(
+            SyncStore.refreshRoom({
+              roomSeq: noti.roomSeq,
+              isDetail: true,
+              localeCode: loginInfo.localeCode
+            })
+          );
+        })
       );
     },
     { dispatch: false }

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

@@ -5,7 +5,8 @@ import {
   appendInfoList,
   info,
   infoFailure,
-  recallInfoList
+  recallInfoList,
+  delInfoList
 } from './actions';
 import * as AuthenticationStore from '@app/store/account/authentication';
 import { Info, EventType } from '@ucap-webmessenger/protocol-event';
@@ -73,6 +74,15 @@ export const reducer = createReducer(
     };
   }),
 
+  on(delInfoList, (state, action) => {
+    const eventSeq = action.eventSeq;
+
+    return {
+      ...state,
+      infoList: adapterInfoList.removeOne(eventSeq, { ...state.infoList })
+    };
+  }),
+
   on(AuthenticationStore.logout, (state, action) => {
     return {
       ...initialState

projects/ucap-webmessenger-protocol-event/src/lib/services/event-protocol.service.ts

@@ -53,12 +53,6 @@ import {
   decodeReadNotification,
   ReadNotification
 } from '../protocols/read';
-import {
-  DelRequest,
-  DelResponse,
-  encodeDel,
-  decodeDel
-} from '@ucap-webmessenger/protocol-buddy';
 import {
   CancelRequest,
   CancelResponse,
@@ -67,7 +61,14 @@ import {
   CancelNotification,
   decodeCancelNotification
 } from '../protocols/cancel';
-import { decodeDelNotification, DelNotification } from '../protocols/del';
+import {
+  decodeDelNotification,
+  DelNotification,
+  DelRequest,
+  DelResponse,
+  encodeDel,
+  decodeDel
+} from '../protocols/del';
 
 type Notifications =
   | SendNotification