import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.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/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_large.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_medium.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_small.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';

class SettingInfoPage extends StatelessWidget {
  final DeviceModel? device;

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

  @override
  Widget build(BuildContext context) {
    return DefaultScaffold(
      title: 'Device Information',
      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: DefaultContainer(
                        child: Padding(
                      padding: const EdgeInsets.only(left: 5, right: 5),
                      child: Column(
                          mainAxisSize: MainAxisSize.min,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            const BodyLarge(
                              text: 'Virtual ID',
                              fontSize: 15,
                              fontWeight: FontWeight.w400,
                              fontColor: ColorsManager.blackColor,
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                SizedBox(
                                  width:
                                      MediaQuery.of(context).size.width * 0.61,
                                  child: BodySmall(
                                    text: _bloc.deviceInfo.productUuid,
                                    fontColor: ColorsManager.primaryTextColor,
                                  ),
                                ),
                                InkWell(
                                  onTap: () {
                                    Clipboard.setData(
                                      ClipboardData(
                                        text: _bloc.deviceInfo.productUuid,
                                      ),
                                    );

                                    ScaffoldMessenger.of(context).showSnackBar(
                                      const SnackBar(
                                        content: Text("Copied to Clipboard"),
                                      ),
                                    );
                                  },
                                  child: const Row(
                                    children: [
                                      Icon(
                                        Icons.copy,
                                        color: ColorsManager.blueColor,
                                      ),
                                      BodyMedium(
                                        text: 'Copy',
                                        fontColor: ColorsManager.blueColor,
                                      ),
                                    ],
                                  ),
                                )
                              ],
                            ),
                            const Divider(
                              color: ColorsManager.dividerColor,
                            ),
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                const BodyLarge(
                                  text: 'MAC',
                                  fontSize: 15,
                                  fontWeight: FontWeight.w400,
                                  fontColor: ColorsManager.blackColor,
                                ),
                                BodySmall(
                                  text: _bloc.deviceInfo.macAddress,
                                  fontColor: ColorsManager.primaryTextColor,
                                ),
                              ],
                            ),
                            const Divider(
                              color: ColorsManager.dividerColor,
                            ),
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                const BodyLarge(
                                  text: 'Time Zone',
                                  fontSize: 15,
                                  fontWeight: FontWeight.w400,
                                  fontColor: ColorsManager.blackColor,
                                ),
                                BodySmall(
                                  text: _bloc.deviceInfo.timeZone,
                                  fontColor: ColorsManager.primaryTextColor,
                                ),
                              ],
                            ),
                          ]),
                    )));
          },
        ),
      ),
    );
  }
}