import 'package:flutter/widgets.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../../application/payment_method/payment_method_loader/payment_method_loader_bloc.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/card/payment_card.dart';
import '../../../components/error/payment_method_error_state_widget.dart';
import '../../../components/loader/loader_with_text.dart';
import '../../../components/page/page_title.dart';
import '../../../components/spaces/space.dart';

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

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        PageTitle(
          title: 'Pembayaran',
          isBack: false,
          subtitle: 'Silahkan lakukan pembayaran',
        ),
        Expanded(
          child: SingleChildScrollView(
            child: Column(
              children: [
                // Container(
                //   padding: const EdgeInsets.all(16),
                //   decoration: BoxDecoration(
                //     color: AppColor.white,
                //     border: Border(
                //       bottom: BorderSide(color: AppColor.border, width: 1.0),
                //     ),
                //   ),
                //   child: CustomerAutocomplete(
                //     controller: customerController,
                //     selectedCustomer: selectedCustomer,
                //     onSelected: (customer) {
                //       setState(() {
                //         selectedCustomer = customer;
                //       });
                //     },
                //   ),
                // ),
                Container(
                  padding: const EdgeInsets.all(16),
                  width: double.infinity,
                  decoration: BoxDecoration(
                    color: AppColor.white,
                    border: Border(
                      bottom: BorderSide(color: AppColor.border, width: 1.0),
                    ),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        'Metode Pembayaran',
                        style: AppStyle.lg.copyWith(
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                      const SpaceHeight(12.0),
                      BlocBuilder<
                        PaymentMethodLoaderBloc,
                        PaymentMethodLoaderState
                      >(
                        builder: (context, state) {
                          if (state.isFetching) {
                            return Center(child: LoaderWithText());
                          }
                          return state.failureOption.fold(
                            () => Wrap(
                              spacing: 12.0,
                              runSpacing: 8.0,
                              children: state.paymentMethods.map((item) {
                                return PaymentCard(
                                  payment: item,
                                  isSelected: true,
                                );
                              }).toList(),
                            ),
                            (f) => PaymentMethodErrorStateWidget(failure: f),
                          );
                        },
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}