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

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

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

<GenericMediaListPage {config} />
