mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
Added pagination and search logic in space tree
This commit is contained in:
@ -1,7 +1,10 @@
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:syncrow_web/pages/common/bloc/project_manager.dart';
|
||||
import 'package:syncrow_web/pages/space_tree/bloc/space_tree_event.dart';
|
||||
import 'package:syncrow_web/pages/space_tree/bloc/space_tree_state.dart';
|
||||
import 'package:syncrow_web/pages/space_tree/model/pagination_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/services/space_mana_api.dart';
|
||||
@ -18,7 +21,10 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
on<ClearCachedData>(_clearCachedData);
|
||||
on<OnCommunityAdded>(_onCommunityAdded);
|
||||
on<OnCommunityUpdated>(_onCommunityUpdate);
|
||||
on<PaginationEvent>(_fetchPaginationSpaces);
|
||||
on<DebouncedSearchEvent>(_onDebouncedSearch);
|
||||
}
|
||||
Timer _timer = Timer(const Duration(microseconds: 0), () {});
|
||||
|
||||
void _onCommunityUpdate(
|
||||
OnCommunityUpdated event,
|
||||
@ -37,7 +43,7 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
updatedCommunities[index] = updatedCommunity;
|
||||
emit(state.copyWith(communitiesList: updatedCommunities));
|
||||
} else {
|
||||
emit(SpaceTreeErrorState('Community not found in the list.'));
|
||||
emit(const SpaceTreeErrorState('Community not found in the list.'));
|
||||
}
|
||||
} catch (e) {
|
||||
emit(SpaceTreeErrorState('Error updating community: $e'));
|
||||
@ -49,8 +55,8 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
try {
|
||||
final projectUuid = await ProjectManager.getProjectUUID() ?? '';
|
||||
|
||||
List<CommunityModel> communities =
|
||||
await CommunitySpaceManagementApi().fetchCommunities(projectUuid, includeSpaces: true);
|
||||
PaginationModel paginationModel = await CommunitySpaceManagementApi()
|
||||
.fetchCommunitiesAndSpaces(projectId: projectUuid, page: 1);
|
||||
|
||||
// List<CommunityModel> updatedCommunities = await Future.wait(
|
||||
// communities.map((community) async {
|
||||
@ -69,12 +75,38 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
// }).toList(),
|
||||
// );
|
||||
|
||||
emit(state.copyWith(communitiesList: communities, expandedCommunity: [], expandedSpaces: []));
|
||||
emit(state.copyWith(
|
||||
communitiesList: paginationModel.communities,
|
||||
expandedCommunity: [],
|
||||
expandedSpaces: [],
|
||||
paginationModel: paginationModel));
|
||||
} catch (e) {
|
||||
emit(SpaceTreeErrorState('Error loading communities and spaces: $e'));
|
||||
}
|
||||
}
|
||||
|
||||
_fetchPaginationSpaces(PaginationEvent event, Emitter<SpaceTreeState> emit) async {
|
||||
emit(state.copyWith(paginationIsLoading: true));
|
||||
PaginationModel paginationModel = event.paginationModel;
|
||||
List<CommunityModel> communities = List<CommunityModel>.from(event.communities);
|
||||
try {
|
||||
if (paginationModel.hasNext && state.searchQuery.isEmpty) {
|
||||
final projectUuid = await ProjectManager.getProjectUUID() ?? '';
|
||||
|
||||
paginationModel = await CommunitySpaceManagementApi().fetchCommunitiesAndSpaces(
|
||||
projectId: projectUuid, page: paginationModel.pageNum, search: state.searchQuery);
|
||||
|
||||
communities.addAll(paginationModel.communities);
|
||||
}
|
||||
} catch (e) {
|
||||
emit(SpaceTreeErrorState('Error loading communities and spaces: $e'));
|
||||
}
|
||||
emit(state.copyWith(
|
||||
communitiesList: communities,
|
||||
paginationModel: paginationModel,
|
||||
paginationIsLoading: false));
|
||||
}
|
||||
|
||||
void _onCommunityAdded(OnCommunityAdded event, Emitter<SpaceTreeState> emit) async {
|
||||
final updatedCommunities = List<CommunityModel>.from(state.communityList);
|
||||
updatedCommunities.add(event.newCommunity);
|
||||
@ -264,28 +296,52 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
|
||||
_onSearch(SearchQueryEvent event, Emitter<SpaceTreeState> emit) async {
|
||||
try {
|
||||
List<CommunityModel> communities = List.from(state.communityList);
|
||||
List<CommunityModel> filteredCommunity = [];
|
||||
const duration = Duration(seconds: 1);
|
||||
if (_timer.isActive) {
|
||||
_timer.cancel(); // clear timer
|
||||
}
|
||||
_timer = Timer(duration, () async => add(DebouncedSearchEvent(event.searchQuery)));
|
||||
|
||||
// List<CommunityModel> communities = List.from(state.communityList);
|
||||
// List<CommunityModel> filteredCommunity = [];
|
||||
|
||||
// Filter communities and expand only those that match the query
|
||||
filteredCommunity = communities.where((community) {
|
||||
final containsQueryInCommunity =
|
||||
community.name.toLowerCase().contains(event.searchQuery.toLowerCase());
|
||||
final containsQueryInSpaces =
|
||||
community.spaces.any((space) => _containsQuery(space, event.searchQuery.toLowerCase()));
|
||||
// filteredCommunity = communities.where((community) {
|
||||
// final containsQueryInCommunity =
|
||||
// community.name.toLowerCase().contains(event.searchQuery.toLowerCase());
|
||||
// final containsQueryInSpaces =
|
||||
// community.spaces.any((space) => _containsQuery(space, event.searchQuery.toLowerCase()));
|
||||
|
||||
return containsQueryInCommunity || containsQueryInSpaces;
|
||||
}).toList();
|
||||
// return containsQueryInCommunity || containsQueryInSpaces;
|
||||
// }).toList();
|
||||
|
||||
emit(state.copyWith(
|
||||
filteredCommunity: filteredCommunity,
|
||||
isSearching: event.searchQuery.isNotEmpty,
|
||||
searchQuery: event.searchQuery));
|
||||
// emit(state.copyWith(
|
||||
// filteredCommunity: filteredCommunity,
|
||||
// isSearching: event.searchQuery.isNotEmpty,
|
||||
// searchQuery: event.searchQuery));
|
||||
} catch (e) {
|
||||
emit(const SpaceTreeErrorState('Something went wrong'));
|
||||
}
|
||||
}
|
||||
|
||||
_onDebouncedSearch(DebouncedSearchEvent event, Emitter<SpaceTreeState> emit) async {
|
||||
emit(state.copyWith(
|
||||
isSearching: true,
|
||||
));
|
||||
PaginationModel paginationModel = const PaginationModel.emptyConstructor();
|
||||
try {
|
||||
final projectUuid = await ProjectManager.getProjectUUID() ?? '';
|
||||
|
||||
paginationModel = await CommunitySpaceManagementApi()
|
||||
.fetchCommunitiesAndSpaces(projectId: projectUuid, page: 1, search: event.searchQuery);
|
||||
} catch (_) {}
|
||||
|
||||
emit(state.copyWith(
|
||||
filteredCommunity: paginationModel.communities,
|
||||
isSearching: false,
|
||||
searchQuery: event.searchQuery));
|
||||
}
|
||||
|
||||
_clearAllData(ClearAllData event, Emitter<SpaceTreeState> emit) async {
|
||||
try {
|
||||
emit(state.copyWith(
|
||||
@ -323,13 +379,13 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
}
|
||||
|
||||
// Helper function to determine if any space or its children match the search query
|
||||
bool _containsQuery(SpaceModel space, String query) {
|
||||
final matchesSpace = space.name.toLowerCase().contains(query);
|
||||
final matchesChildren =
|
||||
space.children.any((child) => _containsQuery(child, query)); // Recursive check for children
|
||||
// bool _containsQuery(SpaceModel space, String query) {
|
||||
// final matchesSpace = space.name.toLowerCase().contains(query);
|
||||
// final matchesChildren =
|
||||
// space.children.any((child) => _containsQuery(child, query)); // Recursive check for children
|
||||
|
||||
return matchesSpace || matchesChildren;
|
||||
}
|
||||
// return matchesSpace || matchesChildren;
|
||||
// }
|
||||
|
||||
List<String> _getAllChildIds(List<SpaceModel> spaces) {
|
||||
List<String> ids = [];
|
||||
@ -403,6 +459,7 @@ class SpaceTreeBloc extends Bloc<SpaceTreeEvent, SpaceTreeState> {
|
||||
|
||||
@override
|
||||
Future<void> close() async {
|
||||
_timer.cancel();
|
||||
super.close();
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import 'package:equatable/equatable.dart';
|
||||
import 'package:syncrow_web/pages/space_tree/model/pagination_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';
|
||||
|
||||
@ -11,6 +12,16 @@ class SpaceTreeEvent extends Equatable {
|
||||
|
||||
class InitialEvent extends SpaceTreeEvent {}
|
||||
|
||||
class PaginationEvent extends SpaceTreeEvent {
|
||||
final PaginationModel paginationModel;
|
||||
final List<CommunityModel> communities;
|
||||
|
||||
const PaginationEvent(this.paginationModel, this.communities);
|
||||
|
||||
@override
|
||||
List<Object> get props => [paginationModel, communities];
|
||||
}
|
||||
|
||||
class SearchForSpace extends SpaceTreeEvent {
|
||||
final String searchQuery;
|
||||
|
||||
@ -69,6 +80,15 @@ class SearchQueryEvent extends SpaceTreeEvent {
|
||||
List<Object> get props => [searchQuery];
|
||||
}
|
||||
|
||||
class DebouncedSearchEvent extends SpaceTreeEvent {
|
||||
final String searchQuery;
|
||||
|
||||
const DebouncedSearchEvent(this.searchQuery);
|
||||
|
||||
@override
|
||||
List<Object> get props => [searchQuery];
|
||||
}
|
||||
|
||||
class OnCommunityAdded extends SpaceTreeEvent {
|
||||
final CommunityModel newCommunity;
|
||||
const OnCommunityAdded(this.newCommunity);
|
||||
@ -85,7 +105,6 @@ class OnCommunityUpdated extends SpaceTreeEvent {
|
||||
List<Object> get props => [updatedCommunity];
|
||||
}
|
||||
|
||||
|
||||
class ClearAllData extends SpaceTreeEvent {}
|
||||
|
||||
class ClearCachedData extends SpaceTreeEvent {}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import 'package:equatable/equatable.dart';
|
||||
import 'package:syncrow_web/pages/space_tree/model/pagination_model.dart';
|
||||
import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
|
||||
|
||||
class SpaceTreeState extends Equatable {
|
||||
@ -12,6 +13,8 @@ class SpaceTreeState extends Equatable {
|
||||
final List<String> soldCheck;
|
||||
final bool isSearching;
|
||||
final String searchQuery;
|
||||
final PaginationModel paginationModel;
|
||||
final bool paginationIsLoading;
|
||||
|
||||
const SpaceTreeState(
|
||||
{this.communityList = const [],
|
||||
@ -23,7 +26,9 @@ class SpaceTreeState extends Equatable {
|
||||
this.soldCheck = const [],
|
||||
this.isSearching = false,
|
||||
this.selectedCommunityAndSpaces = const {},
|
||||
this.searchQuery = ''});
|
||||
this.searchQuery = '',
|
||||
this.paginationModel = const PaginationModel.emptyConstructor(),
|
||||
this.paginationIsLoading = false});
|
||||
|
||||
SpaceTreeState copyWith(
|
||||
{List<CommunityModel>? communitiesList,
|
||||
@ -35,7 +40,9 @@ class SpaceTreeState extends Equatable {
|
||||
List<String>? soldCheck,
|
||||
bool? isSearching,
|
||||
Map<String, List<String>>? selectedCommunityAndSpaces,
|
||||
String? searchQuery}) {
|
||||
String? searchQuery,
|
||||
PaginationModel? paginationModel,
|
||||
bool? paginationIsLoading}) {
|
||||
return SpaceTreeState(
|
||||
communityList: communitiesList ?? this.communityList,
|
||||
filteredCommunity: filteredCommunity ?? this.filteredCommunity,
|
||||
@ -46,7 +53,9 @@ class SpaceTreeState extends Equatable {
|
||||
soldCheck: soldCheck ?? this.soldCheck,
|
||||
isSearching: isSearching ?? this.isSearching,
|
||||
selectedCommunityAndSpaces: selectedCommunityAndSpaces ?? this.selectedCommunityAndSpaces,
|
||||
searchQuery: searchQuery ?? this.searchQuery);
|
||||
searchQuery: searchQuery ?? this.searchQuery,
|
||||
paginationModel: paginationModel ?? this.paginationModel,
|
||||
paginationIsLoading: paginationIsLoading ?? this.paginationIsLoading);
|
||||
}
|
||||
|
||||
@override
|
||||
@ -60,7 +69,9 @@ class SpaceTreeState extends Equatable {
|
||||
soldCheck,
|
||||
isSearching,
|
||||
selectedCommunityAndSpaces,
|
||||
searchQuery
|
||||
searchQuery,
|
||||
paginationModel,
|
||||
paginationIsLoading
|
||||
];
|
||||
}
|
||||
|
||||
|
20
lib/pages/space_tree/model/pagination_model.dart
Normal file
20
lib/pages/space_tree/model/pagination_model.dart
Normal file
@ -0,0 +1,20 @@
|
||||
import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
|
||||
|
||||
class PaginationModel {
|
||||
final int pageNum;
|
||||
final bool hasNext;
|
||||
final int size;
|
||||
final List<CommunityModel> communities;
|
||||
|
||||
const PaginationModel(
|
||||
{required this.pageNum,
|
||||
required this.hasNext,
|
||||
required this.size,
|
||||
required this.communities});
|
||||
|
||||
const PaginationModel.emptyConstructor()
|
||||
: pageNum = 1,
|
||||
hasNext = true,
|
||||
size = 10,
|
||||
communities = const [];
|
||||
}
|
@ -34,7 +34,8 @@ class _SpaceTreeViewState extends State<SpaceTreeView> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return BlocBuilder<SpaceTreeBloc, SpaceTreeState>(builder: (context, state) {
|
||||
List<CommunityModel> list = state.isSearching ? state.filteredCommunity : state.communityList;
|
||||
List<CommunityModel> list =
|
||||
state.searchQuery.isNotEmpty ? state.filteredCommunity : state.communityList;
|
||||
return Container(
|
||||
height: MediaQuery.sizeOf(context).height,
|
||||
decoration: widget.isSide == true
|
||||
@ -61,7 +62,8 @@ class _SpaceTreeViewState extends State<SpaceTreeView> {
|
||||
borderRadius: const BorderRadius.all(Radius.circular(20)),
|
||||
border: Border.all(color: ColorsManager.grayBorder)),
|
||||
child: TextFormField(
|
||||
style: const TextStyle(color: Colors.black),
|
||||
style: context.textTheme.bodyMedium
|
||||
?.copyWith(color: ColorsManager.blackColor),
|
||||
onChanged: (value) {
|
||||
context.read<SpaceTreeBloc>().add(SearchQueryEvent(value));
|
||||
},
|
||||
@ -94,88 +96,101 @@ class _SpaceTreeViewState extends State<SpaceTreeView> {
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Expanded(
|
||||
child: ListView(
|
||||
shrinkWrap: true,
|
||||
scrollDirection: Axis.horizontal,
|
||||
children: [
|
||||
Container(
|
||||
width: MediaQuery.sizeOf(context).width * 0.5,
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: list.isEmpty
|
||||
? Center(
|
||||
child: Text(
|
||||
'No results found',
|
||||
style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
||||
color: ColorsManager.lightGrayColor,
|
||||
fontWeight: FontWeight.w400,
|
||||
child: state.isSearching
|
||||
? const Center(child: CircularProgressIndicator())
|
||||
: ListView(
|
||||
shrinkWrap: true,
|
||||
scrollDirection: Axis.horizontal,
|
||||
children: [
|
||||
Container(
|
||||
width: MediaQuery.sizeOf(context).width * 0.5,
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: list.isEmpty
|
||||
? Center(
|
||||
child: Text(
|
||||
'No results found',
|
||||
style: Theme.of(context).textTheme.bodySmall!.copyWith(
|
||||
color: ColorsManager.lightGrayColor,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
: Scrollbar(
|
||||
scrollbarOrientation: ScrollbarOrientation.left,
|
||||
thumbVisibility: true,
|
||||
controller: _scrollController,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(left: 16),
|
||||
child: ListView(
|
||||
controller: _scrollController,
|
||||
shrinkWrap: true,
|
||||
children: list
|
||||
.map(
|
||||
(community) => CustomExpansionTileSpaceTree(
|
||||
title: community.name,
|
||||
isSelected: state.selectedCommunities
|
||||
.contains(community.uuid),
|
||||
isSoldCheck: state.selectedCommunities
|
||||
.contains(community.uuid),
|
||||
onExpansionChanged: () {
|
||||
context
|
||||
.read<SpaceTreeBloc>()
|
||||
.add(OnCommunityExpanded(community.uuid));
|
||||
},
|
||||
isExpanded: state.expandedCommunities
|
||||
.contains(community.uuid),
|
||||
onItemSelected: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnCommunitySelected(
|
||||
community.uuid, community.spaces));
|
||||
widget.onSelect();
|
||||
},
|
||||
children: community.spaces.map((space) {
|
||||
return CustomExpansionTileSpaceTree(
|
||||
title: space.name,
|
||||
isExpanded:
|
||||
state.expandedSpaces.contains(space.uuid),
|
||||
onItemSelected: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnSpaceSelected(community, space.uuid ?? '',
|
||||
space.children));
|
||||
widget.onSelect();
|
||||
},
|
||||
onExpansionChanged: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnSpaceExpanded(
|
||||
community.uuid, space.uuid ?? ''));
|
||||
},
|
||||
isSelected:
|
||||
state.selectedSpaces.contains(space.uuid) ||
|
||||
state.soldCheck.contains(space.uuid),
|
||||
isSoldCheck: state.soldCheck.contains(space.uuid),
|
||||
children: _buildNestedSpaces(
|
||||
context, state, space, community),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
: Scrollbar(
|
||||
scrollbarOrientation: ScrollbarOrientation.left,
|
||||
thumbVisibility: true,
|
||||
controller: _scrollController,
|
||||
child: NotificationListener(
|
||||
onNotification: (notification) {
|
||||
if (notification is ScrollEndNotification &&
|
||||
notification.metrics.extentAfter == 0) {
|
||||
// If the user has reached the end of the list Load more data
|
||||
context.read<SpaceTreeBloc>().add(PaginationEvent(
|
||||
state.paginationModel, state.communityList));
|
||||
}
|
||||
return false;
|
||||
},
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(left: 16),
|
||||
child: ListView.builder(
|
||||
shrinkWrap: true,
|
||||
itemCount: list.length,
|
||||
controller: _scrollController,
|
||||
itemBuilder: (context, index) {
|
||||
return CustomExpansionTileSpaceTree(
|
||||
title: list[index].name,
|
||||
isSelected: state.selectedCommunities
|
||||
.contains(list[index].uuid),
|
||||
isSoldCheck: state.selectedCommunities
|
||||
.contains(list[index].uuid),
|
||||
onExpansionChanged: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnCommunityExpanded(list[index].uuid));
|
||||
},
|
||||
isExpanded: state.expandedCommunities
|
||||
.contains(list[index].uuid),
|
||||
onItemSelected: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnCommunitySelected(list[index].uuid,
|
||||
list[index].spaces));
|
||||
widget.onSelect();
|
||||
},
|
||||
children: list[index].spaces.map((space) {
|
||||
return CustomExpansionTileSpaceTree(
|
||||
title: space.name,
|
||||
isExpanded: state.expandedSpaces
|
||||
.contains(space.uuid),
|
||||
onItemSelected: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnSpaceSelected(
|
||||
list[index],
|
||||
space.uuid ?? '',
|
||||
space.children));
|
||||
widget.onSelect();
|
||||
},
|
||||
onExpansionChanged: () {
|
||||
context.read<SpaceTreeBloc>().add(
|
||||
OnSpaceExpanded(list[index].uuid,
|
||||
space.uuid ?? ''));
|
||||
},
|
||||
isSelected: state.selectedSpaces
|
||||
.contains(space.uuid) ||
|
||||
state.soldCheck.contains(space.uuid),
|
||||
isSoldCheck:
|
||||
state.soldCheck.contains(space.uuid),
|
||||
children: _buildNestedSpaces(
|
||||
context, state, space, list[index]),
|
||||
);
|
||||
}).toList(),
|
||||
);
|
||||
}),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
if (state.paginationIsLoading) const CircularProgressIndicator(),
|
||||
// Expanded(
|
||||
// child: Padding(
|
||||
// padding: const EdgeInsets.all(8.0),
|
||||
|
Reference in New Issue
Block a user