refactoring

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/intro.component.html

@@ -1,5 +1,10 @@
 <div fxFlex fxLayout="column" fxLayoutAlign="center center">
-  <div class="empty-logo" fxLayoutAlign="center center" fxLayout="column">
+  <div
+    class="empty-logo"
+    fxLayoutAlign="center center"
+    fxLayout="column"
+    (click)="onClickStatusBar()"
+  >
     <div
       class="big-circle app-logo border-accent-color"
       fxLayoutAlign="center center"

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

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { ucapAnimations } from '@ucap-webmessenger/ui';
+import { ucapAnimations, StatusBarService } from '@ucap-webmessenger/ui';
 import { environment } from '../../../../environments/environment';
 
 @Component({
@@ -9,7 +9,7 @@ import { environment } from '../../../../environments/environment';
   animations: ucapAnimations
 })
 export class IntroComponent implements OnInit {
-  constructor() {}
+  constructor(private statusBarService: StatusBarService) {}
 
   ngOnInit() {}
 
@@ -18,4 +18,14 @@ export class IntroComponent implements OnInit {
       ? environment.title
       : 'UCapMessenger';
   }
+
+  private toggle = false;
+  onClickStatusBar() {
+    if (!this.toggle) {
+      this.statusBarService.open();
+    } else {
+      this.statusBarService.dismiss();
+    }
+    this.toggle = !this.toggle;
+  }
 }

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

@@ -9,7 +9,11 @@ import {
   AfterViewChecked,
   ChangeDetectorRef
 } from '@angular/core';
