import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/analytics/modules/analytics/blocs/analytics_devices/analytics_devices_bloc.dart';
import 'package:syncrow_web/pages/analytics/modules/energy_management/blocs/energy_consumption_per_device/energy_consumption_per_device_bloc.dart';
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/chart_title.dart';
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/energy_consumption_per_device_chart.dart';
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/energy_consumption_per_device_devices_list.dart';
import 'package:syncrow_web/pages/analytics/widgets/analytics_chart_empty_state_widget.dart';
import 'package:syncrow_web/pages/analytics/widgets/analytics_error_widget.dart';
import 'package:syncrow_web/pages/analytics/widgets/charts_loading_widget.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/style.dart';

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

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<EnergyConsumptionPerDeviceBloc,
        EnergyConsumptionPerDeviceState>(
      builder: (context, state) {
        return Container(
          decoration: subSectionContainerDecoration.copyWith(
            borderRadius: BorderRadius.circular(30),
          ),
          padding: const EdgeInsets.all(30),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              AnalyticsErrorWidget(state.errorMessage),
              Row(
                spacing: 32,
                children: [
                  if (state.status == EnergyConsumptionPerDeviceStatus.loading)
                    const ChartsLoadingWidget(isLoading: true),
                  const Expanded(
                    flex: 3,
                    child: FittedBox(
                      fit: BoxFit.scaleDown,
                      alignment: AlignmentDirectional.centerStart,
                      child: ChartTitle(
                        title: Text('Device energy consumed'),
                      ),
                    ),
                  ),
                  const Spacer(),
                  Expanded(
                    flex: 2,
                    child: EnergyConsumptionPerDeviceDevicesList(
                      chartData: state.chartData,
                      devices: context.watch<AnalyticsDevicesBloc>().state.devices,
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 20),
              const Divider(height: 0),
              const SizedBox(height: 20),
              Visibility(
                visible: state.chartData.isNotEmpty &&
                    state.chartData
                        .every((e) => e.energy.every((e) => e.value != 0)),
                replacement: AnalyticsChartEmptyStateWidget(
                  isLoading:
                      state.status == EnergyConsumptionPerDeviceStatus.loading,
                  isError: state.status == EnergyConsumptionPerDeviceStatus.failure,
                  isInitial:
                      state.status == EnergyConsumptionPerDeviceStatus.initial,
                  errorMessage: state.errorMessage,
                  iconPath: Assets.emptyEnergyManagementPerDevice,
                ),
                child: Expanded(
                  child: EnergyConsumptionPerDeviceChart(
                    chartData: state.chartData,
                  ),
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}
