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

class OAuthCallbackScreen extends ConsumerStatefulWidget {
  final Uri uri;

  const OAuthCallbackScreen({super.key, required this.uri});

  @override
  ConsumerState<OAuthCallbackScreen> createState() => _OAuthCallbackScreenState();
}

class _OAuthCallbackScreenState extends ConsumerState<OAuthCallbackScreen> {
  String _status = 'Connecting to OpenStreetMap...';
  bool _isSuccess = false;
  bool _hasProcessed = false;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      if (!_hasProcessed) {
        _hasProcessed = true;
        _processAuth();
      }
    });
  }

  Future<void> _processAuth() async {
    final service = ref.read(osmOAuthServiceProvider.notifier);
    final success = await service.handleAuthCallback(widget.uri);

    if (mounted) {
      final errorMsg = ref.read(osmOAuthServiceProvider).errorMessage;
      setState(() {
        _isSuccess = success;
        _status = success
            ? 'Successfully connected to OpenStreetMap!'
            : (errorMsg ?? 'Authentication failed. Please try again.');
      });

      await Future.delayed(Duration(milliseconds: success ? 1500 : 3500));
      if (mounted) {
        context.go('/settings');
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(24.0),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                padding: const EdgeInsets.all(16),
                decoration: BoxDecoration(
                  color: _isSuccess
                      ? const Color(0xFF00E5FF).withValues(alpha: 0.15)
                      : Colors.white10,
                  shape: BoxShape.circle,
                  border: Border.all(
                    color: _isSuccess ? const Color(0xFF00E5FF) : Colors.white24,
                  ),
                ),
                child: Icon(
                  _isSuccess ? Icons.check_circle_outline : Icons.sync,
                  color: _isSuccess ? const Color(0xFF00E5FF) : Colors.white70,
                  size: 48,
                ),
              ),
              const SizedBox(height: 24),
              Text(
                _status,
                textAlign: TextAlign.center,
                style: const TextStyle(
                  fontFamily: 'Inter',
                  color: Colors.white,
                  fontSize: 16,
                  fontWeight: FontWeight.w600,
                ),
              ),
              const SizedBox(height: 16),
              if (!_isSuccess)
                const CircularProgressIndicator(color: Color(0xFF00E5FF)),
            ],
          ),
        ),
      ),
    );
  }
}