Merge pull request #200 from SyncrowIOT/SP-1591-FE-Implement-Space-Level-Structure-Selection-and-Air-Quality-Device-Dropdown

Sp 1591 fe implement space level structure selection and air quality device dropdown

lib/pages/analytics/modules/air_quality/helpers/fetch_air_quality_data_helper.dart

@@ -0,0 +1,52 @@
+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/realtime_device_changes/realtime_device_changes_bloc.dart';
+import 'package:syncrow_web/pages/analytics/params/get_analytics_devices_param.dart';
+
+abstract final class FetchAirQualityDataHelper {
+  const FetchAirQualityDataHelper._();
+
+  static void loadAirQualityData(
+    BuildContext context, {
+    required String communityUuid,
+    required String spaceUuid,
+  }) {
+    loadAnalyticsDevices(
+      context,
+      communityUuid: communityUuid,
+      spaceUuid: spaceUuid,
+    );
+  }
+
+  static void clearAllData(BuildContext context) {
+    context.read<AnalyticsDevicesBloc>().add(
+          const ClearAnalyticsDeviceEvent(),
+        );
+    context.read<RealtimeDeviceChangesBloc>().add(
+          const RealtimeDeviceChangesClosed(),
+        );
+  }
+
+  static void loadAnalyticsDevices(
+    BuildContext context, {
+    required String communityUuid,
+    required String spaceUuid,
+  }) {
+    context.read<AnalyticsDevicesBloc>().add(
+          LoadAnalyticsDevicesEvent(
+            param: GetAnalyticsDevicesParam(
+              communityUuid: communityUuid,
+              spaceUuid: spaceUuid,
+              deviceTypes: ['AQI'],
+              requestType: AnalyticsDeviceRequestType.energyManagement,
+            ),
+            onSuccess: (device) {
+              context.read<RealtimeDeviceChangesBloc>()
+                ..add(const RealtimeDeviceChangesClosed())
+                ..add(RealtimeDeviceChangesStarted(device.uuid));
+            },
+          ),
+        );
+  }
+}

lib/pages/analytics/modules/air_quality/views/air_quality_view.dart

@@ -0,0 +1,63 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/pages/analytics/modules/air_quality/widgets/air_quality_end_side_widget.dart';
+
+class AirQualityView extends StatelessWidget {
+  const AirQualityView({super.key});
+
+  static const _padding = EdgeInsetsDirectional.all(32);
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final isMediumOrLess = constraints.maxWidth <= 900;
+        final height = MediaQuery.sizeOf(context).height;
+        if (isMediumOrLess) {
+          return SingleChildScrollView(
+            padding: _padding,
+            child: Column(
+              spacing: 32,
+              children: [
+                SizedBox(
+                  height: height * 1.2,
+                  child: const AirQualityEndSideWidget(),
+                ),
+                SizedBox(height: height * 0.5, child: const Placeholder()),
+                SizedBox(height: height * 0.5, child: const Placeholder()),
+              ],
+            ),
+          );
+        }
+
+        return SingleChildScrollView(
+          child: Container(
+            padding: _padding,
+            height: height,
+            child: const Column(
+              children: [
+                Expanded(
+                  child: Row(
+                    spacing: 32,
+                    children: [
+                      Expanded(
+                        flex: 2,
+                        child: Column(
+                          spacing: 20,
+                          children: [
+                            Expanded(child: Placeholder()),
+                            Expanded(child: Placeholder()),
+                          ],
+                        ),
+                      ),
+                      Expanded(child: AirQualityEndSideWidget()),
+                    ],
+                  ),
+                ),
+              ],
+            ),
+          ),
+        );
+      },
+    );
+  }
+}

lib/pages/analytics/modules/air_quality/widgets/air_quality_end_side_widget.dart

