import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:phone_login/auth/auth_state.dart';

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

  @override
  Widget build(BuildContext context) {
    final authState = Provider.of<AuthState>(context);

    return Scaffold(
      appBar: AppBar(title: const Text('Profile')),
      body: authState.currentUser != null
          ? Padding(
              padding: const EdgeInsets.all(16.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  CircleAvatar(
                    radius: 50,
                    child: Text(
                      authState.currentUser!.displayName != null
                          ? authState.currentUser!.displayName![0].toUpperCase()
                          : '?',
                      style: const TextStyle(fontSize: 30),
                    ),
                  ),
                  const SizedBox(height: 16),
                  _buildProfileItem('Name', authState.currentUser!.displayName ?? 'Not set'),
                  _buildProfileItem('Phone', authState.currentUser!.phoneNumber ?? 'Not set'),
                  _buildProfileItem('Email', authState.currentUser!.email ?? 'Not set'),
                  const Spacer(),
                  Center(
                    child: authState.isLoading
                        ? const CircularProgressIndicator()
                        : ElevatedButton.icon(
                            onPressed: () async {
                              await authState.logout();
                            },
                            icon: const Icon(Icons.logout),
                            label: const Text('Logout'),
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Colors.red,
                              foregroundColor: Colors.white,
                            ),
                          ),
                  ),
                ],
              ),
            )
          : const Center(child: Text('Loading...')),
    );
  }

  Widget _buildProfileItem(String label, String value) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            label,
            style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
          ),
          const SizedBox(height: 4),
          Text(value.isEmpty ? 'Not set' : value),
          const Divider(),
        ],
      ),
    );
  }
}