import 'package:flutter/material.dart';
import 'package:groovybox/data/db.dart';
import 'package:groovybox/data/playlist_repository.dart';
import 'package:groovybox/providers/audio_provider.dart';
import 'package:groovybox/ui/widgets/track_tile.dart';
import 'package:groovybox/ui/widgets/universal_image.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:material_symbols_icons/symbols.dart';
import 'package:styled_widget/styled_widget.dart';

class AlbumDetailScreen extends HookConsumerWidget {
  final AlbumData album;

  const AlbumDetailScreen({super.key, required this.album});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final repo = ref.watch(playlistRepositoryProvider.notifier);
    final tracksAsync = repo.watchAlbumTracks(album.album);

    return Scaffold(
      body: CustomScrollView(
        slivers: [
          SliverAppBar(
            expandedHeight: 300,
            pinned: true,
            flexibleSpace: FlexibleSpaceBar(
              title: Text(album.album),
              background: album.artUri != null
                  ? UniversalImage(uri: album.artUri!, fit: BoxFit.cover)
                  : Container(
                      color: Colors.grey[800],
                      child: const Icon(
                        Symbols.album,
                        size: 100,
                        color: Colors.white54,
                      ),
                    ),
            ),
          ),
          StreamBuilder<List<Track>>(
            stream: tracksAsync,
            builder: (context, snapshot) {
              if (!snapshot.hasData) {
                return const SliverFillRemaining(
                  child: Center(child: CircularProgressIndicator()),
                );
              }

              final tracks = snapshot.data!;
              if (tracks.isEmpty) {
                return const SliverFillRemaining(
                  child: Center(child: Text('No tracks in this album')),
                );
              }

              return SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  if (index == 0) {
                    return Column(
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(16.0),
                          child: SizedBox(
                            width: double.infinity,
                            child: FilledButton.icon(
                              onPressed: () {
                                _playAlbum(ref, tracks);
                              },
                              icon: const Icon(Symbols.play_arrow),
                              label: const Text('Play All'),
                            ),
                          ),
                        ),
                        _buildTrackTile(ref, tracks, index),
                      ],
                    );
                  }
                  return _buildTrackTile(ref, tracks, index);
                }, childCount: tracks.length),
              );
            },
          ),
        ],
      ),
    );
  }

  Widget _buildTrackTile(WidgetRef ref, List<Track> tracks, int index) {
    final track = tracks[index];
    return TrackTile(
      track: track,
      leading: Text(
        '${index + 1}'.padLeft(2, '0'),
        style: const TextStyle(color: Colors.grey, fontSize: 16),
      ).padding(right: 16),
      showTrailingIcon: false,
      onTap: () {
        _playAlbum(ref, tracks, initialIndex: index);
      },
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
    );
  }

  void _playAlbum(WidgetRef ref, List<Track> tracks, {int initialIndex = 0}) {
    final loadingNotifier = ref.read(remoteTrackLoadingProvider.notifier);
    final audioHandler = ref.read(audioHandlerProvider);
    loadingNotifier.setLoading(true);
    audioHandler.playTracks(tracks, initialIndex: initialIndex).then((_) {
      loadingNotifier.setLoading(false);
    });
  }
}