<div class="indicator"></div>
{{#if hasSystemMsg}}
  {{chat/system-message msg=systemMsg channelName=roomTrackingData.channel}}
{{/if}}
{{#if shouldRenderMessageBody}}
  <span class="timestamp float-left">{{ timestamp }}</span>
  {{#unless (or msgObject.flaggedForReview msgObject.twitchBotRejected)}}
    {{#if (and msgObject.tags.id isTwitchPrivilegedUser showMessageFlags)}}
      {{#if hasClickedRiskFlag}}
        <span class="float-left risk-flag risk-flag--flagged" title="Flagged Message" {{action "clickedRiskUnflag" msgObject.tags.id}}>
          {{partial 'svg/chat-risk-flag'}}
        </span>
      {{else}}
        <span class="float-left risk-flag" title="Flag message" {{action "clickedRiskFlag" msgObject.tags.id}}>
          {{partial 'svg/chat-risk-flag'}}
        </span>
      {{/if}}
    {{/if}}
  {{/unless}}
  {{#if isViewerModeratorOrHigher}}
    <span class="mod-icons float-left">
      {{#if msgObject.deleted}}
        <span class="balloon-wrapper float-left">
          <a class="mod-icon float-left unban" title="Unban User" href="#" {{action 'unban' msgObject.tags.id msgObject.from}}></a>
          <div class="balloon balloon--tooltip balloon--up balloon--center">Unban</div>
        </span>
      {{else}}
        <span class="balloon-wrapper float-left">
          <a class="mod-icon float-left ban" title="Ban User" href="#" {{action 'ban' msgObject.tags.id msgObject.from}}>Ban</a>
          <div class="balloon balloon--tooltip balloon--up balloon--center">Ban</div>
        </span>
      {{/if}}
      <span class="balloon-wrapper float-left">
        <a class="mod-icon float-left timeout" title="Timeout User" href="#" {{action 'timeout' msgObject.tags.id msgObject.from}}>Timeout</a>
        <div class="balloon balloon--tooltip balloon--up balloon--center">Timeout</div>
      </span>
    </span>
  {{/if}}
  <span class="badges float-left">
    {{#each badgeSet as |badge|}}
      <span class="balloon-wrapper float-left">
        <a href={{badge.targetUrl}} rel="noopener" target="_blank" rel="noopener noreferrer">
          <img src={{badge.src}} srcset={{badge.srcSet}} class="badge" alt={{badge.title}}>
        </a>
        <div class="balloon balloon--tooltip balloon--up">{{badge.title}}</div>
      </span>
    {{/each}}
  </span>
  <span class="from" style={{fromStyle}} {{action 'showModOverlay' msgObject.from}}>
    {{~ fromText ~}}
  </span>
  <span class="colon">:</span>
  {{#if (and msgObject.deleted (not msgObject.twitchBotRejected)) ~}}
    {{#if isViewerModeratorOrHigher}}
      <span class="deleted"><a class="undelete" href="#" {{action 'undelete'}}>&lt;{{i18n "message deleted"}}&gt;</a></span>
    {{else}}
      <span class="deleted">&lt;{{i18n "message deleted"}}&gt;</span>
    {{/if}}
  {{~ else  ~}}
    {{#if (or (and showModerationActions msgObject.isModerationMessage) (not msgObject.isModerationMessage)) }}
      <span class="message" style={{messageStyle}}>
        {{#each tokenizedMessage as |token|~}}
          {{~#if (eq token.type "bits")}}
            {{#if canRenderBits}}
              {{bits/chat-token amount=token.amount prefix=token.prefix}}
            {{else}}
              {{token.prefix}}{{token.amount}}
            {{/if}}
          {{else if (eq token.type "bits-tag")}}
            <strong>
              <span class="mentioning">{{token.tag}}</span>
            </strong>
          {{else if (eq token.type "emoticon")}}
            <span class="balloon-wrapper">
              <img class="emoticon" src="{{token.imgSrc}}" srcset="{{token.srcSet}}" alt="{{token.altText}}">
              <div class="balloon balloon--tooltip balloon--up balloon--center mg-t-1">{{token.altText}}</div>
            </span>
          {{else if (eq token.type "link")}}
            {{#if token.isDeleted}}
              &lt;deleted link&gt;
            {{else}}
              <a href="{{concat (if token.isMailTo 'mailto:' "") token.link}}" target="_blank" rel="noreferrer noopener">{{token.text}}</a>
            {{/if}}
          {{else if (eq token.type "mention")}}
            <span class="{{if token.isOwnMessage 'mentioning' 'mentioned'}}">{{token.user}}</span>
          {{else if (eq token.type "text")}}
            {{token.text}}
          {{/if~}}
        {{~/each}}
      </span>
      {{#each-in richContent as |contentType contents|}}
        {{#each contents as |content|}}
          {{#if (and (eq contentType 'clips') (not hideChatLinks))}}
            {{clips/clips-chat-card
              slug=content.data.slug
              isDarkMode=isDarkMode
            }}
          {{/if}}
        {{/each}}
      {{/each-in}}
    {{/if}}
  {{~/if}}
  {{#if hasClickedFlaggedMessage}}
    <div class="system-msg">Thank you for your response!</div>
  {{else if msgObject.flaggedForReview}}
    <div class="brick brick--pd-none brick--theme-grey align-center special-message__box">
      <div class="pd-b-1">
        {{i18n "Allowed under" }}
        <a href="https://www.twitch.tv/p/rules-of-conduct" target="_blank" rel="noopener noreferrer">{{i18n "Twitch's Rules of Conduct"}}?</a>
      </div>
      <button class="button button--small" {{action "clickedRiskYes" msgObject.tags.id}}> {{i18n "Allow"}} </button>
      <button class="button button--small button--alert" {{action "clickedRiskNo" msgObject.tags.id}}> {{i18n "Not Allowed"}} </button>
    </div>
  {{else if msgObject.twitchBotRejected}}
    {{#if showTwitchBotActions}}
      <p class="inline-warning">{{i18n "AutoMod held this message. Allow it?"}}<br> {{i18n "Allowing will post it to chat"}}.</p>
      <div class="pd-y-1 clearfix">
        <a class="button button--small button--alert float-left mg-r-1" {{action "clickedTwitchBotResponse" msgObject.tags.id "no"}}>{{i18n "Deny"}}</a>
        <a class="button button--small float-left mg-r-1" {{action "clickedTwitchBotResponse" msgObject.tags.id "yes"}}>{{i18n "Allow"}}</a>
        <a class="button button--small button--text float-left" {{action "clickedTwitchBotResponse" msgObject.tags.id "not sure"}}>{{i18n "Not Sure"}}</a>
      </div>
    {{/if}}
  {{/if}}
{{~/if}}