@@ -0,0 +1,88 @@
+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/helpers/fetch_energy_management_data_helper.dart';
+import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/analytics_device_dropdown.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+import 'package:syncrow_web/utils/extension/build_context_x.dart';
+import 'package:syncrow_web/utils/style.dart';
+
+class AirQualityEndSideWidget extends StatelessWidget {
+  const AirQualityEndSideWidget({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      decoration: subSectionContainerDecoration.copyWith(
+        borderRadius: BorderRadius.circular(30),
+      ),
+      padding: const EdgeInsetsDirectional.all(32),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          _buildHeader(context),
+          Text(
+            'Device ID:',
+            style: context.textTheme.bodySmall?.copyWith(
+              color: ColorsManager.textPrimaryColor,
+              fontWeight: FontWeight.w400,
+              fontSize: 12,
+            ),
+          ),
+          const SizedBox(height: 6),
+          SelectableText(
+            context.watch<AnalyticsDevicesBloc>().state.selectedDevice?.uuid ??
+                'N/A',
+            style: context.textTheme.bodySmall?.copyWith(
+              color: ColorsManager.blackColor,
+              fontWeight: FontWeight.w400,
+              fontSize: 12,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildHeader(BuildContext context) {
+    return Row(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        Expanded(
+          flex: 3,
+          child: FittedBox(
+            fit: BoxFit.scaleDown,
+            alignment: AlignmentDirectional.centerStart,
+            child: SelectableText(
+              'AQI Sensor',
+              style: context.textTheme.headlineSmall?.copyWith(
+                fontWeight: FontWeight.w700,
+                color: ColorsManager.vividBlue.withValues(alpha: 0.6),
+                fontSize: 18,
+              ),
+            ),
+          ),
+        ),
+        const Spacer(),
+        Expanded(
+          flex: 2,
+          child: FittedBox(
+            fit: BoxFit.scaleDown,
+            alignment: AlignmentDirectional.centerEnd,
+            child: AnalyticsDeviceDropdown(
+              onChanged: (value) {
+                context.read<AnalyticsDevicesBloc>().add(
+                      SelectAnalyticsDeviceEvent(value),
+                    );
+                FetchEnergyManagementDataHelper.loadRealtimeDeviceChanges(
+                  context,
+                  deviceUuid: value.uuid,
+                );
+              },
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}

lib/pages/analytics/modules/analytics/enums/analytics_page_tab.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:syncrow_web/pages/analytics/modules/air_quality/views/air_quality_view.dart';
 import 'package:syncrow_web/pages/analytics/modules/energy_management/views/analytics_energy_management_view.dart';
 import 'package:syncrow_web/pages/analytics/modules/occupancy/views/analytics_occupancy_view.dart';
 
@@ -10,6 +11,10 @@ enum AnalyticsPageTab {
   occupancy(
     title: 'Occupancy',
     child: AnalyticsOccupancyView(),
+  ),
+  airQuality(
+    title: 'Air Quality',
+    child: AirQualityView(),
   );
 
   const AnalyticsPageTab({

lib/pages/analytics/modules/analytics/strategies/air_quality_data_loading_strategy.dart

@@ -0,0 +1,59 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_web/pages/analytics/modules/air_quality/helpers/fetch_air_quality_data_helper.dart';
+import 'package:syncrow_web/pages/analytics/modules/analytics/strategies/analytics_data_loading_strategy.dart';
+import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
+import 'package:syncrow_web/pages/space_tree/bloc/space_tree_event.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
+
+final class AirQualityDataLoadingStrategy implements AnalyticsDataLoadingStrategy {
+  @override
+  void onCommunitySelected(
+    BuildContext context,
+    CommunityModel community,
+    List<SpaceModel> spaces,
+  ) {
+    // Do nothing
+  }
+
+  @override
+  void onSpaceSelected(
+    BuildContext context,
+    CommunityModel community,
+    SpaceModel space,
+  ) {
+    final spaceTreeBloc = context.read<SpaceTreeBloc>();
+    final isSpaceSelected = spaceTreeBloc.state.selectedSpaces.contains(space.uuid);
+
+    if (isSpaceSelected) {
+      clearData(context);
+      return;
+    }
+
+    spaceTreeBloc
+      ..add(const SpaceTreeClearSelectionEvent())
+      ..add(OnSpaceSelected(community, space.uuid ?? '', []));
+
+    FetchAirQualityDataHelper.loadAirQualityData(
+      context,
+      communityUuid: community.uuid,
+      spaceUuid: space.uuid ?? '',
+    );
+  }
+
+  @override
+  void onChildSpaceSelected(
+    BuildContext context,
+    CommunityModel community,
+    SpaceModel child,
+  ) {
+    if (child.children.isNotEmpty) return onSpaceSelected(context, community, child);
+  }
+
+  @override
+  void clearData(BuildContext context) {
+    context.read<SpaceTreeBloc>().add(const SpaceTreeClearSelectionEvent());
+    FetchAirQualityDataHelper.clearAllData(context);
+  }
+}

lib/pages/analytics/modules/analytics/strategies/analytics_data_loading_strategy_factory.dart

@@ -1,4 +1,5 @@
 import 'package:syncrow_web/pages/analytics/modules/analytics/enums/analytics_page_tab.dart';
+import 'package:syncrow_web/pages/analytics/modules/analytics/strategies/air_quality_data_loading_strategy.dart';
 import 'package:syncrow_web/pages/analytics/modules/analytics/strategies/analytics_data_loading_strategy.dart';
 import 'package:syncrow_web/pages/analytics/modules/analytics/strategies/energy_management_data_loading_strategy.dart';
 import 'package:syncrow_web/pages/analytics/modules/analytics/strategies/occupancy_data_loading_strategy.dart';
@@ -9,6 +10,7 @@ abstract final class AnalyticsDataLoadingStrategyFactory {
     return switch (tab) {
       AnalyticsPageTab.energyManagement => EnergyManagementDataLoadingStrategy(),
       AnalyticsPageTab.occupancy => OccupancyDataLoadingStrategy(),
+      AnalyticsPageTab.airQuality => AirQualityDataLoadingStrategy(),
     };
   }
 }

lib/pages/analytics/modules/analytics/strategies/occupancy_data_loading_strategy.dart

@@ -48,7 +48,7 @@ class OccupancyDataLoadingStrategy implements AnalyticsDataLoadingStrategy {
     CommunityModel community,
     SpaceModel child,
   ) {
-    onSpaceSelected(context, community, child);
+    if (child.children.isNotEmpty) return onSpaceSelected(context, community, child);
   }
 
   @override

lib/pages/visitor_password/view/visitor_password_dialog.dart

@@ -38,7 +38,7 @@ class VisitorPasswordDialog extends StatelessWidget {
                         if (visitorBloc.passwordStatus!.failedOperations.isNotEmpty)
                           Column(
                             children: [
-                              const Text('Failed Devises'),
+                              const Text('Failed Devices'),
                               SizedBox(
                                 width: 200,
                                 height: 50,
@@ -63,7 +63,7 @@ class VisitorPasswordDialog extends StatelessWidget {
                         if (visitorBloc.passwordStatus!.successOperations.isNotEmpty)
                           Column(
                             children: [
-                              const Text('Success Devises'),
+                              const Text('Success Devices'),
                               SizedBox(
                                 width: 200,
                                 height: 50,