Adjust layout in CommunityStructureCanvas by adding horizontal padding to positions and refining target position calculations for improved spacing and alignment. Enhance Stack widget behavior by allowing overflow clipping.

<!--
  Thanks for contributing!

Provide a description of your changes below and a general summary in the
title

Please look at the following checklist to ensure that your PR can be
accepted quickly:
-->

## Jira User Story
[SP-1686](https://syncrow.atlassian.net/browse/SP-1686)

## Description
Released the new space management rewritten version, which for now
includes, CRUD operations for spaces, and community tree with the new
API.

Rewrote main files, since they had a lot of code duplication, i
extracted duplicated code into one component for all flavors to use.

Enhanced routing solution, to make sure there's only one instance of the
router, as the documentation of `go_router` guides us to do.

## Type of Change

<!--- Put an `x` in all the boxes that apply: -->

- [x] ✨ New feature (non-breaking change which adds functionality)
- [ ] 🛠️ Bug fix (non-breaking change which fixes an issue)
- [ ] ❌ Breaking change (fix or feature that would cause existing
functionality to change)
- [x] 🧹 Code refactor
- [ ] ✅ Build configuration change
- [ ] 📝 Documentation
- [ ] 🗑️ Chore 


[SP-1686]:
https://syncrow.atlassian.net/browse/SP-1686?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

assets/images/4_sceen_switch.svg

@@ -1,9 +0,0 @@
-<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M38.0142 39.2553L35.3682 40H20.9308H19.9999H19.0691H1.24111C0.555643 40 0 39.4444 0 38.7589V1.24111C0 0.555643 0.555643 0 1.24111 0H19.0682H20.1226H20.9543H35.4255L38.2625 1.24111C38.9479 1.24111 39.5036 1.79675 39.5036 2.48221L39.2553 38.0142C39.2553 38.6997 38.6997 39.2553 38.0142 39.2553Z" fill="#E9E9E9"/>
-<path d="M38.7585 0H35.0352C35.7206 0 36.2763 0.555643 36.2763 1.24111V38.7589C36.2763 39.4444 35.7206 40 35.0352 40H38.7585C39.4439 40 39.9996 39.4444 39.9996 38.7589V1.24111C39.9996 0.555643 39.4439 0 38.7585 0Z" fill="#D1D1D1"/>
-<path opacity="0.6" d="M12.0283 31.8319V33.3212C12.0283 34.0067 11.6086 34.5623 11.0908 34.5623H6.96582C6.44804 34.5623 6.02832 34.0067 6.02832 33.3212V31.8319C6.02832 31.1465 6.44804 30.5908 6.96582 30.5908H11.0908C11.6086 30.5908 12.0283 31.1465 12.0283 31.8319Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M12.0283 7.24109V8.73042C12.0283 9.41588 11.6086 9.97153 11.0908 9.97153H6.96582C6.44804 9.97153 6.02832 9.41588 6.02832 8.73042V7.24109C6.02832 6.55563 6.44804 5.99998 6.96582 5.99998H11.0908C11.6086 5.99998 12.0283 6.55563 12.0283 7.24109Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M26.0283 31.8319V33.3212C26.0283 34.0067 26.448 34.5623 26.9658 34.5623H31.0908C31.6086 34.5623 32.0283 34.0067 32.0283 33.3212V31.8319C32.0283 31.1465 31.6086 30.5908 31.0908 30.5908H26.9658C26.448 30.5908 26.0283 31.1465 26.0283 31.8319Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M26.0283 7.24109V8.73042C26.0283 9.41588 26.448 9.97153 26.9658 9.97153H31.0908C31.6086 9.97153 32.0283 9.41588 32.0283 8.73042V7.24109C32.0283 6.55563 31.6086 5.99998 31.0908 5.99998H26.9658C26.448 5.99998 26.0283 6.55563 26.0283 7.24109Z" fill="#023DFE" fill-opacity="0.5"/>
-<path d="M19.0693 0H20.931V40H19.0693V0Z" fill="#D1D1D1"/>
-</svg>

assets/images/6_sceen_switch.svg

@@ -1,12 +0,0 @@
-<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M38.0142 39.2553L35.3682 40H20.9308H19.9999H19.0691H1.24111C0.555643 40 0 39.4444 0 38.7589V1.24111C0 0.555651 0.555643 7.62939e-06 1.24111 7.62939e-06H19.0682H20.1226H20.9543H35.4255L38.2625 1.24111C38.9479 1.24111 39.5036 1.79676 39.5036 2.48222L39.2553 38.0142C39.2553 38.6997 38.6997 39.2553 38.0142 39.2553Z" fill="#E9E9E9"/>
-<path d="M38.7585 0H35.0352C35.7206 0 36.2763 0.555643 36.2763 1.24111V38.7589C36.2763 39.4444 35.7206 40 35.0352 40H38.7585C39.4439 40 39.9996 39.4444 39.9996 38.7589V1.24111C39.9996 0.555643 39.4439 0 38.7585 0Z" fill="#D1D1D1"/>
-<path opacity="0.6" d="M8.64062 31.8319V33.3212C8.64062 34.0067 8.22091 34.5623 7.70312 34.5623H3.57813C3.06034 34.5623 2.64062 34.0067 2.64062 33.3212V31.8319C2.64062 31.1464 3.06034 30.5908 3.57813 30.5908H7.70312C8.22091 30.5908 8.64062 31.1464 8.64062 31.8319Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M8.64062 7.24109V8.73042C8.64062 9.41588 8.22091 9.97152 7.70312 9.97152H3.57813C3.06034 9.97152 2.64062 9.41588 2.64062 8.73042V7.24109C2.64062 6.55563 3.06034 5.99998 3.57813 5.99998H7.70312C8.22091 5.99998 8.64062 6.55563 8.64062 7.24109Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M27.6406 31.8319V33.3212C27.6406 34.0067 28.0603 34.5623 28.5781 34.5623H32.7031C33.2209 34.5623 33.6406 34.0067 33.6406 33.3212V31.8319C33.6406 31.1464 33.2209 30.5908 32.7031 30.5908H28.5781C28.0603 30.5908 27.6406 31.1464 27.6406 31.8319Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M27.6406 7.24109V8.73042C27.6406 9.41588 28.0603 9.97152 28.5781 9.97152H32.7031C33.2209 9.97152 33.6406 9.41588 33.6406 8.73042V7.24109C33.6406 6.55563 33.2209 5.99998 32.7031 5.99998H28.5781C28.0603 5.99998 27.6406 6.55563 27.6406 7.24109Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M15.0625 31.8319V33.3212C15.0625 34.0067 15.4822 34.5623 16 34.5623H20.125C20.6428 34.5623 21.0625 34.0067 21.0625 33.3212V31.8319C21.0625 31.1464 20.6428 30.5908 20.125 30.5908H16C15.4822 30.5908 15.0625 31.1464 15.0625 31.8319Z" fill="#023DFE" fill-opacity="0.5"/>
-<path opacity="0.6" d="M15.0625 7.24109V8.73042C15.0625 9.41588 15.4822 9.97152 16 9.97152H20.125C20.6428 9.97152 21.0625 9.41588 21.0625 8.73042V7.24109C21.0625 6.55563 20.6428 5.99998 20.125 5.99998H16C15.4822 5.99998 15.0625 6.55563 15.0625 7.24109Z" fill="#023DFE" fill-opacity="0.5"/>
-<path d="M23.125 0H24.9867V40H23.125V0Z" fill="#D1D1D1"/>
-<path d="M11.1719 0H13.0335V40H11.1719V0Z" fill="#D1D1D1"/>
-</svg>

lib/main.dart

@@ -1,22 +1,9 @@
 import 'package:firebase_core/firebase_core.dart';
-import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_dotenv/flutter_dotenv.dart';
-import 'package:go_router/go_router.dart';
 import 'package:syncrow_web/firebase_options.dart';
-import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_event.dart';
-import 'package:syncrow_web/pages/routines/bloc/create_routine_bloc/create_routine_bloc.dart';
-import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
-import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
-import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
 import 'package:syncrow_web/services/locator.dart';
-import 'package:syncrow_web/utils/app_routes.dart';
-import 'package:syncrow_web/utils/constants/routes_const.dart';
-import 'package:syncrow_web/utils/navigation_service.dart';
-import 'package:syncrow_web/utils/theme/theme.dart';
+import 'package:syncrow_web/syncrow_app.dart';
 
 Future<void> main() async {
   try {
@@ -33,59 +20,5 @@ Future<void> main() async {
     );
     initialSetup();
   } catch (_) {}
-  runApp(MyApp());
-}
-
-class MyApp extends StatelessWidget {
-  MyApp({super.key});
-
-  final GoRouter _router = GoRouter(
-    initialLocation: RoutesConst.auth,
-    routes: AppRoutes.getRoutes(),
-    redirect: (context, state) async {
-      final checkToken = await AuthBloc.getTokenAndValidate();
-      final loggedIn = checkToken == 'Success';
-      final goingToLogin = state.uri.toString() == RoutesConst.auth;
-
-      if (!loggedIn && !goingToLogin) return RoutesConst.auth;
-      if (loggedIn && goingToLogin) return RoutesConst.home;
-
-      return null;
-    },
-  );
-
-  @override
-  Widget build(BuildContext context) {
-    return MultiBlocProvider(
-        providers: [
-          BlocProvider<CreateRoutineBloc>(
-            create: (context) => CreateRoutineBloc(),
-          ),
-          BlocProvider(create: (context) => HomeBloc()..add(const FetchUserInfo())),
-          BlocProvider<VisitorPasswordBloc>(
-            create: (context) => VisitorPasswordBloc(),
-          ),
-          BlocProvider<RoutineBloc>(
-            create: (context) => RoutineBloc(),
-          ),
-          BlocProvider<SpaceTreeBloc>(
-            create: (context) => SpaceTreeBloc(),
-          ),
-        ],
-        child: MaterialApp.router(
-          debugShowCheckedModeBanner: false,
-          scrollBehavior: const MaterialScrollBehavior().copyWith(
-            dragDevices: {
-              PointerDeviceKind.mouse,
-              PointerDeviceKind.touch,
-              PointerDeviceKind.stylus,
-              PointerDeviceKind.unknown,
-            },
-          ),
-          key: NavigationService.navigatorKey,
-          // scaffoldMessengerKey: NavigationService.snackbarKey,
-          theme: myTheme,
-          routerConfig: _router,
-        ));
-  }
+  runApp(const SyncrowApp());
 }

lib/main_dev.dart

@@ -1,22 +1,9 @@
 import 'package:firebase_core/firebase_core.dart';
-import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_dotenv/flutter_dotenv.dart';
-import 'package:go_router/go_router.dart';
 import 'package:syncrow_web/firebase_options.dart';
-import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_event.dart';
-import 'package:syncrow_web/pages/routines/bloc/create_routine_bloc/create_routine_bloc.dart';
-import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
-import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
-import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
 import 'package:syncrow_web/services/locator.dart';
-import 'package:syncrow_web/utils/app_routes.dart';
-import 'package:syncrow_web/utils/constants/routes_const.dart';
-import 'package:syncrow_web/utils/navigation_service.dart';
-import 'package:syncrow_web/utils/theme/theme.dart';
+import 'package:syncrow_web/syncrow_app.dart';
 
 Future<void> main() async {
   try {
@@ -33,59 +20,5 @@ Future<void> main() async {
     );
     initialSetup();
   } catch (_) {}
-  runApp(MyApp());
-}
-
-class MyApp extends StatelessWidget {
-  MyApp({super.key});
-
-  final GoRouter _router = GoRouter(
-    initialLocation: RoutesConst.auth,
-    routes: AppRoutes.getRoutes(),
-    redirect: (context, state) async {
-      final checkToken = await AuthBloc.getTokenAndValidate();
-      final loggedIn = checkToken == 'Success';
-      final goingToLogin = state.uri.toString() == RoutesConst.auth;
-
-      if (!loggedIn && !goingToLogin) return RoutesConst.auth;
-      if (loggedIn && goingToLogin) return RoutesConst.home;
-
-      return null;
-    },
-  );
-
-  @override
-  Widget build(BuildContext context) {
-    return MultiBlocProvider(
-        providers: [
-          BlocProvider<CreateRoutineBloc>(
-            create: (context) => CreateRoutineBloc(),
-          ),
-          BlocProvider(create: (context) => HomeBloc()..add(const FetchUserInfo())),
-          BlocProvider<VisitorPasswordBloc>(
-            create: (context) => VisitorPasswordBloc(),
-          ),
-          BlocProvider<RoutineBloc>(
-            create: (context) => RoutineBloc(),
-          ),
-          BlocProvider<SpaceTreeBloc>(
-            create: (context) => SpaceTreeBloc(),
-          ),
-        ],
-        child: MaterialApp.router(
-          debugShowCheckedModeBanner: false,
-          scrollBehavior: const MaterialScrollBehavior().copyWith(
-            dragDevices: {
-              PointerDeviceKind.mouse,
-              PointerDeviceKind.touch,
-              PointerDeviceKind.stylus,
-              PointerDeviceKind.unknown,
-            },
-          ),
-          key: NavigationService.navigatorKey,
-          // scaffoldMessengerKey: NavigationService.snackbarKey,
-          theme: myTheme,
-          routerConfig: _router,
-        ));
-  }
+  runApp(const SyncrowApp());
 }

lib/main_staging.dart

@@ -1,26 +1,16 @@
 import 'package:firebase_core/firebase_core.dart';
-import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_dotenv/flutter_dotenv.dart';
-import 'package:go_router/go_router.dart';
 import 'package:syncrow_web/firebase_options.dart';
-import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
-import 'package:syncrow_web/pages/home/bloc/home_event.dart';
-import 'package:syncrow_web/pages/routines/bloc/create_routine_bloc/create_routine_bloc.dart';
-import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
-import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
-import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
 import 'package:syncrow_web/services/locator.dart';
-import 'package:syncrow_web/utils/app_routes.dart';
-import 'package:syncrow_web/utils/constants/routes_const.dart';
-import 'package:syncrow_web/utils/navigation_service.dart';
-import 'package:syncrow_web/utils/theme/theme.dart';
+import 'package:syncrow_web/syncrow_app.dart';
 
 Future<void> main() async {
   try {
-    const environment = String.fromEnvironment('FLAVOR', defaultValue: 'staging');
+    const environment = String.fromEnvironment(
+      'FLAVOR',
+      defaultValue: 'staging',
+    );
     await dotenv.load(fileName: '.env.$environment');
     WidgetsFlutterBinding.ensureInitialized();
     await Firebase.initializeApp(
@@ -30,59 +20,5 @@ Future<void> main() async {
     );
     initialSetup();
   } catch (_) {}
-  runApp(MyApp());
-}
-
-class MyApp extends StatelessWidget {
-  MyApp({super.key});
-
-  final GoRouter _router = GoRouter(
-    initialLocation: RoutesConst.auth,
-    routes: AppRoutes.getRoutes(),
-    redirect: (context, state) async {
-      final checkToken = await AuthBloc.getTokenAndValidate();
-      final loggedIn = checkToken == 'Success';
-      final goingToLogin = state.uri.toString() == RoutesConst.auth;
-
-      if (!loggedIn && !goingToLogin) return RoutesConst.auth;
-      if (loggedIn && goingToLogin) return RoutesConst.home;
-
-      return null;
-    },
-  );
-
-  @override
-  Widget build(BuildContext context) {
-    return MultiBlocProvider(
-        providers: [
-          BlocProvider<CreateRoutineBloc>(
-            create: (context) => CreateRoutineBloc(),
-          ),
-          BlocProvider(create: (context) => HomeBloc()..add(const FetchUserInfo())),
-          BlocProvider<VisitorPasswordBloc>(
-            create: (context) => VisitorPasswordBloc(),
-          ),
-          BlocProvider<RoutineBloc>(
-            create: (context) => RoutineBloc(),
-          ),
-          BlocProvider<SpaceTreeBloc>(
-            create: (context) => SpaceTreeBloc(),
-          ),
-        ],
-        child: MaterialApp.router(
-          debugShowCheckedModeBanner: false,
-          scrollBehavior: const MaterialScrollBehavior().copyWith(
-            dragDevices: {
-              PointerDeviceKind.mouse,
-              PointerDeviceKind.touch,
-              PointerDeviceKind.stylus,
-              PointerDeviceKind.unknown,
-            },
-          ),
-          key: NavigationService.navigatorKey,
-          // scaffoldMessengerKey: NavigationService.snackbarKey,
-          theme: myTheme,
-          routerConfig: _router,
-        ));
-  }
+  runApp(const SyncrowApp());
 }

lib/pages/device_managment/gateway/view/gateway_view.dart

@@ -100,7 +100,6 @@ class _DeviceItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    
     return DeviceControlsContainer(
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,

lib/pages/space_management_v2/main_module/views/space_management_page.dart

@@ -9,6 +9,8 @@ import 'package:syncrow_web/pages/space_management_v2/modules/communities/presen
 import 'package:syncrow_web/pages/space_management_v2/modules/communities/presentation/communities_tree_selection_bloc/communities_tree_selection_bloc.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/products/data/services/remote_products_service.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/products/presentation/bloc/products_bloc.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/data/services/remote_reorder_spaces_service.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/presentation/bloc/reorder_spaces_bloc.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/space_details/data/services/remote_space_details_service.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/space_details/data/services/unique_space_details_spaces_decorator_service.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/space_details/presentation/bloc/space_details_bloc.dart';
@@ -25,15 +27,16 @@ class SpaceManagementPage extends StatefulWidget {
 
 class _SpaceManagementPageState extends State<SpaceManagementPage> {
   late final CommunitiesBloc communitiesBloc;
+  late final HTTPService _httpService;
 
   @override
   void initState() {
+    _httpService = HTTPService();
     communitiesBloc = CommunitiesBloc(
       communitiesService: DebouncedCommunitiesService(
-        RemoteCommunitiesService(HTTPService()),
+        RemoteCommunitiesService(_httpService),
       ),
     )..add(const LoadCommunities(LoadCommunitiesParam()));
-
     super.initState();
   }
 
@@ -50,13 +53,18 @@ class _SpaceManagementPageState extends State<SpaceManagementPage> {
         BlocProvider(
           create: (context) => SpaceDetailsBloc(
             UniqueSpaceDetailsSpacesDecoratorService(
-              RemoteSpaceDetailsService(httpService: HTTPService()),
+              RemoteSpaceDetailsService(httpService: _httpService),
             ),
           ),
         ),
         BlocProvider(
           create: (context) => ProductsBloc(
-            RemoteProductsService(HTTPService()),
+            RemoteProductsService(_httpService),
+          ),
+        ),
+        BlocProvider(
+          create: (context) => ReorderSpacesBloc(
+            RemoteReorderSpacesService(_httpService),
           ),
         ),
       ],

lib/pages/space_management_v2/main_module/widgets/community_structure_canvas.dart

@@ -11,6 +11,8 @@ import 'package:syncrow_web/pages/space_management_v2/modules/communities/domain
 import 'package:syncrow_web/pages/space_management_v2/modules/communities/domain/models/space_model.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/communities/presentation/bloc/communities_bloc.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/communities/presentation/communities_tree_selection_bloc/communities_tree_selection_bloc.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/params/reorder_spaces_param.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/presentation/bloc/reorder_spaces_bloc.dart';
 import 'package:syncrow_web/pages/space_management_v2/modules/space_details/presentation/helpers/space_details_dialog_helper.dart';
 import 'package:syncrow_web/utils/extension/build_context_x.dart';
 
@@ -164,6 +166,16 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
     context.read<CommunitiesBloc>().add(
           CommunitiesUpdateCommunity(newCommunity),
         );
+
+    context.read<ReorderSpacesBloc>().add(
+          ReorderSpacesEvent(
+            ReorderSpacesParam(
+              communityUuid: widget.community.uuid,
+              parentSpaceUuid: data.parent?.uuid ?? '',
+              spaces: children,
+            ),
+          ),
+        );
   }
 
   void _onSpaceTapped(SpaceModel? space) {
@@ -245,6 +257,13 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
     final levelXOffset = <int, double>{};
     _calculateLayout(community.spaces, 0, levelXOffset);
 
+    const horizontalCanvasPadding = 100.0;
+    final originalPositions = Map.of(_positions);
+    _positions.clear();
+    for (final entry in originalPositions.entries) {
+      _positions[entry.key] = entry.value.translate(horizontalCanvasPadding, 0);
+    }
+
     final selectedSpace = widget.selectedSpace;
     final highlightedUuids = <String>{};
     if (selectedSpace != null) {
@@ -262,7 +281,7 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
       community: widget.community,
     );
 
-    final createButtonX = levelXOffset[0] ?? 0.0;
+    final createButtonX = (levelXOffset[0] ?? 0.0) + horizontalCanvasPadding;
     const createButtonY = 0.0;
 
     widgets.add(
@@ -294,10 +313,12 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
     CommunityModel? community,
     SpaceModel? parent,
   }) {
+    const targetWidth = 40.0;
+    final padding = (_horizontalSpacing - targetWidth) / 2;
     if (spaces.isNotEmpty) {
       final firstChildPos = _positions[spaces.first.uuid]!;
       final targetPos = Offset(
-        firstChildPos.dx - (_horizontalSpacing / 4),
+        firstChildPos.dx - padding - targetWidth,
         firstChildPos.dy,
       );
       widgets.add(_buildDropTarget(parent, community, 0, targetPos));
@@ -379,7 +400,7 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
       );
 
       final targetPos = Offset(
-        position.dx + cardWidth + (_horizontalSpacing / 4) - 20,
+        position.dx + cardWidth + padding,
         position.dy,
       );
       widgets.add(_buildDropTarget(parent, community, i + 1, targetPos));
@@ -414,24 +435,33 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
       child: DragTarget<SpaceReorderDataModel>(
         builder: (context, candidateData, rejectedData) {
           if (_draggedData == null) {
-            return const SizedBox();
+            return const SizedBox.shrink();
           }
 
-          final isTargetForDragged = (_draggedData?.parent?.uuid == parent?.uuid &&
-                  _draggedData?.community == null) ||
-              (_draggedData?.community?.uuid == community?.uuid &&
-                  _draggedData?.parent == null);
+          final children = parent?.children ?? community?.spaces ?? [];
+          final isSameParent = (_draggedData!.parent?.uuid == parent?.uuid &&
+                  _draggedData!.community == null) ||
+              (_draggedData!.community?.uuid == community?.uuid &&
+                  _draggedData!.parent == null);
 
-          if (!isTargetForDragged) {
-            return const SizedBox();
+          if (!isSameParent) {
+            return const SizedBox.shrink();
           }
 
-          return Container(
+          final oldIndex =
+              children.indexWhere((s) => s.uuid == _draggedData!.space.uuid);
+          if (oldIndex != -1 && (oldIndex == index || oldIndex == index - 1)) {
+            return const SizedBox.shrink();
+          }
+
+          return AnimatedContainer(
+            duration: const Duration(milliseconds: 150),
             width: 40,
+            alignment: Alignment.center,
             height: _cardHeight,
             decoration: BoxDecoration(
               color: context.theme.colorScheme.primary.withValues(
-                alpha: candidateData.isNotEmpty ? 0.7 : 0.3,
+                alpha: candidateData.isNotEmpty ? 0.9 : 0.3,
               ),
               borderRadius: BorderRadius.circular(8),
             ),
@@ -454,6 +484,9 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
 
           final oldIndex =
               children.indexWhere((s) => s.uuid == data.data.space.uuid);
+          if (oldIndex == -1) {
+            return true;
+          }
           if (oldIndex == index || oldIndex == index - 1) {
             return false;
           }
@@ -481,7 +514,7 @@ class _CommunityStructureCanvasState extends State<CommunityStructureCanvas>
         child: SizedBox(
           width: context.screenWidth * 5,
           height: context.screenHeight * 5,
-          child: Stack(children: treeWidgets),
+          child: Stack(clipBehavior: Clip.none, children: treeWidgets),
         ),
       ),
     );

lib/pages/space_management_v2/modules/reorder_spaces/data/services/remote_reorder_spaces_service.dart

@@ -0,0 +1,58 @@
+import 'package:dio/dio.dart';
+import 'package:syncrow_web/pages/common/bloc/project_manager.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/params/reorder_spaces_param.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/services/reorder_spaces_service.dart';
+import 'package:syncrow_web/services/api/api_exception.dart';
+import 'package:syncrow_web/services/api/http_service.dart';
+import 'package:syncrow_web/utils/constants/api_const.dart';
+
+final class RemoteReorderSpacesService implements ReorderSpacesService {
+  RemoteReorderSpacesService(this._httpClient);
+
+  final HTTPService _httpClient;
+
+  @override
+  Future<void> reorderSpaces(ReorderSpacesParam param) async {
+    try {
+      await _httpClient.post(
+        path: await _makeUrl(param),
+        body: param.toJson(),
+        expectedResponseModel: (json) => json,
+      );
+    } on DioException catch (e) {
+      final message = e.response?.data as Map<String, dynamic>?;
+      throw APIException(_getErrorMessageFromBody(message));
+    } catch (e) {
+      throw APIException(e.toString());
+    }
+  }
+
+  String _getErrorMessageFromBody(Map<String, dynamic>? body) {
+    if (body == null) return 'Failed to delete space';
+    final error = body['error'] as Map<String, dynamic>?;
+    final errorMessage = error?['message'] as String? ?? '';
+    return errorMessage;
+  }
+
+  Future<String> _makeUrl(ReorderSpacesParam param) async {
+    final projectUuid = await ProjectManager.getProjectUUID();
+    final communityUuid = param.communityUuid;
+
+    if (projectUuid == null || projectUuid.isEmpty) {
+      throw APIException('Project UUID is not set');
+    }
+
+    if (communityUuid.isEmpty) {
+      throw APIException('Community UUID is not set');
+    }
+
+    if (param.parentSpaceUuid.isEmpty) {
+      throw APIException('Parent Space UUID is not set');
+    }
+
+    return ApiEndpoints.reorderSpaces
+        .replaceAll('{projectUuid}', projectUuid)
+        .replaceAll('{communityUuid}', communityUuid)
+        .replaceAll('{parentSpaceUuid}', param.parentSpaceUuid);
+  }
+}

lib/pages/space_management_v2/modules/reorder_spaces/domain/params/reorder_spaces_param.dart

@@ -0,0 +1,21 @@
+import 'package:equatable/equatable.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/communities/domain/models/space_model.dart';
+
+class ReorderSpacesParam extends Equatable {
+  const ReorderSpacesParam({
+    required this.communityUuid,
+    required this.parentSpaceUuid,
+    required this.spaces,
+  });
+
+  final String communityUuid;
+  final String parentSpaceUuid;
+  final List<SpaceModel> spaces;
+
+  @override
+  List<Object?> get props => [spaces, communityUuid, parentSpaceUuid];
+
+  Map<String, dynamic> toJson() => {
+        'spacesUuids': spaces.map((space) => space.uuid).toList(),
+      };
+}

lib/pages/space_management_v2/modules/reorder_spaces/domain/services/reorder_spaces_service.dart

@@ -0,0 +1,5 @@
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/params/reorder_spaces_param.dart';
+
+abstract interface class ReorderSpacesService {
+  Future<void> reorderSpaces(ReorderSpacesParam param);
+}

lib/pages/space_management_v2/modules/reorder_spaces/presentation/bloc/reorder_spaces_bloc.dart

@@ -0,0 +1,35 @@
+import 'package:bloc/bloc.dart';
+import 'package:equatable/equatable.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/params/reorder_spaces_param.dart';
+import 'package:syncrow_web/pages/space_management_v2/modules/reorder_spaces/domain/services/reorder_spaces_service.dart';
+import 'package:syncrow_web/services/api/api_exception.dart';
+
+part 'reorder_spaces_event.dart';
+part 'reorder_spaces_state.dart';
+
+class ReorderSpacesBloc extends Bloc<ReorderSpacesEvent, ReorderSpacesState> {
+  ReorderSpacesBloc(
+    this._reorderSpacesService,
+  ) : super(const ReorderSpacesInitial()) {
+    on<ReorderSpacesEvent>(_onReorderSpacesEvent);
+  }
+
+  final ReorderSpacesService _reorderSpacesService;
+
+  Future<void> _onReorderSpacesEvent(
+    ReorderSpacesEvent event,
+    Emitter<ReorderSpacesState> emit,
+  ) async {
+    emit(const ReorderSpacesLoading());
+    try {
+      await _reorderSpacesService.reorderSpaces(event.param);
+      emit(const ReorderSpacesSuccess());
+    } on APIException catch (e) {
+      emit(ReorderSpacesFailure(e.message));
+    } catch (e) {
+      emit(ReorderSpacesFailure(e.toString()));
+    } finally {
+      emit(const ReorderSpacesInitial());
+    }
+  }
+}

lib/pages/space_management_v2/modules/reorder_spaces/presentation/bloc/reorder_spaces_event.dart

@@ -0,0 +1,10 @@
+part of 'reorder_spaces_bloc.dart';
+
+final class ReorderSpacesEvent extends Equatable {
+  const ReorderSpacesEvent(this.param);
+
+  final ReorderSpacesParam param;
+
+  @override
+  List<Object> get props => [param];
+}

lib/pages/space_management_v2/modules/reorder_spaces/presentation/bloc/reorder_spaces_state.dart

@@ -0,0 +1,29 @@
+part of 'reorder_spaces_bloc.dart';
+
+sealed class ReorderSpacesState extends Equatable {
+  const ReorderSpacesState();
+
+  @override
+  List<Object> get props => [];
+}
+
+final class ReorderSpacesInitial extends ReorderSpacesState {
+  const ReorderSpacesInitial();
+}
+
+final class ReorderSpacesLoading extends ReorderSpacesState {
+  const ReorderSpacesLoading();
+}
+
+final class ReorderSpacesSuccess extends ReorderSpacesState {
+  const ReorderSpacesSuccess();
+}
+
+final class ReorderSpacesFailure extends ReorderSpacesState {
+  const ReorderSpacesFailure(this.errorMessage);
+
+  final String errorMessage;
+
+  @override
+  List<Object> get props => [errorMessage];
+}

lib/pages/space_management_v2/modules/space_details/presentation/widgets/space_details_devices_box.dart

@@ -103,9 +103,7 @@ class SpaceDetailsDevicesBox extends StatelessWidget {
     ).then((resultSpace) {
       if (resultSpace != null) {
         if (context.mounted) {
-          context
-              .read<SpaceDetailsModelBloc>()
-              .add(UpdateSpaceDetails(resultSpace));
+          context.read<SpaceDetailsModelBloc>().add(UpdateSpaceDetails(resultSpace));
         }
       }
     });
@@ -135,9 +133,6 @@ class SpaceDetailsDevicesBox extends StatelessWidget {
         DeviceType.ThreeTouch => Assets.gangSwitch,
         DeviceType.NCPS => Assets.sensors,
         DeviceType.PC => Assets.powerClamp,
-        DeviceType.fourSceen => Assets.fourSceenSwitch,
-        DeviceType.sixSceen => Assets.sixSceenSwitch,
-        DeviceType.SOS => Assets.sos,
         DeviceType.Other => Assets.blackLogo,
         null => Assets.blackLogo,
       };

lib/pages/visitor_password/model/device_model.dart

@@ -84,14 +84,6 @@ class DeviceModel {
       tempIcon = Assets.curtainIcon;
     } else if (type == DeviceType.Curtain) {
       tempIcon = Assets.curtainIcon;
-    } else if (type == DeviceType.fourSceen) {
-      tempIcon = Assets.fourSceenSwitch;
-    } else if (type == DeviceType.sixSceen) {
-      tempIcon = Assets.sixSceenSwitch;
-    } else if (type == DeviceType.SOS) {
-      tempIcon = Assets.sos;
-    } else if (type == DeviceType.NCPS) {
-      tempIcon = Assets.presenceSensor;
     } else {
       tempIcon = Assets.blackLogo;
     }

lib/services/locator.dart

@@ -4,9 +4,7 @@ import 'package:syncrow_web/services/api/http_interceptor.dart';
 import 'package:syncrow_web/services/api/http_service.dart';
 
 final GetIt serviceLocator = GetIt.instance;
-//setupLocator() // to search for dependency injection in flutter
-initialSetup() {
+void initialSetup() {
   serviceLocator.registerSingleton<HTTPInterceptor>(HTTPInterceptor());
-  //Base classes
   serviceLocator.registerSingleton<Dio>(HTTPService.setupDioClient());
 }

lib/syncrow_app.dart

@@ -0,0 +1,53 @@
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
+import 'package:syncrow_web/pages/home/bloc/home_event.dart';
+import 'package:syncrow_web/pages/routines/bloc/create_routine_bloc/create_routine_bloc.dart';
+import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
+import 'package:syncrow_web/pages/space_tree/bloc/space_tree_bloc.dart';
+import 'package:syncrow_web/pages/visitor_password/bloc/visitor_password_bloc.dart';
+import 'package:syncrow_web/utils/app_routes.dart';
+import 'package:syncrow_web/utils/navigation_service.dart';
+import 'package:syncrow_web/utils/theme/theme.dart';
+
+class SyncrowApp extends StatelessWidget {
+  const SyncrowApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiBlocProvider(
+      providers: [
+        BlocProvider<CreateRoutineBloc>(
+          create: (context) => CreateRoutineBloc(),
+        ),
+        BlocProvider(
+          create: (context) => HomeBloc()..add(const FetchUserInfo()),
+        ),
+        BlocProvider<VisitorPasswordBloc>(
+          create: (context) => VisitorPasswordBloc(),
+        ),
+        BlocProvider<RoutineBloc>(
+          create: (context) => RoutineBloc(),
+        ),
+        BlocProvider<SpaceTreeBloc>(
+          create: (context) => SpaceTreeBloc(),
+        ),
+      ],
+      child: MaterialApp.router(
+        debugShowCheckedModeBanner: false,
+        scrollBehavior: const MaterialScrollBehavior().copyWith(
+          dragDevices: {
+            PointerDeviceKind.mouse,
+            PointerDeviceKind.touch,
+            PointerDeviceKind.stylus,
+            PointerDeviceKind.unknown,
+          },
+        ),
+        key: NavigationService.navigatorKey,
+        theme: myTheme,
+        routerConfig: AppRoutes.router,
+      ),
+    );
+  }
+}

lib/utils/app_routes.dart

@@ -1,17 +1,31 @@
 import 'package:go_router/go_router.dart';
 import 'package:syncrow_web/pages/access_management/view/access_management.dart';
 import 'package:syncrow_web/pages/analytics/modules/analytics/views/analytics_page.dart';
+import 'package:syncrow_web/pages/auth/bloc/auth_bloc.dart';
 import 'package:syncrow_web/pages/auth/view/login_page.dart';
 import 'package:syncrow_web/pages/device_managment/all_devices/view/device_managment_page.dart';
 import 'package:syncrow_web/pages/home/view/home_page.dart';
 import 'package:syncrow_web/pages/roles_and_permission/view/roles_and_permission_page.dart';
-import 'package:syncrow_web/pages/spaces_management/all_spaces/view/spaces_management_page.dart';
+import 'package:syncrow_web/pages/space_management_v2/main_module/views/space_management_page.dart';
 import 'package:syncrow_web/pages/visitor_password/view/visitor_password_dialog.dart';
 import 'package:syncrow_web/utils/constants/routes_const.dart';
 
-class AppRoutes {
-  static List<GoRoute> getRoutes() {
-    return [
+abstract final class AppRoutes {
+  const AppRoutes._();
+
+  static final GoRouter router = GoRouter(
+    initialLocation: RoutesConst.auth,
+    redirect: (context, state) async {
+      final checkToken = await AuthBloc.getTokenAndValidate();
+      final loggedIn = checkToken == 'Success';
+      final goingToLogin = state.uri.toString() == RoutesConst.auth;
+
+      if (!loggedIn && !goingToLogin) return RoutesConst.auth;
+      if (loggedIn && goingToLogin) return RoutesConst.home;
+
+      return null;
+    },
+    routes: [
       GoRoute(
         path: RoutesConst.auth,
         builder: (context, state) => const LoginPage(),
@@ -43,6 +57,6 @@ class AppRoutes {
         name: 'analytics',
         builder: (context, state) => const AnalyticsPage(),
       ),
-    ];
-  }
+    ],
+  );
 }

lib/utils/constants/api_const.dart

@@ -41,6 +41,8 @@ abstract class ApiEndpoints {
       '/projects/{projectId}/communities/{communityId}/spaces/{spaceId}';
   static const String getSpaceHierarchy =
       '/projects/{projectId}/communities/{communityId}/spaces';
+  static const String reorderSpaces =
+      '/projects/{projectUuid}/communities/{communityUuid}/spaces/{parentSpaceUuid}/spaces/order';
 
 // Community Module
   static const String createCommunity = '/projects/{projectId}/communities';

lib/utils/constants/assets.dart

@@ -4,8 +4,6 @@ class Assets {
   static const String webBackground = 'assets/images/web_Background.svg';
   static const String webBackgroundPng = 'assets/images/web_Background.png';
   static const String blackLogo = 'assets/images/black-logo.png';
-  static const String fourSceenSwitch = 'assets/images/4_sceen_switch.svg';
-  static const String sixSceenSwitch = 'assets/images/6_sceen_switch.svg';
   static const String logo = 'assets/images/Logo.svg';
   static const String logoHorizontal = 'assets/images/logo_horizontal.png';
   static const String vector = 'assets/images/Vector.png';

lib/utils/enum/device_types.dart

@@ -21,9 +21,6 @@ enum DeviceType {
   NCPS,
   DoorSensor,
   PC,
-  fourSceen,
-  sixSceen,
-  SOS,
   Other,
 }
 /*
@@ -66,7 +63,4 @@ Map<String, DeviceType> devicesTypesMap = {
   'WL': DeviceType.WaterLeak,
   'NCPS': DeviceType.NCPS,
   'PC': DeviceType.PC,
-  '4S': DeviceType.fourSceen,
-  '6S': DeviceType.sixSceen,
-  'SOS': DeviceType.SOS,
 };