// Author: fruit.com.cn

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

import '../../../core/config/locale_controller.dart';
import '../../../core/data/models/drama.dart';
import '../../../core/formatting/localized_content.dart';
import '../../../core/theme/app_colors.dart';
import '../../../core/widgets/remote_image.dart';
import '../../../l10n/app_localizations.dart';

/// Compact navigation menu opened from the preview home header.
class HomeMenuSheet extends StatelessWidget {
  const HomeMenuSheet({
    super.key,
    required this.drama,
    required this.onOpenSeries,
    required this.onDiscover,
    required this.onHistory,
    required this.onWatchlist,
    required this.onLiked,
  });

  final Drama drama;
  final VoidCallback onOpenSeries;
  final VoidCallback onDiscover;
  final VoidCallback onHistory;
  final VoidCallback onWatchlist;
  final VoidCallback onLiked;

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context)!;
    final languageCode = Localizations.localeOf(context).languageCode;
    void closeThen(VoidCallback action) {
      Navigator.pop(context);
      action();
    }

    return SafeArea(
      child: SingleChildScrollView(
        padding: const EdgeInsets.fromLTRB(16, 4, 16, 20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              padding: const EdgeInsets.all(10),
              decoration: BoxDecoration(
                color: AppColors.cardAlt,
                borderRadius: BorderRadius.circular(12),
              ),
              child: Row(
                children: [
                  ClipRRect(
                    borderRadius: BorderRadius.circular(10),
                    child: RemoteImage(drama.posterUrl, width: 64, height: 86),
                  ),
                  const SizedBox(width: 10),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          localizedDramaTitle(l10n, drama),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: const TextStyle(
                            color: AppColors.onSurface,
                            fontSize: 15,
                            fontWeight: FontWeight.w800,
                          ),
                        ),
                        const SizedBox(height: 4),
                        Text(
                          l10n.episodeCount(drama.episodeCount),
                          style: const TextStyle(
                            color: AppColors.muted,
                            fontSize: 9,
                          ),
                        ),
                        const SizedBox(height: 8),
                        SizedBox(
                          height: 34,
                          child: FilledButton.icon(
                            key: const Key('drawer-open-series'),
                            onPressed: () => closeThen(onOpenSeries),
                            style: FilledButton.styleFrom(
                              backgroundColor: AppColors.blue,
                              foregroundColor: AppColors.onPrimary,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(9),
                              ),
                              textStyle: const TextStyle(fontSize: 11),
                            ),
                            icon: const Icon(
                              Icons.play_arrow_rounded,
                              size: 15,
                            ),
                            label: Text(l10n.exploreSeries),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 14),
            Text(
              l10n.quickAccess,
              style: const TextStyle(
                color: AppColors.onSurface,
                fontSize: 13,
                fontWeight: FontWeight.w800,
              ),
            ),
            const SizedBox(height: 8),
            Row(
              children: [
                Expanded(
                  child: _MenuTile(
                    key: const Key('drawer-discover'),
                    icon: Icons.explore_outlined,
                    label: l10n.discoverTab,
                    onTap: () => closeThen(onDiscover),
                  ),
                ),
                const SizedBox(width: 8),
                Expanded(
                  child: _MenuTile(
                    key: const Key('drawer-history'),
                    icon: Icons.history_rounded,
                    label: l10n.history,
                    onTap: () => closeThen(onHistory),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 8),
            Row(
              children: [
                Expanded(
                  child: _MenuTile(
                    key: const Key('drawer-watchlist'),
                    icon: Icons.bookmark_border_rounded,
                    label: l10n.watchlist,
                    onTap: () => closeThen(onWatchlist),
                  ),
                ),
                const SizedBox(width: 8),
                Expanded(
                  child: _MenuTile(
                    key: const Key('drawer-liked'),
                    icon: Icons.favorite_border_rounded,
                    label: l10n.likedTab,
                    onTap: () => closeThen(onLiked),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 14),
            Text(
              l10n.appLanguage,
              style: const TextStyle(
                color: AppColors.onSurface,
                fontSize: 13,
                fontWeight: FontWeight.w800,
              ),
            ),
            const SizedBox(height: 8),
            Wrap(
              spacing: 8,
              runSpacing: 8,
              children: [
                for (final (code, label) in [
                  ('en', l10n.english),
                  ('zh', l10n.simplifiedChinese),
                  ('id', l10n.bahasaIndonesia),
                ])
                  ChoiceChip(
                    label: Text(label),
                    selected: languageCode == code,
                    onSelected: (_) =>
                        context.read<LocaleController>().select(code),
                    backgroundColor: AppColors.input,
                    selectedColor: AppColors.blue,
                    labelStyle: TextStyle(
                      color: languageCode == code
                          ? AppColors.onPrimary
                          : AppColors.muted,
                      fontSize: 10,
                    ),
                    side: BorderSide.none,
                    showCheckmark: false,
                  ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

class _MenuTile extends StatelessWidget {
  const _MenuTile({
    super.key,
    required this.icon,
    required this.label,
    required this.onTap,
  });

  final IconData icon;
  final String label;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return Material(
      color: AppColors.quick,
      borderRadius: BorderRadius.circular(12),
      clipBehavior: Clip.antiAlias,
      child: InkWell(
        onTap: onTap,
        child: SizedBox(
          height: 58,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Icon(icon, color: AppColors.secondary, size: 16),
              const SizedBox(height: 4),
              Text(
                label,
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
                style: const TextStyle(color: AppColors.muted, fontSize: 9),
              ),
            ],
          ),
        ),
      ),
    );
  }
}