syncrow-app/lib/features/devices/view/widgets/lights/light_brightness.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/lights/lights_cubit.dart';
import 'package:syncrow_app/features/shared_widgets/default_container.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
import 'package:syncrow_app/utils/context_extension.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';

import '../../../model/light_model.dart';

class LightBrightness extends StatelessWidget {
  const LightBrightness({
    super.key,
    required this.light,
  });

  final LightModel light;

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<LightsCubit, LightsState>(
      builder: (context, state) {
        return GestureDetector(
          onHorizontalDragUpdate: (details) => LightsCubit.get(context)
              .onHorizontalDragUpdate(light, details.localPosition.dx,
                  MediaQuery.of(context).size.width - 15),
          child: Stack(
            alignment: Alignment.center,
            children: [
              const DefaultContainer(
                height: 60,
                child: SizedBox.expand(),
              ),
              AnimatedPositioned(
                left: 0,
                duration: const Duration(milliseconds: 50),
                child: Container(
                  height: 60,
                  width: (MediaQuery.of(context).size.width - 30) *
                      light.brightness /
                      100,
                  decoration: BoxDecoration(
                    color: ColorsManager.primaryColor.withOpacity(0.6),
                    borderRadius: light.brightness != 100
                        ? const BorderRadius.only(
                            topLeft: Radius.circular(20),
                            bottomLeft: Radius.circular(20),
                          )
                        : BorderRadius.circular(20),
                  ),
                ),
              ),
              BodyLarge(
                text: "${light.brightness}%",
                style: context.bodyLarge.copyWith(
                  color: Colors.black,
                  fontSize: 23,
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}