import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
import '../../core/auth/auth_bloc.dart';
import '../../core/status/status_bloc.dart';
import '../../core/chat/chat_request_bloc.dart';
import '../chat/widgets/incoming_request_sheet.dart';

class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> with WidgetsBindingObserver {
  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    if (state == AppLifecycleState.resumed) {
      // Check if there's a pending request that was missed while backgrounded
      final chatState = context.read<ChatRequestBloc>().state;
      if (chatState is ChatRequestIncoming) {
        _showIncomingRequest(chatState.sessionId);
      }
    }
  }

  void _showIncomingRequest(String sessionId) {
    showModalBottomSheet(
      context: context,
      isDismissible: false,
      builder: (_) => BlocProvider.value(
        value: context.read<ChatRequestBloc>(),
        child: IncomingRequestSheet(sessionId: sessionId),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return MultiBlocListener(
      listeners: [
        BlocListener<StatusBloc, StatusState>(
          listener: (context, state) {
            if (state is StatusLoaded && state.isOnline) {
              context.read<ChatRequestBloc>().add(StartListening());
            } else if (state is StatusLoaded && !state.isOnline) {
              context.read<ChatRequestBloc>().add(StopListening());
            }
          },
        ),
        BlocListener<ChatRequestBloc, ChatRequestState>(
          listener: (context, state) {
            if (state is ChatRequestIncoming) {
              _showIncomingRequest(state.sessionId);
            } else if (state is ChatRequestAccepted) {
              final session = state.session;
              final sessionId = session['session_id'] as String? ?? session['id'] as String;
              context.push('/chat/session/$sessionId', extra: {
                'customerName': session['customer_display_name'] as String? ?? 'Customer',
              });
            }
          },
        ),
      ],
      child: BlocBuilder<AuthBloc, AuthState>(
        builder: (context, authState) {
          final displayName = authState is AuthAuthenticated
              ? authState.profile['display_name'] as String
              : '';

          return Scaffold(
            appBar: AppBar(
              title: const Text('Halo Bestie Mitra'),
              actions: [
                IconButton(
                  icon: const Icon(Icons.logout),
                  onPressed: () => context.read<AuthBloc>().add(LogoutRequested()),
                ),
              ],
            ),
            body: Padding(
              padding: const EdgeInsets.all(24),
              child: Column(
                children: [
                  Text('Halo, $displayName!', style: const TextStyle(fontSize: 24)),
                  const SizedBox(height: 32),
                  _StatusToggle(),
                  const SizedBox(height: 16),
                  _ActiveSessionsButton(),
                ],
              ),
            ),
          );
        },
      ),
    );
  }
}

class _StatusToggle extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BlocBuilder<StatusBloc, StatusState>(
      builder: (context, state) {
        final isOnline = state is StatusLoaded && state.isOnline;
        final isLoading = state is StatusLoading;

        return Card(
          child: Padding(
            padding: const EdgeInsets.all(16),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      isOnline ? 'Online' : 'Offline',
                      style: TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                        color: isOnline ? Colors.green : Colors.grey,
                      ),
                    ),
                    Text(
                      isOnline
                          ? 'Kamu siap menerima chat'
                          : 'Aktifkan untuk menerima chat',
                      style: const TextStyle(fontSize: 14, color: Colors.grey),
                    ),
                  ],
                ),
                isLoading
                    ? const SizedBox(
                        width: 24,
                        height: 24,
                        child: CircularProgressIndicator(strokeWidth: 2),
                      )
                    : Switch(
                        value: isOnline,
                        activeColor: Colors.green,
                        onChanged: (_) {
                          final bloc = context.read<StatusBloc>();
                          if (isOnline) {
                            bloc.add(ToggleOffline());
                          } else {
                            bloc.add(ToggleOnline());
                          }
                        },
                      ),
              ],
            ),
          ),
        );
      },
    );
  }
}

class _ActiveSessionsButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Card(
          child: ListTile(
            leading: const Icon(Icons.chat_bubble_outline),
            title: const Text('Sesi Aktif'),
            trailing: const Icon(Icons.chevron_right),
            onTap: () => context.push('/sessions'),
          ),
        ),
        Card(
          child: ListTile(
            leading: const Icon(Icons.history),
            title: const Text('Riwayat Chat'),
            trailing: const Icon(Icons.chevron_right),
            onTap: () => context.push('/chat/history'),
          ),
        ),
      ],
    );
  }
}