Merge pull request #139 from SyncrowIOT/SP-1189-FE-Add-Button-Not-clickable-Opening-Pop-up-in-Community-Screen

Sp 1189 fe add button not clickable opening pop up in community screen
This commit is contained in:
Faris Armoush
2025-04-13 16:22:37 +03:00
committed by GitHub
3 changed files with 153 additions and 126 deletions

View File

@ -0,0 +1,51 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_bloc.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_event.dart';
import 'package:syncrow_web/pages/spaces_management/create_community/view/create_community_dialog.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
class SidebarAddCommunityButton extends StatelessWidget {
const SidebarAddCommunityButton({
required this.existingCommunityNames,
super.key,
});
final List<String> existingCommunityNames;
@override
Widget build(BuildContext context) {
return SizedBox.square(
dimension: 30,
child: IconButton(
style: IconButton.styleFrom(
iconSize: 20,
backgroundColor: ColorsManager.circleImageBackground,
shape: const CircleBorder(
side: BorderSide(
color: ColorsManager.lightGrayBorderColor,
width: 3,
),
),
),
onPressed: () => _showCreateCommunityDialog(context),
icon: SvgPicture.asset(Assets.addIcon),
),
);
}
void _showCreateCommunityDialog(BuildContext context) => showDialog<void>(
context: context,
builder: (context) => CreateCommunityDialog(
isEditMode: false,
existingCommunityNames: existingCommunityNames,
onCreateCommunity: (name, description) {
context.read<SpaceManagementBloc>().add(
CreateCommunityEvent(name, description, context),
);
},
),
);
}

View File

@ -0,0 +1,31 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/sidebar_add_community_button.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 SidebarHeader extends StatelessWidget {
const SidebarHeader({required this.existingCommunityNames, super.key});
final List<String> existingCommunityNames;
@override
Widget build(BuildContext context) {
return Container(
decoration: subSectionContainerDecoration,
padding: const EdgeInsets.all(16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Communities',
style: context.textTheme.titleMedium?.copyWith(
color: ColorsManager.blackColor,
),
),
SidebarAddCommunityButton(existingCommunityNames: existingCommunityNames),
],
),
);
}
}

View File

