import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_app/features/app_layout/bloc/home_cubit.dart';
import 'package:syncrow_app/features/devices/bloc/device_settings_bloc/device_scene_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/device_settings_bloc/device_scene_event.dart';
import 'package:syncrow_app/features/devices/bloc/device_settings_bloc/device_scene_state.dart';
import 'package:syncrow_app/features/devices/model/device_model.dart';
import 'package:syncrow_app/features/devices/view/device_settings/location_setting.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/text_widgets/body_medium.dart';
import 'package:syncrow_app/generated/assets.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';

class SettingProfilePage extends StatelessWidget {
  final DeviceModel? device;

  const SettingProfilePage({super.key, this.device});

  @override
  Widget build(BuildContext context) {
    var spaces = HomeCubit.getInstance().spaces;

    return DefaultScaffold(
      title: 'Device Settings',
      leading: IconButton(
          onPressed: () {
            Navigator.of(context).pop(true);
          },
          icon: const Icon(Icons.arrow_back_ios)),
      child: BlocProvider(
        create: (context) => DeviceSettingBloc(deviceId: device?.uuid ?? '')
          ..add(const DeviceSettingInitial())
          ..add(const DeviceSettingInitialInfo()),
        child: BlocBuilder<DeviceSettingBloc, DeviceSettingState>(
          builder: (context, state) {
            final _bloc = BlocProvider.of<DeviceSettingBloc>(context);
            return state is DeviceSettingLoadingState
                ? const Center(
                    child: DefaultContainer(
                        width: 50,
                        height: 50,
                        child: CircularProgressIndicator()),
                  )
                : RefreshIndicator(
                    onRefresh: () async {
                      _bloc.add(const DeviceSettingInitial());
                    },
                    child: ListView(
                      children: [
                        CircleAvatar(
                          radius: device!.type != "SOS" ? 60 : 52,
                          backgroundColor: Colors.white,
                          child: device!.type == "SOS"
                              ? ClipOval(
                                  child: SvgPicture.asset(
                                  Assets.sosHomeIcon,
                                  fit: BoxFit.fitHeight,
                                  height:
                                      MediaQuery.of(context).size.height * 0.13,
                                ))
                              : CircleAvatar(
                                  radius: 55,
                                  backgroundColor: ColorsManager.graysColor,
                                  child: ClipOval(
                                    child: Column(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.center,
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      children: [
                                        Center(
                                          child: SvgPicture.asset(
                                            device!.type == "4S"
                                                ? Assets.fourSceneIcon
                                                : Assets.sixSceneIcon,
                                            fit: BoxFit.contain,
                                            height: MediaQuery.of(context)
                                                    .size
                                                    .height *
                                                0.08,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                        ),
                        const SizedBox(
                          height: 10,
                        ),
                        SizedBox(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              IntrinsicWidth(
                                child: ConstrainedBox(
                                  constraints:
                                      const BoxConstraints(maxWidth: 200),
                                  child: TextFormField(
                                    maxLength: 30,
                                    style: const TextStyle(
                                      color: Colors.black,
                                    ),
                                    textAlign: TextAlign.center,
                                    focusNode: _bloc.focusNode,
                                    controller: _bloc.nameController,
                                    enabled: _bloc.editName,
                                    onEditingComplete: () {
                                      _bloc.add(const SaveNameEvent());
                                    },
                                    decoration: const InputDecoration(
                                      hintText: "Your Name",
                                      border: InputBorder.none,
                                      fillColor: Colors.white10,
                                      counterText: '',
                                    ),
                                  ),
                                ),
                              ),
                              const SizedBox(width: 5),
                              InkWell(
                                onTap: () {
                                  _bloc.add(const ChangeNameEvent(value: true));
                                },
                                child: Padding(
                                  padding: EdgeInsets.symmetric(horizontal: 10),
                                  child: SvgPicture.asset(
                                    Assets.sosEditProfile,
                                    color: Colors.grey,
                                    fit: BoxFit.contain,
                                    height: MediaQuery.of(context).size.height *
                                        0.02,
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                        const SizedBox(height: 20),
                        const BodyMedium(
                          text: 'Smart Device Information',
                          fontWeight: FontWeight.w700,
                          fontSize: 12,
                          fontColor: ColorsManager.grayColor,
                        ),
                        const SizedBox(height: 7),
                        DefaultContainer(
                          padding: const EdgeInsets.all(20),
                          child: InkWell(
                            onTap: () async {
                              if (HomeCubit.visitorPasswordManagement) {
                                bool? val = await Navigator.of(context).push(
                                  MaterialPageRoute(
                                      builder: (context) => LocationSettingPage(
                                            space: spaces!.first,
                                            deviceId: device?.uuid ?? '',
                                          )),
                                );
                                if (val != null && val == true) {
                                  _bloc.add(const DeviceSettingInitialInfo());
                                }
                              }
                            },
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                const SizedBox(
                                  child: Text('Location'),
                                ),
                                Row(
                                  children: [
                                    SizedBox(
                                      child: BodyMedium(
                                        text: _bloc
                                            .deviceInfo.subspace.subspaceName,
                                        fontColor: ColorsManager.textGray,
                                      ),
                                    ),
                                    const Icon(
                                      Icons.arrow_forward_ios,
                                      size: 15,
                                      color: ColorsManager.textGray,
                                    ),
                                  ],
                                )
                              ],
                            ),
                          ),
                        )
                      ],
                    ),
                  );
          },
        ),
      ),
    );
  }
}