light switch

code refactor

lib/features/devices/bloc/lights/lights_cubit.dart

@@ -8,6 +8,11 @@ class LightsCubit extends Cubit<LightsState> {
 
   static LightsCubit get(context) => BlocProvider.of(context);
 
+  toggleLight(LightModel light) {
+    light.status != null ? light.status = !light.status! : light.status = true;
+    emit(LightToggled(light));
+  }
+
   int getBrightness(LightModel light) {
     return light.brightness.toInt();
   }

lib/features/devices/bloc/lights/lights_state.dart

@@ -19,3 +19,9 @@ class LightBrightnessChanged extends LightsState {
 
   LightBrightnessChanged(this.brightness);
 }
+
+class LightToggled extends LightsState {
+  final LightModel light;
+
+  LightToggled(this.light);
+}

lib/features/devices/view/widgets/devices_categories_view.dart

@@ -1,4 +1,6 @@
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
 import 'package:syncrow_app/features/devices/view/widgets/devices_mode_tab.dart';
 import 'package:syncrow_app/features/devices/view/widgets/switches.dart';
 import 'package:syncrow_app/features/shared_widgets/text_widgets/title_medium.dart';
@@ -15,6 +17,7 @@ class DevicesCategoriesView extends StatelessWidget {
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
         Expanded(
+          flex: 3,
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
@@ -30,7 +33,7 @@ class DevicesCategoriesView extends StatelessWidget {
           ),
         ),
         Expanded(
-          flex: 3,
+          flex: 11,
           child: SingleChildScrollView(
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,

lib/features/devices/view/widgets/devices_view_body.dart

@@ -9,10 +9,6 @@ import '../../bloc/devices_cubit.dart';
 import 'switches.dart';
 
 class DevicesViewBody extends StatelessWidget {
-  const DevicesViewBody({
-    super.key,
-  });
-
   @override
   Widget build(BuildContext context) {
     return BlocProvider(
@@ -24,10 +20,12 @@ class DevicesViewBody extends StatelessWidget {
           return state is DevicesLoading
               ? const Center(child: CircularProgressIndicator())
               : Column(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                   children: [
                     SizedBox(
                       width: MediaQuery.sizeOf(context).width,
-                      height: MediaQuery.sizeOf(context).height - 252,
+                      height: MediaQuery.sizeOf(context).height -
+                          MediaQuery.sizeOf(context).height * .3,
                       child: PageView(
                         controller: pageController,
                         children: const [
@@ -112,11 +110,25 @@ class DevicesViewBody extends StatelessWidget {
                     SmoothPageIndicator(
                         controller: pageController,
                         count: 3,
-                        effect: const WormEffect()),
+                        effect: const WormEffect(
+                          dotHeight: 8,
+                          dotWidth: 8,
+                        ),
+                        onDotClicked: (index) {
+                          pageController.animateToPage(
+                            index,
+                            duration: const Duration(milliseconds: 300),
+                            curve: Curves.ease,
+                          );
+                        }),
                   ],
                 );
         },
       ),
     );
   }
+
+  const DevicesViewBody({
+    super.key,
+  });
 }

lib/features/devices/view/widgets/lights/light_brightness.dart

@@ -33,7 +33,7 @@ class LightBrightness extends StatelessWidget {
               ),
               AnimatedPositioned(
                 left: 0,
-                duration: const Duration(milliseconds: 50),
+                duration: const Duration(milliseconds: 0),
                 child: Container(
                   height: 60,
                   width: (MediaQuery.of(context).size.width - 30) *

lib/features/devices/view/widgets/lights/light_interface.dart

@@ -1,8 +1,13 @@
-import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter/widgets.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_app/features/devices/bloc/lights/lights_cubit.dart';
 import 'package:syncrow_app/features/devices/model/light_model.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 'package:syncrow_app/utils/resource_manager/strings_manager.dart';
+
+import '../../../../shared_widgets/default_container.dart';
 
 class LightInterface extends StatelessWidget {
   const LightInterface({super.key, required this.light});
@@ -11,34 +16,84 @@ class LightInterface extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    return BlocBuilder<LightsCubit, LightsState>(
+      builder: (context, state) {
         return SingleChildScrollView(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.stretch,
             children: [
-          const SizedBox(height: 20),
+              const SizedBox(height: 70),
               Container(
                 constraints: const BoxConstraints(
                   maxHeight: 65,
                 ),
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                margin:
-            child: const DefaultContainer(child: SizedBox.expand()),
+                    const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                child: DefaultContainer(
+                    child: SizedBox.expand(
+                  child: Padding(
+                    padding: const EdgeInsets.symmetric(horizontal: 15),
+                    child: Row(
+                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      children: [
+                        BodyLarge(
+                          text: light.status ?? false
+                              ? StringsManager.on
+                              : StringsManager.off,
+                          style: context.bodyLarge
+                              .copyWith(color: Colors.grey, fontSize: 24),
                         ),
                         Container(
-            constraints: const BoxConstraints(
+                          width: 35,
+                          decoration: ShapeDecoration(
+                            color: light.status ?? false
+                                ? ColorsManager.primaryWithOpacity
+                                : Colors.grey,
+                            shape: const CircleBorder(),
+                          ),
+                          child: Center(
+                            child: IconButton(
+                              style: ButtonStyle(
+                                padding: MaterialStateProperty.all(
+                                  const EdgeInsets.all(0),
+                                ),
+                                iconSize: MaterialStateProperty.all(25),
+                              ),
+                              onPressed: () {
+                                LightsCubit.get(context).toggleLight(light);
+                              },
+                              icon: const Icon(
+                                Icons.power_settings_new,
+                                color: Colors.white,
+                              ),
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                )),
+              ),
+              const DefaultContainer(
+                boxConstraints: BoxConstraints(
                   maxHeight: 310,
                 ),
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-            child: const SizedBox.expand(),
+                child: SizedBox.expand(
+                  child: Center(child: Text("Light Controls")),
                 ),
-          Container(
+              ),
-            constraints: const BoxConstraints(
+              const DefaultContainer(
+                boxConstraints: BoxConstraints(
                   maxHeight: 65,
                 ),
-            margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
+                margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
-            child: const SizedBox.expand(),
+                child: Center(child: Text("Timer")),
               ),
             ],
           ),
         );
+      },
+    );
   }
 }

lib/features/devices/view/widgets/lights/lights_view.dart

@@ -19,7 +19,9 @@ class LightsView extends StatelessWidget {
   Widget build(BuildContext context) {
     return BlocProvider(
       create: (context) => LightsCubit(),
-      child: BlocBuilder<LightsCubit, LightsState>(
+      child: BlocBuilder<DevicesCubit, DevicesState>(
+        builder: (context, state) {
+          return BlocBuilder<LightsCubit, LightsState>(
             builder: (context, state) {
               LightModel? selectedLight;
               if (DevicesCubit.get(context).getSelectedDevice() is LightModel) {
@@ -64,6 +66,8 @@ class LightsView extends StatelessWidget {
                 ),
               );
             },
+          );
+        },
       ),
     );
   }

lib/features/shared_widgets/default_container.dart

@@ -7,12 +7,15 @@ class DefaultContainer extends StatelessWidget {
     this.height,
     this.width,
     this.color,
+    this.boxConstraints,
+    this.margin,
   });
 
   final double? height;
   final double? width;
   final Widget child;
-
+  final BoxConstraints? boxConstraints;
+  final EdgeInsets? margin;
   final Color? color;
 
   @override
@@ -20,6 +23,8 @@ class DefaultContainer extends StatelessWidget {
     return Container(
       height: height,
       width: width,
+      margin: margin,
+      constraints: boxConstraints,
       decoration: BoxDecoration(
         color: color ?? Colors.white,
         borderRadius: BorderRadius.circular(20),

lib/utils/resource_manager/color_manager.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 abstract class ColorsManager {
   static const Color textPrimaryColor = Color(0xFF5D5D5D);
   static const Color primaryColor = Color(0xFF0030CB);
+  static Color primaryWithOpacity = const Color(0xFF023DFE).withOpacity(0.6);
   static const Color onPrimaryColor = Colors.white;
   static const Color secondaryColor = Color(0xFF023DFE);
   static const Color onSecondaryColor = Color(0xFF023DFE);