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

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