@ -1,17 +1,15 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/common/widgets/search_bar.dart'; import 'package:syncrow_web/common/widgets/search_bar.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_bloc.dart'; import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_bloc.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_event.dart'; import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_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/community_model.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart'; import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/community_tile.dart'; import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/community_tile.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/sidebar_header.dart';
import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/space_tile_widget.dart'; import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/space_tile_widget.dart';
import 'package:syncrow_web/pages/spaces_management/structure_selector/bloc/center_body_bloc.dart'; import 'package:syncrow_web/pages/spaces_management/structure_selector/bloc/center_body_bloc.dart';
import 'package:syncrow_web/pages/spaces_management/structure_selector/bloc/center_body_event.dart'; import 'package:syncrow_web/pages/spaces_management/structure_selector/bloc/center_body_event.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/style.dart'; import 'package:syncrow_web/utils/style.dart';
class SidebarWidget extends StatefulWidget { class SidebarWidget extends StatefulWidget {
@ -19,62 +17,59 @@ class SidebarWidget extends StatefulWidget {
final String? selectedSpaceUuid; final String? selectedSpaceUuid;
const SidebarWidget({ const SidebarWidget({
super.key,
required this.communities, required this.communities,
this.selectedSpaceUuid, this.selectedSpaceUuid,
super.key,
}); });
@override @override
_SidebarWidgetState createState() => _SidebarWidgetState(); State<SidebarWidget> createState() => _SidebarWidgetState();
} }
class _SidebarWidgetState extends State<SidebarWidget> { class _SidebarWidgetState extends State<SidebarWidget> {
String _searchQuery = ''; // Track search query String _searchQuery = '';
String? _selectedSpaceUuid; String? _selectedSpaceUuid;
String? _selectedId; String? _selectedId;
@override @override
void initState() { void initState() {
_selectedId = widget.selectedSpaceUuid;
super.initState(); super.initState();
_selectedId = widget.selectedSpaceUuid; // Initialize with the passed selected space UUID
} }
@override @override
void didUpdateWidget(covariant SidebarWidget oldWidget) { void didUpdateWidget(covariant SidebarWidget oldWidget) {
super.didUpdateWidget(oldWidget);
if (widget.selectedSpaceUuid != oldWidget.selectedSpaceUuid) { if (widget.selectedSpaceUuid != oldWidget.selectedSpaceUuid) {
setState(() { setState(() => _selectedId = widget.selectedSpaceUuid);
_selectedId = widget.selectedSpaceUuid;
});
} }
super.didUpdateWidget(oldWidget);
} }
// Function to filter communities based on the search query List<CommunityModel> _filteredCommunities() {
List<CommunityModel> _filterCommunities() {
if (_searchQuery.isEmpty) { if (_searchQuery.isEmpty) {
// Reset the selected community and space UUIDs if there's no query
_selectedSpaceUuid = null; _selectedSpaceUuid = null;
return widget.communities; return widget.communities;
} }
// Filter communities and expand only those that match the query
return widget.communities.where((community) { return widget.communities.where((community) {
final containsQueryInCommunity = final containsQueryInCommunity =
community.name.toLowerCase().contains(_searchQuery.toLowerCase()); community.name.toLowerCase().contains(_searchQuery.toLowerCase());
final containsQueryInSpaces = final containsQueryInSpaces = community.spaces.any((space) =>
community.spaces.any((space) => _containsQuery(space, _searchQuery.toLowerCase())); _containsQuery(space: space, query: _searchQuery.toLowerCase()));
return containsQueryInCommunity || containsQueryInSpaces; return containsQueryInCommunity || containsQueryInSpaces;
}).toList(); }).toList();
} }
// Helper function to determine if any space or its children match the search query bool _containsQuery({
bool _containsQuery(SpaceModel space, String query) { required SpaceModel space,
required String query,
}) {
final matchesSpace = space.name.toLowerCase().contains(query); final matchesSpace = space.name.toLowerCase().contains(query);
final matchesChildren = final matchesChildren = space.children.any(
space.children.any((child) => _containsQuery(child, query)); // Recursive check for children (child) => _containsQuery(space: child, query: query),
);
// If the space or any of its children match the query, expand this space
if (matchesSpace || matchesChildren) { if (matchesSpace || matchesChildren) {
_selectedSpaceUuid = space.uuid; _selectedSpaceUuid = space.uuid;
} }
@ -83,79 +78,35 @@ class _SidebarWidgetState extends State<SidebarWidget> {
} }
bool _isSpaceOrChildSelected(SpaceModel space) { bool _isSpaceOrChildSelected(SpaceModel space) {
// Return true if the current space or any of its child spaces is selected final isSpaceSelected = _selectedSpaceUuid == space.uuid;
if (_selectedSpaceUuid == space.uuid) { final anySubSpaceIsSelected = space.children.any(_isSpaceOrChildSelected);
return true; return isSpaceSelected || anySubSpaceIsSelected;
}
// Recursively check if any child spaces match the query
for (var child in space.children) {
if (_isSpaceOrChildSelected(child)) {
return true;
}
}
return false;
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final filteredCommunities = _filterCommunities(); final filteredCommunities = _filteredCommunities();
return Container( return Container(
width: 300, width: 300,
decoration: subSectionContainerDecoration, decoration: subSectionContainerDecoration,
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, // Ensures the Column only takes necessary height mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
// Communities title with the add button SidebarHeader(
Container( existingCommunityNames:
decoration: subSectionContainerDecoration, widget.communities.map((community) => community.name).toList(),
padding: const EdgeInsets.all(16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Communities',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: ColorsManager.blackColor,
)),
GestureDetector(
onTap: () => _navigateToBlank(context),
child: Container(
width: 30,
height: 30,
decoration: const BoxDecoration(
color: ColorsManager.whiteColors,
shape: BoxShape.circle,
),
child: Center(
child: SvgPicture.asset(
Assets.roundedAddIcon,
width: 24,
height: 24,
),
),
),
),
],
),
), ),
// Search bar
CustomSearchBar( CustomSearchBar(
onSearchChanged: (query) { onSearchChanged: (query) => setState(() => _searchQuery = query),
setState(() {
_searchQuery = query;
});
},
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
// Community list
Expanded( Expanded(
child: ListView( child: ListView(
children: filteredCommunities.map((community) { children: filteredCommunities
return _buildCommunityTile(context, community); .map((community) => _buildCommunityTile(context, community))
}).toList(), .toList(),
), ),
), ),
], ],
@ -163,18 +114,7 @@ class _SidebarWidgetState extends State<SidebarWidget> {
); );
} }
void _navigateToBlank(BuildContext context) {
setState(() {
_selectedId = '';
});
context.read<SpaceManagementBloc>().add(
NewCommunityEvent(communities: widget.communities),
);
}
Widget _buildCommunityTile(BuildContext context, CommunityModel community) { Widget _buildCommunityTile(BuildContext context, CommunityModel community) {
bool hasChildren = community.spaces.isNotEmpty;
return CommunityTile( return CommunityTile(
title: community.name, title: community.name,
key: ValueKey(community.uuid), key: ValueKey(community.uuid),
@ -183,7 +123,7 @@ class _SidebarWidgetState extends State<SidebarWidget> {
onItemSelected: () { onItemSelected: () {
setState(() { setState(() {
_selectedId = community.uuid; _selectedId = community.uuid;
_selectedSpaceUuid = null; // Update the selected community _selectedSpaceUuid = null;
}); });
context.read<CenterBodyBloc>().add(CommunitySelectedEvent()); context.read<CenterBodyBloc>().add(CommunitySelectedEvent());
@ -192,46 +132,51 @@ class _SidebarWidgetState extends State<SidebarWidget> {
SelectCommunityEvent(selectedCommunity: community), SelectCommunityEvent(selectedCommunity: community),
); );
}, },
onExpansionChanged: (String title, bool expanded) { onExpansionChanged: (title, expanded) {},
_handleExpansionChange(community.uuid, expanded); children: community.spaces
}, .where((space) {
children: hasChildren final isDeleted = space.status != SpaceStatus.deleted;
? community.spaces final isParentDeleted = space.status != SpaceStatus.parentDeleted;
.where((space) => (space.status != SpaceStatus.deleted || return (isDeleted || isParentDeleted);
space.status != SpaceStatus.parentDeleted)) })
.map((space) => _buildSpaceTile(space, community)) .map((space) => _buildSpaceTile(space: space, community: community))
.toList() .toList(),
: null,
); );
} }
Widget _buildSpaceTile(SpaceModel space, CommunityModel community, {int depth = 1}) { Widget _buildSpaceTile({
bool isExpandedSpace = _isSpaceOrChildSelected(space); required SpaceModel space,
required CommunityModel community,
}) {
final spaceIsExpanded = _isSpaceOrChildSelected(space);
final isSelected = _selectedId == space.uuid;
return Padding( return Padding(
padding: EdgeInsets.only(left: depth * 16.0), padding: const EdgeInsetsDirectional.only(start: 16.0),
child: SpaceTile( child: SpaceTile(
title: space.name, title: space.name,
key: ValueKey(space.uuid), key: ValueKey(space.uuid),
isSelected: _selectedId == space.uuid, isSelected: isSelected,
initiallyExpanded: isExpandedSpace, initiallyExpanded: spaceIsExpanded,
onExpansionChanged: (bool expanded) { onExpansionChanged: (expanded) {},
_handleExpansionChange(space.uuid ?? '', expanded); onItemSelected: () {
}, setState(() {
onItemSelected: () { _selectedId = space.uuid;
setState(() { _selectedSpaceUuid = space.uuid;
_selectedId = space.uuid; });
_selectedSpaceUuid = space.uuid;
});
context.read<SpaceManagementBloc>().add( context.read<SpaceManagementBloc>().add(
SelectSpaceEvent(selectedCommunity: community, selectedSpace: space), SelectSpaceEvent(selectedCommunity: community, selectedSpace: space),
); );
}, },
children: space.children.isNotEmpty children: space.children
? space.children.map((childSpace) => _buildSpaceTile(childSpace, community)).toList() .map(
: [], // Recursively render child spaces if available (childSpace) => _buildSpaceTile(
)); space: childSpace,
community: community,
),
)
.toList(),
),
);
} }
void _handleExpansionChange(String uuid, bool expanded) {}
} }