next-ucap-messenger/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html

<div class="container">
  <!--<div>
    LG ucap
    <button mat-icon-button aria-label="New Chat" (click)="onClickNewChat()">
      <mat-icon>chat</mat-icon>
    </button>
  </div>-->
  <!-- <div class="logo">로고</div> -->
  <mat-tab-group mat-stretch-tabs animationDuration="0ms" class="global-menu">
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>group</mat-icon>
      </ng-template>
      <app-layout-chat-left-sidenav-group></app-layout-chat-left-sidenav-group>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon
          [matBadgeHidden]="(badgeChatUnReadCount$ | async) <= 0"
          [matBadge]="badgeChatUnReadCount$ | async"
          matBadgeDescription="확인하지 않은 메시지가 있습니다."
          matBadgeColor="accent"
          matBadgePosition="above after"
          >chat</mat-icon
        >
      </ng-template>
      <app-layout-chat-left-sidenav-chat></app-layout-chat-left-sidenav-chat>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>device_hub</mat-icon>
      </ng-template>
      <app-layout-chat-left-sidenav-organization
        [selectedUserList]="selectedUserList"
        (checkUser)="onCheckUser($event)"
      ></app-layout-chat-left-sidenav-organization>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>phone</mat-icon>
      </ng-template>
      <app-layout-chat-left-sidenav-call></app-layout-chat-left-sidenav-call>
    </mat-tab>
  </mat-tab-group>
</div>