<script>
  export let {{ $.Plural }} = []
</script>

<h1>{{ $.Title }} Index</h1>

<table border="1" cellpadding="10">
  {#if {{ $.Plural }}.length > 0}
    <thead>
      {#each Object.keys({{ $.Plural }}[0]) as key}
        <th>{key}</th>
      {/each}
    </thead>
  {/if}
  {#each {{ $.Plural }} as {{ $.Singular -}} }
    <tr>
      {#each Object.keys({{ $.Singular }}) as key}
        {#if key.toLowerCase() === "id"}
          <td><a href={`{{ $.Controller.ShowPath }}`}>{ {{- $.Singular }}[key]}</a></td>
        {:else}
          <td>{ {{- $.Singular }}[key]}</td>
        {/if}
      {/each}
    </tr>
  {/each}
</table>

<br />

<a href={`{{ $.Controller.NewPath }}`}>New {{ $.Title }}</a>

<style>
  table {
    border-collapse: collapse;
  }
</style>
