<div class="ucap-chat-room-list-item2">
  <div class="ucap-chat-room-list-item2-profile-image">
    <div class="profile-image">
      <img
        ucapImage
        [base]="profileImageRoot"
        [path]="profileImage"
        [default]="defaultProfileImage"
      />
    </div>
  </div>
  <div class="ucap-chat-room-list-item2-info">
    <div class="roomName">
      <div class="chat-subject">{{ roomName }}</div>
      <div *ngIf="roomInfo.roomType === RoomType.Multi" class="chat-amount">
        <strong>({{ roomInfo.joinUserCount }})</strong>
      </div>
    </div>
    <div class="lastMessage">{{ roomInfo.finalEventMessage }}</div>
  </div>

  <mat-checkbox
    *ngIf="checkable"
    #checkbox
    [checked]="checked"
    (change)="onToggleItem(checkbox.checked)"
    (click)="$event.stopPropagation()"
    class="group-check"
  >
  </mat-checkbox>
</div>