$ const fullNames = (input.log.characters.length < 4);

<tr key=input.log.shortId class="logs-table-row color-text">
  <td class="date color-primary">
    <a href=("/logs/"+input.log.id)>${state.dateStr}</a>
  </td>
  <td class="channel color-menu">
    <a on-click("emit", "addfilter", "channels", input.log.channelName)>${input.log.channelName}</a>
  </td>
  <td class="event color-tag-event">
    <a on-click("emit", "addfilter", "events", input.log.eventName)>${(input.log.eventName || "").replace(/\s/g, " ")}</a>
  </td>
  <td class="characters color-menu">
    <span for(character in input.log.characters | status-var=loop)>
      <a on-click("emit", "addfilter", "characters", character.id) class="name">${fullNames ? character.name : character.shortName}</a>
      <span class="comma" if(loop.getIndex() < (loop.getLength() - 1))>, </span>
    </span>
  </td>
</tr>
<tr if(state.expand) key=(input.log.shortId + "_expand") class="logs-table-row-expanded">

</tr>