<script lang="ts">
  import GenericMediaListPage from "$lib/components/library/GenericMediaListPage.svelte";
  import type { MediaItem } from "$lib/api/types";

  /**
   * Album browser
   * @req: UR-007 - Navigate media in library
   * @req: UR-008 - Search media across libraries
   * @req: DR-007 - Library browsing screens
   */

  const config = {
    itemType: "MusicAlbum" as const,
    title: "Albums",
    backPath: "/library/music",
    searchPlaceholder: "Search albums or artists...",
    sortOptions: [
      {
        key: "SortName",
        label: "A-Z",
      },
      {
        key: "Artist",
        label: "Artist",
      },
      {
        key: "ProductionYear",
        label: "Year",
      },
      {
        key: "DatePlayed",
        label: "Recent",
      },
    ],
    defaultSort: "SortName",
    displayComponent: "grid" as const,
  };
</script>

<GenericMediaListPage {config} />
