From da0ba9acbdf7198c680000786a0be830c7dbbad5 Mon Sep 17 00:00:00 2001
From: leejh <leejh@biztechpartners.co.kr>
Date: Mon, 14 Oct 2019 17:19:13 +0900
Subject: [PATCH] modify message-box :: date-splitter

---
 .../message-box/date-splitter.component.html  |  4 +++
 .../message-box/date-splitter.component.ts    | 18 ++++++++++---
 .../message-box/text.component.html           |  3 ---
 .../lib/components/messages.component.html    |  5 ++--
 .../src/lib/components/messages.component.ts  | 27 ++++++++++++++++++-
 .../src/lib/ucap-ui-chat.module.ts            |  6 +++--
 6 files changed, 52 insertions(+), 11 deletions(-)

diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
index e69de29b..3ed87fe9 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
@@ -0,0 +1,4 @@
+<p>
+  <!-- {{ message.sendDate | date: 'short' }} -->
+  {{ dateInfo }}
+</p>
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
index 65ba3cd5..f7356003 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
@@ -1,4 +1,6 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
+import { Info } from '@ucap-webmessenger/protocol-event';
+import { DatePipe } from '@angular/common';
 
 @Component({
   selector: 'ucap-chat-message-box-date-splitter',
@@ -6,7 +8,17 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./date-splitter.component.scss']
 })
 export class DateSplitterComponent implements OnInit {
-  constructor() {}
+  @Input()
+  message: Info;
 
-  ngOnInit() {}
+  dateInfo: string;
+
+  constructor(private datePipe: DatePipe) {}
+
+  ngOnInit() {
+    this.dateInfo = this.datePipe.transform(
+      this.message.sendDate,
+      'yyyy-MM-dd EEE'
+    );
+  }
 }
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/text.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/text.component.html
index 04a3f68e..a3063aa5 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/text.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/text.component.html
@@ -2,7 +2,4 @@
   <span>
     {{ message.sentMessage }}
   </span>
-  <span>
-    {{ message.sendDate | date: 'short' }}
-  </span>
 </p>
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
index e6c43a4a..55c75764 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
@@ -4,6 +4,9 @@
       me: message.senderSeq === loginRes.userSeq,
       contact: message.senderSeq !== loginRes.userSeq
     }">
+    <ucap-chat-message-box-date-splitter *ngIf="getDateSplitter(i)" [message]="message">
+    </ucap-chat-message-box-date-splitter>
+
     <div *ngIf="message.type !== EventType.Join && message.type !== EventType.Exit">
       <ul>
         <li *ngIf="getUserProfile(message.senderSeq) != ''">
@@ -30,8 +33,6 @@
       </ucap-chat-message-box-sticker>
       <ucap-chat-message-box-text *ngSwitchCase="EventType.Character" [message]="message"></ucap-chat-message-box-text>
       <div *ngSwitchDefault>
-        date splitter
-        <ucap-chat-message-box-date-splitter></ucap-chat-message-box-date-splitter>
         mass-translation
         <ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
         notice
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts
index fa0ea130..666f505f 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts
@@ -9,6 +9,7 @@ import { NGXLogger } from 'ngx-logger';
 import { SessionStorageService } from '@ucap-webmessenger/web-storage';
 import { KEY_VER_INFO, VerInfo2 } from '@app/types/ver-info.type';
 import { FileInfo } from '../models/file-info.json';
+import { DatePipe } from '@angular/common';
 
 @Component({
   selector: 'ucap-chat-messages',
@@ -35,7 +36,8 @@ export class MessagesComponent implements OnInit {
 
   constructor(
     private logger: NGXLogger,
-    private sessionStorageService: SessionStorageService
+    private sessionStorageService: SessionStorageService,
+    private datePipe: DatePipe
   ) {}
 
   ngOnInit() {
@@ -70,14 +72,37 @@ export class MessagesComponent implements OnInit {
     return '';
   }
 
+  /** Date Splitter check */
+  getDateSplitter(curIndex: number): boolean {
+    if (curIndex === 0) {
+      return true;
+    }
+    if (curIndex > 0) {
+      return (
+        this.datePipe.transform(
+          this.messages[curIndex].sendDate,
+          'yyyyMMdd'
+        ) !==
+        this.datePipe.transform(
+          this.messages[curIndex - 1].sendDate,
+          'yyyyMMdd'
+        )
+      );
+    }
+    return false;
+  }
+
+  /** [Event] MassTalk Detail View */
   onMassDetail(value: number) {
     this.massDetail.emit(value);
   }
 
+  /** [Event] Image Viewer */
   onImageViewer(value: FileInfo) {
     this.imageViewer.emit(value);
   }
 
+  /** [Event] Attach File Save & Save As */
   onSave(value: { fileInfo: FileInfo; type: string }) {
     this.save.emit(value);
   }
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts b/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts
index 577e4593..0443e3b4 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/ucap-ui-chat.module.ts
@@ -1,5 +1,5 @@
 import { NgModule, ModuleWithProviders } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { CommonModule, DatePipe } from '@angular/common';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { FlexLayoutModule } from '@angular/flex-layout';
@@ -49,6 +49,7 @@ const COMPONENTS = [
   MBVideoConferenceComponent
 ];
 const SERVICES = [];
+const PROVIDERS = [DatePipe];
 
 @NgModule({
   imports: [
@@ -62,7 +63,8 @@ const SERVICES = [];
     MatButtonModule
   ],
   exports: [...COMPONENTS],
-  declarations: [...COMPONENTS]
+  declarations: [...COMPONENTS],
+  providers: [...PROVIDERS]
 })
 export class UCapUiChatModule {
   public static forRoot(): ModuleWithProviders<UCapUiChatModule> {