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

import '../../../../core/utils/extensions.dart';
import '../../../../shared/providers/auth_provider.dart';

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

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final authState = ref.watch(authStateProvider);

    return SingleChildScrollView(
      padding: const EdgeInsets.all(24),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '프로필',
            style: context.textTheme.headlineMedium?.copyWith(
              fontWeight: FontWeight.bold,
            ),
          ),
          const Gap(24),

          // 프로필 카드
          Center(
            child: ConstrainedBox(
              constraints: const BoxConstraints(maxWidth: 600),
              child: Card(
                child: Padding(
                  padding: const EdgeInsets.all(32),
                  child: authState.when(
                    data: (user) => Column(
                      children: [
                        // 아바타
                        CircleAvatar(
                          radius: 50,
                          backgroundColor:
                              context.colorScheme.primaryContainer,
                          child: Text(
                            (user?.name ?? 'U').substring(0, 1).toUpperCase(),
                            style: context.textTheme.headlineLarge?.copyWith(
                              color: context.colorScheme.primary,
                            ),
                          ),
                        ),
                        const Gap(16),
                        Text(
                          user?.name ?? '사용자',
                          style: context.textTheme.headlineSmall?.copyWith(
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const Gap(4),
                        Text(
                          user?.email ?? '',
                          style: context.textTheme.bodyLarge?.copyWith(
                            color: context.colorScheme.onSurfaceVariant,
                          ),
                        ),
                        const Gap(8),
                        Chip(
                          label: Text(
                            user?.role.value.toUpperCase() ?? 'USER',
                          ),
                          backgroundColor:
                              context.colorScheme.secondaryContainer,
                        ),
                        const Gap(32),
                        const Divider(),
                        const Gap(16),

                        // 프로필 정보 목록
                        _ProfileInfoTile(
                          icon: Icons.person_outlined,
                          label: '이름',
                          value: user?.name ?? '-',
                        ),
                        _ProfileInfoTile(
                          icon: Icons.email_outlined,
                          label: '이메일',
                          value: user?.email ?? '-',
                        ),
                        _ProfileInfoTile(
                          icon: Icons.shield_outlined,
                          label: '역할',
                          value: user?.role.value ?? '-',
                        ),
                        _ProfileInfoTile(
                          icon: Icons.calendar_today_outlined,
                          label: '가입일',
                          value: user?.createdAt?.toString().split(' ').first ??
                              '-',
                        ),
                        const Gap(24),

                        // 프로필 수정 버튼
                        SizedBox(
                          width: double.infinity,
                          child: FilledButton.icon(
                            onPressed: () {
                              // TODO: 프로필 수정 기능
                            },
                            icon: const Icon(Icons.edit),
                            label: const Text('프로필 수정'),
                          ),
                        ),
                      ],
                    ),
                    loading: () => const Center(
                      child: CircularProgressIndicator(),
                    ),
                    error: (error, _) => Center(
                      child: Text('오류: $error'),
                    ),
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class _ProfileInfoTile extends StatelessWidget {
  const _ProfileInfoTile({
    required this.icon,
    required this.label,
    required this.value,
  });

  final IconData icon;
  final String label;
  final String value;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 8),
      child: Row(
        children: [
          Icon(
            icon,
            size: 20,
            color: Theme.of(context).colorScheme.onSurfaceVariant,
          ),
          const Gap(12),
          SizedBox(
            width: 80,
            child: Text(
              label,
              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                    color: Theme.of(context).colorScheme.onSurfaceVariant,
                  ),
            ),
          ),
          Expanded(
            child: Text(
              value,
              style: Theme.of(context).textTheme.bodyMedium,
            ),
          ),
        ],
      ),
    );
  }
}