import 'package:eatvio_app/core/enums/base_state.dart';
import 'package:eatvio_app/core/locator_service.dart';
import 'package:eatvio_app/core/theme/custom_text_style.dart';
import 'package:eatvio_app/core/theme/theme_helper.dart';
import 'package:eatvio_app/core/widgets/data_error_widget.dart';
import 'package:eatvio_app/core/widgets/loader.dart';
import 'package:eatvio_app/features/my_finance/presentation/cubit/user_cards_cubit/user_cards_cubit.dart';
import 'package:eatvio_app/features/my_finance/presentation/cubit/user_cards_cubit/user_cards_state.dart';
import 'package:eatvio_app/features/my_finance/presentation/widgets/card_widget.dart';
import 'package:eatvio_app/generated/l10n.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:collection/collection.dart';

class CardSettingsScreen extends StatelessWidget {
  static const path = '/card-settings-screen';
  static const name = 'cardSettingsScreen';
  const CardSettingsScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocProvider(create: (context) => sl<UserCardsCubit>()..getCards(), child: const CardsSettingsContent());
  }
}

class CardsSettingsContent extends StatelessWidget {
  const CardsSettingsContent({super.key});
  @override
  Widget build(BuildContext context) {
    final s = S.of(context);
    return Scaffold(
      backgroundColor: const Color(0xFFF0F2F5),
      appBar: AppBar(
        shape: const RoundedRectangleBorder(borderRadius: BorderRadius.vertical(bottom: Radius.circular(12))),
        title: Text(s.my_cards),
        centerTitle: true,
      ),
      body: Column(
        children: [
          const SizedBox(height: 16),
          Container(
            decoration: BoxDecoration(borderRadius: BorderRadius.circular(12), color: Colors.white),
            width: double.infinity,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const SizedBox(height: 16),
                const Padding(
                  padding: EdgeInsets.symmetric(horizontal: 16),
                  child: Text('Привязанные карты', style: TextStyle(color: Color(0xFF323F4B), fontSize: 18, fontWeight: FontWeight.w600, height: 1)),
                ),
                const SizedBox(height: 8),
                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  child: BlocBuilder<UserCardsCubit, UserCardsState>(
                    builder: (context, state) {
                      final defaultCardNumber = state.cards.firstWhereOrNull((element) => element.isDefault)?.cardNumber;
                      if (defaultCardNumber != null) {
                        return Text(
                          'Выплату будут производиться\nна карту ${defaultCardNumber.substring(defaultCardNumber.length - 7)}',
                          style: const TextStyle(color: Color(0xFF323F4B), fontSize: 16, fontWeight: FontWeight.w500, height: 1),
                        );
                      }
                      return Text(s.no_default_cards, style: TextStyles.textMMedium.copyWith(color: appTheme.black));
                    },
                  ),
                ),
                const SizedBox(height: 16),
                SingleChildScrollView(
                  scrollDirection: Axis.horizontal,
                  child: BlocBuilder<UserCardsCubit, UserCardsState>(
                    builder: (context, state) {
                      switch (state.state) {
                        case BaseState.error:
                          return SizedBox(
                            width: MediaQuery.sizeOf(context).width,
                            child: Center(
                              child: DataErrorWidget(
                                onReload: () async {
                                  context.read<UserCardsCubit>().getCards();
                                },
                              ),
                            ),
                          );
                        case BaseState.success:
                          return Padding(
                            padding: const EdgeInsets.only(left: 12),
                            child: Row(
                              spacing: 12,
                              children: List.generate(state.cards.length + 1, (index) {
                                if (index < state.cards.length) {
                                  final cardsNumber = state.cards[index].cardNumber.substring(state.cards[index].cardNumber.length - 7);
                                  return CardWidget(isSelected: state.cards[index].isDefault, cardId: state.cards[index].id, cardNumber: cardsNumber);
                                }
                                return const CardWidget(enabledAddCard: true);
                              }),
                            ),
                          );

                        default:
                          return SizedBox(width: MediaQuery.sizeOf(context).width, height: 200, child: const Center(child: Loader()));
                      }
                    },
                  ),
                ),
                const SizedBox(height: 16),
              ],
            ),
          ),
        ],
      ),
    );
  }
}