import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/smart_door_bloc/smart_door_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/smart_door_bloc/smart_door_event.dart';
import 'package:syncrow_app/features/devices/bloc/smart_door_bloc/smart_door_state.dart';
import 'package:syncrow_app/features/devices/view/widgets/smart_door/repeat_widget.dart';
import 'package:syncrow_app/features/shared_widgets/default_container.dart';
import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart';
import 'package:syncrow_app/features/shared_widgets/door_lock_button.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_medium.dart';
import 'package:syncrow_app/utils/helpers/snack_bar.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
import 'package:syncrow_app/utils/resource_manager/font_manager.dart';

class OfflineOneTimePasswordPage extends StatelessWidget {
  final String? deviceId;
  final String? type;
  const OfflineOneTimePasswordPage({super.key, this.deviceId, this.type});
  @override
  Widget build(BuildContext context) {
    bool isRepeat = false;
    bool generated = false;
    return BlocProvider(
        create: (BuildContext context) => SmartDoorBloc(deviceId: deviceId!),
        child: BlocConsumer<SmartDoorBloc, SmartDoorState>(listener: (context, state) {
          if (state is FailedState) {
            CustomSnackBar.displaySnackBar(state.errorMessage);
          }
          if (state is IsRepeatState) {
            isRepeat = state.repeat;
          }
          if (state is GeneratePasswordOneTimestate) {
            generated = state.generated;
          }
        }, builder: (context, state) {
          final smartDoorBloc = BlocProvider.of<SmartDoorBloc>(context);
          return DefaultScaffold(
            appBar: AppBar(
              backgroundColor: Colors.transparent,
              centerTitle: true,
              title: const BodyLarge(
                text: 'Create One-Time Password',
                fontColor: ColorsManager.primaryColor,
                fontWeight: FontsManager.bold,
              ),
              leading: IconButton(
                  onPressed: () {
                    Navigator.of(context).pop(true);
                  },
                  icon: const Icon(Icons.arrow_back)),
            ),
            child: state is LoadingInitialState
                ? const Center(child: CircularProgressIndicator())
                : SingleChildScrollView(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const BodyMedium(
                          text:
                              'Save the password immediately. The password is not displayed in the app.',
                          fontWeight: FontWeight.normal,
                          fontColor: ColorsManager.grayColor,
                        ),
                        const SizedBox(
                          height: 20,
                        ),
                        const BodyMedium(
                          text: '7-Digit Password',
                          fontWeight: FontWeight.normal,
                          fontColor: ColorsManager.grayColor,
                        ),
                        DefaultContainer(
                          padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 15),
                          child: Column(
                            children: [
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                mainAxisSize: MainAxisSize.max,
                                children: [
                                  Flexible(
                                      child: Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: smartDoorBloc.passwordController.text.isEmpty
                                        ? List.generate(10, (index) {
                                            return const Padding(
                                              padding: EdgeInsets.symmetric(
                                                  horizontal: 4.0, vertical: 15),
                                              child: Icon(
                                                Icons.circle,
                                                size: 20.0,
                                                color: Colors.black,
                                              ),
                                            );
                                          })
                                        : [
                                            Expanded(
                                              child: Row(
                                                children: [
                                                  Expanded(
                                                    child: BodyLarge(
                                                      style: const TextStyle(
                                                          color: ColorsManager.primaryColor,
                                                          fontWeight: FontWeight.bold,
                                                          letterSpacing: 8.0,
                                                          fontSize: 25,
                                                          wordSpacing: 2),
                                                      textAlign: TextAlign.center,
                                                      text: smartDoorBloc.passwordController.text,
                                                      fontSize: 23,
                                                    ),
                                                  ),
                                                  IconButton(
                                                      onPressed: () async {
                                                        await Clipboard.setData(ClipboardData(
                                                            text: smartDoorBloc
                                                                .passwordController.text));
                                                      },
                                                      icon: const Icon(Icons.copy)),
                                                ],
                                              ),
                                            ),
                                          ],
                                  )),
                                  const SizedBox(
                                    width: 10,
                                  ),
                                ],
                              ),
                              if (smartDoorBloc.passwordController.text.isNotEmpty)
                                Column(
                                  children: [
                                    const Divider(
                                      color: ColorsManager.graysColor,
                                    ),
                                    Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Expanded(
                                          child: Container(
                                            padding: const EdgeInsets.all(10.0),
                                            child: const BodyMedium(
                                              text: 'Password Name',
                                              fontWeight: FontWeight.normal,
                                            ),
                                          ),
                                        ),
                                        SizedBox(
                                            width: MediaQuery.of(context).size.width / 2.6,
                                            child: TextFormField(
                                              controller: BlocProvider.of<SmartDoorBloc>(context)
                                                  .passwordNameController,
                                              decoration: const InputDecoration(
                                                  hintText: 'Enter The Name',
                                                  hintStyle: TextStyle(
                                                      fontSize: 14, color: ColorsManager.textGray)),
                                            )),
                                      ],
                                    ),
                                  ],
                                ),
                            ],
                          ),
                        ),
                        const SizedBox(
                          height: 20,
                        ),
                        const BodyMedium(
                          textAlign: TextAlign.center,
                          text:
                              'Save the password immediately. The password is not displayed in the app.',
                          fontWeight: FontWeight.normal,
                          fontColor: ColorsManager.grayColor,
                        ),

                        // NameTimeWidget(type:type!),
                        const SizedBox(
                          height: 20,
                        ),
                        Center(
                          child: SizedBox(
                            width: MediaQuery.of(context).size.width / 1.5,
                            child: DoorLockButton(
                              isDone: generated,
                              isLoading: smartDoorBloc.isSavingPassword,
                              borderRadius: 30,
                              backgroundColor: ColorsManager.primaryColor,
                              onPressed: () async {
                                if (generated == false) {
                                  smartDoorBloc
                                      .add(GenerateAndSavePasswordOneTimeEvent(context: context));
                                } else {
                                  if (smartDoorBloc.passwordNameController.text.isNotEmpty) {
                                    smartDoorBloc.add(RenamePasswordEvent());
                                  }
                                  Navigator.of(context).pop(true);
                                }
                              },
                              child: const BodyMedium(
                                text: 'Obtain Password',
                                fontWeight: FontWeight.bold,
                                fontColor: Colors.white,
                              ),
                            ),
                          ),
                        ),
                        const SizedBox(
                          height: 20,
                        ),
                        isRepeat ? const RepeatWidget() : const SizedBox(),
                        const SizedBox(
                          height: 40,
                        )
                      ],
                    ),
                  ),
          );
        }));
  }
}