-import { ucapAnimations, DialogService } from '@ucap-webmessenger/ui';
+import {
+  ucapAnimations,
+  DialogService,
+  StringFormatterPhonePipe
+} from '@ucap-webmessenger/ui';
 import {
   Observable,
   Subscription,
@@ -72,7 +76,7 @@ import {
   SelectedUserListDialogData
 } from '../../dialogs/organization/selected-user-list.dialog.component';
 import { TranslateService } from '@ngx-translate/core';
-import { StringFormatterPhonePipe } from 'projects/ucap-webmessenger-ui/src/lib/pipes/string.pipe';
+
 import { VirtualScrollerComponent } from 'ngx-virtual-scroller';
 import { OrganizationService } from '@ucap-webmessenger/ui-organization';
 

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

@@ -24,7 +24,9 @@ import {
   FileUploadQueueComponent,
   StringUtil,
   AlertSnackbarComponent,
-  AlertSnackbarData
+  AlertSnackbarData,
+  TranslateService as UiTranslateService,
+  TranslatePipe as UiTranslatePipe
 } from '@ucap-webmessenger/ui';
 import { Store, select } from '@ngrx/store';
 import { NGXLogger } from 'ngx-logger';
@@ -121,8 +123,6 @@ import {
 } from '../dialogs/chat/mass-detail.component';
 import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native';
 import { TranslateService } from '@ngx-translate/core';
-import { TranslatePipe } from 'projects/ucap-webmessenger-ui/src/lib/pipes/translate.pipe';
-import { TranslateService as UiTranslateService } from '@ucap-webmessenger/ui';
 
 import {
   ClipboardDialogComponent,
@@ -502,7 +502,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
   }
 
   getRoomNameByRoomUser(roomUserInfos: (UserInfo | UserInfoShort)[]) {
-    let roomName = new TranslatePipe(
+    let roomName = new UiTranslatePipe(
       this.uiTranslateService,
       this.changeDetectorRef
     ).transform(roomUserInfos, 'name', ',');

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts

@@ -25,13 +25,15 @@ import { environment } from '../../../../../environments/environment';
 import { StatusBulkInfo } from '@ucap-webmessenger/protocol-status';
 import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { DaesangProtocolService } from '@ucap-webmessenger/daesang';
-import { DialogService } from '@ucap-webmessenger/ui';
+import {
+  DialogService,
+  IntegratedSearchComponent
+} from '@ucap-webmessenger/ui';
 import {
   ProfileDialogComponent,
   ProfileDialogData,
   ProfileDialogResult
 } from '../profile/profile.dialog.component';
-import { IntegratedSearchComponent } from 'projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component';
 
 export interface IntegratedSearchDialogData {
   keyword: string;

projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html

@@ -15,12 +15,12 @@
       ></app-layout-messenger-left-side>
     </mat-drawer>
     <div class="chat-messages bg-accent-brightest">
-      <!-- <div class="messenger-statusbar-container">
+      <div #statusbarContainer class="messenger-statusbar-container">
         <div class="messenger-statusbar-message">
           업데이트가 존재합니다.
         </div>
         <div class="messenger-statusbar-actions"></div>
-      </div> -->
+      </div>
       <app-layout-messenger-intro
         *ngIf="!(this.selectedChat$ | async)"
       ></app-layout-messenger-intro>

projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.ts

@@ -27,7 +27,8 @@ import {
   AlertDialogComponent,
   AlertDialogResult,
   AlertDialogData,
-  ConfirmDialogData
+  ConfirmDialogData,
+  StatusBarService
 } from '@ucap-webmessenger/ui';
 import {
   ProfileDialogComponent,
@@ -64,6 +65,9 @@ export class MainPageComponent implements OnInit, OnDestroy {
   @ViewChild('leftSideContainer', { static: false })
   leftSideContainer: LeftSideComponent;
 
+  @ViewChild('statusbarContainer', { static: true })
+  statusbarContainer: ElementRef<HTMLElement>;
+
   selectedChat$: Observable<string | null>;
   selectedRightDrawer$: Observable<string | null>;
   idleStateChangedSubscription: Subscription;
@@ -95,6 +99,7 @@ export class MainPageComponent implements OnInit, OnDestroy {
     private sessionStorageService: SessionStorageService,
     private translateService: TranslateService,
     private dialogService: DialogService,
+    private statusBarService: StatusBarService,
     private logger: NGXLogger
   ) {
     this.environmentsInfo = this.sessionStorageService.get<EnvironmentsInfo>(
@@ -103,6 +108,8 @@ export class MainPageComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
+    this.statusBarService.container = this.statusbarContainer;
+
     this.selectedChat$ = this.store.pipe(
       select(AppStore.MessengerSelector.ChatSelector.selectedRoom),
       tap(selectedRoom => {

projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.ts

@@ -17,9 +17,10 @@ import {
 import { NGXLogger } from 'ngx-logger';
 import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
-import { TranslatePipe } from 'projects/ucap-webmessenger-ui/src/lib/pipes/translate.pipe';
+
 import {
-  TranslateService as UcapUiTranslateService,
+  TranslateService as UiTranslateService,
+  TranslatePipe as UiTranslatePipe,
   StringUtil
 } from '@ucap-webmessenger/ui';
 import { TranslateService } from '@ngx-translate/core';
@@ -62,7 +63,7 @@ export class ListItemComponent implements OnInit {
 
   constructor(
     private logger: NGXLogger,
-    private ucapUiTranslateService: UcapUiTranslateService,
+    private uiTranslateService: UiTranslateService,
     private translateService: TranslateService,
     private changeDetectorRef: ChangeDetectorRef
   ) {}
@@ -128,8 +129,8 @@ export class ListItemComponent implements OnInit {
   }
 
   getRoomNameByRoomUser(roomUserInfos: (RoomUserInfo | UserInfoShort)[]) {
-    let roomName = new TranslatePipe(
+    let roomName = new UiTranslatePipe(
-      this.ucapUiTranslateService,
+      this.uiTranslateService,
       this.changeDetectorRef
     ).transform(roomUserInfos, 'name', ',');
 

projects/ucap-webmessenger-ui/src/lib/services/status-bar.service.ts

@@ -1,10 +1,26 @@
-import { Injectable } from '@angular/core';
+import { Injectable, ViewContainerRef, ElementRef } from '@angular/core';
 
 @Injectable({
   providedIn: 'root'
 })
 export class StatusBarService {
+  get container() {
+    return this._container;
+  }
+  set container(container: ElementRef<HTMLElement>) {
+    this._container = container;
+    this._container.nativeElement.style.display = 'none';
+  }
+  // tslint:disable-next-line: variable-name
+  private _container: ElementRef<HTMLElement>;
+
   public constructor() {}
 
-  open() {}
+  open(message: string) {
+    this._container.nativeElement.style.display = '';
+  }
+
+  dismiss() {
+    this._container.nativeElement.style.display = 'none';
+  }
 }

projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts

@@ -56,6 +56,7 @@ import { SplashScreenService } from './services/splash-screen.service';
 import { TranslateService } from './services/translate.service';
 import { DateService } from './services/date.service';
 import { PaginatorIntlService } from './services/paginator-intl.service';
+import { StatusBarService } from './services/status-bar.service';
 
 import { ClickOutsideDirective } from './directives/click-outside.directive';
 import { FileUploadForDirective } from './directives/file-upload-for.directive';
@@ -137,7 +138,8 @@ const SERVICES = [
   SplashScreenService,
   TranslateService,
   DateService,
-  PaginatorIntlService
+  PaginatorIntlService,
+  StatusBarService
 ];
 
 @NgModule({

projects/ucap-webmessenger-ui/src/public-api.ts

@@ -19,6 +19,7 @@ export * from './lib/components/step-input.component';
 export * from './lib/components/split-button.component';
 export * from './lib/components/sticker-selector.component';
 export * from './lib/components/inline-edit-input.component';
+export * from './lib/components/integrated-search.component';
 
 export * from './lib/data-source/virtual-scroll-tree-flat.data-source';
 
@@ -37,6 +38,10 @@ export * from './lib/services/splash-screen.service';
 export * from './lib/services/translate.service';
 export * from './lib/services/date.service';
 export * from './lib/services/paginator-intl.service';
+export * from './lib/services/status-bar.service';
+
+export * from './lib/pipes/string.pipe';
+export * from './lib/pipes/translate.pipe';
 
 export * from './lib/snackbars/alert.snackbar.component';