<script>
  let { id, name, active, hasUnreads } = $props();
</script>

<a href="/ch/{id}">
  <li class:active>
    {#if hasUnreads}
      <span class="badge has-unreads">❦</span>
    {:else}
      <span class="badge has-no-unreads">¶</span>
    {/if}
    <span>{name}</span>
  </li>
</a>
