Album & Artist Pages

[CStoker11]

Overview

Builds out the album and artist UI pages on top of the mock API

What's included

Albums

• Fetches albums and artists concurrently and renders them as cards (grid) or
  rows (list), toggleable from the header.
• Search by album title and filter by genre
• Each album shows cover art, title, artist(s), genre, and track count.

Artists

• Derives each artist's album and total song counts from the catalog.
• Initials-avatar list with name + metadata, and search by artist name.

Cross-cutting

• Dark color scheme
• Elevated header panel that raises a soft shadow only once content scrolls.
• Content is capped to a max width and centered on wide screens.
• Loading, error (with retry), and empty states on every async surface.

Architecture & decisions

• Data layer: typed Album/Song/Artist models with fromJson
  factories; ApiClient extended with fetchArtists() alongside fetchAlbums()
• Artist↔album relationship: the API models artists as referencing album
  ids (no artist on the album, no genre on the artist), so the UI inverts that
  relationship to show artists on albums and to derive artist genres/song counts.
• State management: StatefulWidget + FutureBuilder + setState. This
  fits the app's size; filtering is done client-side over the already-loaded
  data. At larger scale I'd debounce search input, memoize filtered results, and
  consider a dedicated state solution / pagination.

Testing

• Unit tests for the model parsing layer (Album/Song/Artist.fromJson),
  including nested and empty collections.
• Run with flutter test.

How to run

1. API: cd api && dart pub get && dart run bin/server.dart
2. App: cd app && flutter pub get && flutter run

Possible follow-ups

• Album and artist detail screens (tap is wired but currently a no-op)
• Persist the grid/list preference; debounce search for larger catalogs.