@page
@model IndexModel
@inject SpotifyClientBuilder spotifyBuilder
@{
  ViewData["Title"] = "Home";
  ViewData["Page"] = "index";
}

<div class="text-center">
  <h1 class="display-4">
    Welcome,
  </h1>

  <table class="pure-table">
    <thead>
      <tr>
        <th>Image</th>
        <th>Name</th>
      </tr>
    </thead>
    <tbody>
      @{
        foreach (var item in Model.Playlists.Items)
        {
          <tr>
            <td>
              @if(item.Images.Any()) {
                <img width="100" height="100" src="@item.Images[0].Url">
              }
            </td>
            <td>
              @item.Name
            </td>
          </tr>
        }
      }
    </tbody>
  </table>
  @if(Model.Previous != null) {
    <a href="@Model.Previous">Previous</a>
  }
  @if(Model.Next != null) {
    <a href="@Model.Next">Next</a>
  }
</div>