import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../shared/sort_store.dart';
import '../shared/sortable_song_list.dart';
import 'database.dart';
import '../shared/theme.dart';

/// Favoriten-Tab: Shuffle-Wiedergabe und dieselbe Sortierung wie "Meine Musik",
/// nur auf den favorisierten Songs.
class FavoritesScreen extends StatelessWidget {
  const FavoritesScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final db = context.read<MeloDb>();
    return SafeArea(
      bottom: false,
      child: Column(
        children: [
          const Padding(
            padding: EdgeInsets.fromLTRB(20, 16, 20, 4),
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text('Favoriten',
                  style: TextStyle(fontSize: 24, fontWeight: FontWeight.w700)),
            ),
          ),
          Expanded(
            child: StreamBuilder<List<Song>>(
              stream: db.watchFavorites(),
              builder: (context, snapshot) {
                final songs = snapshot.data ?? const <Song>[];
                return SortableSongList(
                  songs: songs,
                  storeKey: SortStore.favoriten,
                  empty: const _Empty(),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

class _Empty extends StatelessWidget {
  const _Empty();

  @override
  Widget build(BuildContext context) {
    return const Center(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(Icons.favorite_border, size: 64, color: Colors.white24),
          SizedBox(height: 12),
          Text('Noch keine Favoriten', style: TextStyle(color: MeloTheme.text2)),
          SizedBox(height: 6),
          Text('Tippe in einer Liederliste auf das Herz.',
              style: TextStyle(color: Colors.white30, fontSize: 12)),
        ],
      ),
    );
  }
}