spotube/lib/components/stats/top/artists.dart

import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotube/collections/formatters.dart';
import 'package:spotube/components/shared/image/universal_image.dart';
import 'package:spotube/extensions/image.dart';
import 'package:spotube/pages/artist/artist.dart';
import 'package:spotube/provider/history/top.dart';
import 'package:spotube/utils/service_utils.dart';

class TopArtists extends HookConsumerWidget {
  const TopArtists({super.key});

  @override
  Widget build(BuildContext context, ref) {
    final historyDuration = ref.watch(playbackHistoryTopDurationProvider);
    final artists = ref.watch(playbackHistoryTopProvider(historyDuration)
        .select((value) => value.artists));

    return SliverList.builder(
      itemCount: artists.length,
      itemBuilder: (context, index) {
        final artist = artists[index];
        return ListTile(
          title: Text(artist.artist.name!),
          horizontalTitleGap: 8,
          leading: CircleAvatar(
            backgroundImage: UniversalImage.imageProvider(
              (artist.artist.images).asUrlString(
                placeholder: ImagePlaceholder.artist,
              ),
            ),
          ),
          trailing: Text(
            "${compactNumberFormatter.format(artist.count)} plays",
          ),
          onTap: () {
            ServiceUtils.pushNamed(
              context,
              ArtistPage.name,
              pathParameters: {
                "id": artist.artist.id!,
              },
            );
          },
        );
      },
    );
  }
}