import 'package:comwell_key_app/common/components/comwell_app_bar.dart';
import 'package:comwell_key_app/common/components/comwell_error_widget.dart';
import 'package:comwell_key_app/common/components/shimmer_loader/notifications_shimmer_loader.dart';
import 'package:comwell_key_app/presentation/screens/notifications/components/communications_list.dart';
import 'package:comwell_key_app/utils/l10n_utils.dart';
import 'package:concierge/presentation/theme/app_colors.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:comwell_key_app/presentation/screens/notifications/bloc/notifications_cubit.dart';
import 'package:comwell_key_app/presentation/screens/notifications/bloc/notifications_state.dart';

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

  @override
  Widget build(BuildContext context) {
    final cubit = context.read<NotificationsCubit>();
    return Scaffold(
      backgroundColor: Theme.of(context).colorScheme.surface,
      appBar: const ComwellAppBar(shouldShowProfileButton: false),
      body: BlocBuilder<NotificationsCubit, NotificationsState>(
        builder: (context, state) {
          if (state.isLoading) {
            return const Center(child: NotificationsShimmerLoader());
          } else if (state.error.isError) {
            return Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                ComwellErrorWidget(
                  title: context.strings.generic_error_title,
                  subtitle: context.strings.notifications_error_subtitle,
                  border: false,
                ),
              ],
            );
          } else {
            return _buildNotificationsPage(context, cubit);
          }
        },
      ),
    );
  }

  Widget _buildNotificationsPage(BuildContext context, NotificationsCubit cubit) {
    final theme = Theme.of(context);
    return SafeArea(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(16.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    context.strings.notifications_page_title,
                    style: const TextStyle(
                      fontSize: 28,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  const SizedBox(height: 20),
                  Row(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Switch(
                        thumbColor: WidgetStateProperty.resolveWith((states) {
                          if (states.contains(WidgetState.selected)) {
                            return AppColors.sandColor;
                          }
                          return Colors.white;
                        }),
                        trackColor: WidgetStateProperty.resolveWith((states) {
                          if (!states.contains(WidgetState.selected)) {
                            return Colors.grey[200];
                          }
                          return null;
                        }),
                        trackOutlineColor: WidgetStatePropertyAll(
                          Theme.of(context).colorScheme.surface,
                        ),
                        value: cubit.state.allNotifications.every((e) => e.given),
                        onChanged: (bool value) {
                          cubit.updateAllPermissionsUI(value);
                        },
                      ),
                      const SizedBox(width: 8),
                      Text(
                        context.strings.subscribe_all,
                        style: const TextStyle(fontSize: 16),
                      ),
                    ],
                  ),
                  Expanded(
                    child: CommunicationsList(
                      notificationPermissions: cubit.state.allNotifications,
                      valueChanged: (String name) {
                        cubit.onNotificationPermissionClicked(name);
                      },
                    ),
                  ),
                ],
              ),
            ),
          ),
          Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Divider(
                color: Theme.of(context).colorScheme.outline,
                thickness: 1,
                height: 0,
              ),
              const SizedBox(height: 16),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 16.0),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    SizedBox(
                      width: double.infinity,
                      height: 50,
                      child: ElevatedButton(
                        onPressed: () {
                          cubit.updatePreferences(cubit.state.allNotifications);
                        },
                        style: theme.elevatedButtonTheme.style,
                        child: Text(
                          context.strings.save,
                          style: const TextStyle(
                            color: Colors.white,
                            fontSize: 16,
                          ),
                        ),
                      ),
                    ),
                    const SizedBox(height: 16),
                  ],
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}