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

<div class="container">
  <mat-tab-group mat-stretch-tabs>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>group</mat-icon>
      </ng-template>
      <ng-template matTabContent>
        <app-layout-chat-left-sidenav-group></app-layout-chat-left-sidenav-group>
      </ng-template>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>chat</mat-icon>
      </ng-template>
      <ng-template matTabContent>
        <app-layout-chat-left-sidenav-chat></app-layout-chat-left-sidenav-chat>
      </ng-template>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>device_hub</mat-icon>
      </ng-template>
      <ng-template matTabContent>
        <app-layout-chat-left-sidenav-organization></app-layout-chat-left-sidenav-organization>
      </ng-template>
    </mat-tab>
    <mat-tab>
      <ng-template mat-tab-label>
        <mat-icon>phone</mat-icon>
      </ng-template>
      <ng-template matTabContent>
        <app-layout-chat-left-sidenav-call></app-layout-chat-left-sidenav-call>
      </ng-template>
    </mat-tab>
  </mat-tab-group>
</div>