<!-- 通話 -->
<div class="collabo_area_container chat_message" data-messageid="{{messageId}}">
  <!-- 時刻 -->
  <div class="collabo_date text-right">
    {{#isToday}}
    <span>{{createdAtTime}}</span>
    {{/isToday}}
    {{^isToday}}
    <span>{{createdAtDay}}</span><span>{{createdAtTime}}</span>
    {{/isToday}}
  </div>
  {{#isEnded}}
  <div class="collabo_area end disable">
    {{/isEnded}}
    {{^isEnded}}
    <div class="collabo_area start">
      {{/isEnded}}
      <div class="collabo_desc">
        <div class="collabo_room_name d-flex flex-row">
          <span>{{roomName}}</span>
          <span>の通話</span>
        </div>
        <div class="d-flex flex-row justify-content-between">
          <div class="collabo_user_list d-flex flex-row">
            {{#userList}}
            <div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"></div>
            {{/userList}}
            <div class="num"><span>{{userCount}}</span></div>
          </div>
          <div class="collabo_time">
            <span class="collaboration_duration" data-insertDate="{{insertDate}}"></span>
          </div>
        </div>
        <div class="collabo_btn">
          <button class="collaboation_join_button" type="button" name="button"
            class="d-flex flex-row justify-content-center align-items-center"
            onclick="NativeBridgeDelegate.joinCollaboration('{{collaborationType}}', {{meetingId}})" {{#isEnded}}
            disabled {{/isEnded}}>
            <img src="icon/icon_profile_phone_white.svg" alt="通話">
            {{#isEnded}}
            <span class="collaboration_join_message">終了しました</span>
            {{/isEnded}}
            {{^isEnded}}
            <span class="collaboration_join_message">参加する</span>
            {{/isEnded}}
          </button>
        </div>
      </div>
    </div>
  </div>