<mat-toolbar class="info-chat-toolbar">
  <mat-toolbar-row>
    <div class="profileImage">
      <img
        class="thumbnail"
        ucapImage
        [base]="versionInfo2Res?.profileRoot"
        [path]="roomImage"
        [default]="defaultProfileImage"
      />
    </div>
    <span
      >{{ roomName }}
      <span
        class="user-count"
        *ngIf="currentRoomInfo?.roomType === RoomType.Multi"
      >
        (<strong>{{ currentRoomInfo?.joinUserCount }}</strong
        >)
      </span>
    </span>
    <span class="example-spacer"></span>
    <div>
      <button
        mat-mini-fab
        color="primary"
        aria-label="search"
        matTooltip="{{ 'label.search' | ucapI18n }}"
        (click)="onOpenChatSearch()"
      >
        <mat-icon>search</mat-icon>
      </button>
      <button
        mat-mini-fab
        color="primary"
        aria-label="alarm"
        matTooltip="{{
          (currentRoomInfo?.receiveAlarm
            ? 'label.notificationIsOn'
            : 'label.notificationIsOff'
          ) | ucapI18n
        }}"
        (click)="onToggleAlarm(currentRoomInfo)"
      >
        <mat-icon *ngIf="currentRoomInfo?.receiveAlarm">notifications</mat-icon>

        <mat-icon *ngIf="!currentRoomInfo?.receiveAlarm"
          >notifications_off</mat-icon
        >
      </button>
      <button
        mat-mini-fab
        color="primary"
        aria-label="show room users"
        matTooltip="{{ 'label.showRoomUsers' | ucapI18n }}"
        (click)="onOpenRoomUserList(currentRoomInfo)"
      >
        <mat-icon>group</mat-icon>
      </button>
      <button mat-mini-fab color="primary" aria-label="">
        <mat-icon>more_vert</mat-icon>
      </button>
      <button
        mat-mini-fab
        color="primary"
        aria-label="Menu"
        matTooltip="{{ 'label.menu' | ucapI18n }}"
        (click)="onRightDrawerToggle()"
      >
        <mat-icon>menu</mat-icon>
      </button>
    </div>
  </mat-toolbar-row>
</mat-toolbar>
