import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';

import '../../../app/router/route_names.dart';
import '../../auth/providers/auth_provider.dart';
import '../../bookshelf/providers/bookshelf_provider.dart';

class ProfileScreen extends ConsumerWidget {
  const ProfileScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final authState = ref.watch(authProvider);
    final bookshelfAsync = ref.watch(bookshelfProvider);
    final bookmarkedCount =
        bookshelfAsync.maybeWhen(data: (items) => items.length, orElse: () => 0);
    final displayName = authState is AuthAuthenticated
      ? ((authState.user.name != null && authState.user.name!.trim().isNotEmpty)
        ? authState.user.name!.trim()
        : authState.user.email)
      : '';

    return Scaffold(
      appBar: AppBar(title: const Text('Tài khoản')),
      body: switch (authState) {
        AuthAuthenticated(:final user) => SingleChildScrollView(
            padding: const EdgeInsets.all(16),
            child: Column(
              children: [
                // User Avatar & Basic Info
                Container(
                  padding: const EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    color: Theme.of(context).colorScheme.primaryContainer,
                    borderRadius: BorderRadius.circular(12),
                  ),
                  child: Column(
                    children: [
                      CircleAvatar(
                        radius: 40,
                        backgroundImage:
                            user.image != null ? NetworkImage(user.image!) : null,
                        child: user.image == null
                            ? Text(
                            displayName[0].toUpperCase(),
                                style:
                                    Theme.of(context).textTheme.headlineMedium,
                              )
                            : null,
                      ),
                      const SizedBox(height: 12),
                      Text(
                        displayName,
                        style: Theme.of(context).textTheme.titleLarge,
                        textAlign: TextAlign.center,
                      ),
                      const SizedBox(height: 4),
                      Text(
                        user.email,
                        style: Theme.of(context).textTheme.bodyMedium,
                        textAlign: TextAlign.center,
                      ),
                    ],
                  ),
                ),
                const SizedBox(height: 24),

                // Stats Cards
                Row(
                  children: [
                    Expanded(
                      child: _buildStatCard(
                        context: context,
                        label: 'Sách Đánh Dấu',
                        count: bookmarkedCount,
                      ),
                    ),
                    const SizedBox(width: 12),
                    Expanded(
                      child: _buildStatCard(
                        context: context,
                        label: 'Đang Đọc',
                        count: bookmarkedCount,
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 24),

                // Settings Button
                SizedBox(
                  width: double.infinity,
                  child: FilledButton.icon(
                    onPressed: () => context.push(RouteNames.settings),
                    icon: const Icon(Icons.tune),
                    label: const Text('Cài Đặt Đọc'),
                  ),
                ),
                const SizedBox(height: 12),

                // Logout Button
                SizedBox(
                  width: double.infinity,
                  child: OutlinedButton.icon(
                    onPressed: () async {
                      await ref.read(authProvider.notifier).signOut();
                      if (context.mounted) context.go(RouteNames.home);
                    },
                    icon: const Icon(Icons.logout),
                    label: const Text('Đăng Xuất'),
                  ),
                ),
              ],
            ),
          ),
        AuthError(:final message) => Center(child: Text(message)),
        AuthUnauthenticated() => Center(
            child: Padding(
              padding: const EdgeInsets.all(16),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  FilledButton(
                    onPressed: () => ref.read(authProvider.notifier).signInWithGoogle(),
                    child: const Text('Đăng nhập bằng Google'),
                  ),
                  const SizedBox(height: 12),
                  OutlinedButton.icon(
                    onPressed: () => context.push(RouteNames.settings),
                    icon: const Icon(Icons.tune),
                    label: const Text('Mở Cài Đặt Đọc'),
                  ),
                ],
              ),
            ),
          ),
        _ => const Center(child: CircularProgressIndicator()),
      },
    );
  }

  Widget _buildStatCard({
    required BuildContext context,
    required String label,
    required int count,
  }) {
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 12),
      decoration: BoxDecoration(
        color: Theme.of(context).colorScheme.surfaceContainer,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Column(
        children: [
          Text(
            count.toString(),
            style: Theme.of(context).textTheme.headlineMedium?.copyWith(
                  color: Theme.of(context).colorScheme.primary,
                ),
          ),
          const SizedBox(height: 4),
          Text(
            label,
            style: Theme.of(context).textTheme.bodySmall,
            textAlign: TextAlign.center,
          ),
        ],
      ),
    );
  }
}