Basically, I am trying to fetch all comments through pagination and it's working nicely. But in case of reply, I am trying to fetch and show reply which comment has reply only and I am showing in listview builder. But problem is all reply is showing below every comment. I am leaving my code.
late bool isReplyBox = false;
final _numberOfCommentPerRequest = 5;
late List<ReplyTile> _replyList = [];
final PagingController<int, CommentModel> _pagingController =
PagingController(firstPageKey: 1);
Future<void> _fetchAllComments(int pageKey) async {
try {
final response = await getAllComments(widget.classId, pageKey);
late List<CommentModel> _commentList = [];
response['data']['results'].forEach((element) {
String userFName = element['creator_first_name'] ?? 'No Name';
String userLName = element['creator_last_name'];
String userName = "$userFName $userLName";
String userImage = element['avatar'] ?? '';
String commentMessage = element['comment'] ?? 'No comment';
int commentId = element['id'] ?? 0;
if(element['reply_comments'] != null){
setState(() {
isReplyBox = true;
});
var replyList = element['reply_comments'];
replyList.forEach((replyData) {
var replyMessage = replyData['comment'] ?? '';
String creatorFName = replyData['creator_first_name'] ?? 'No Name';
String creatorLName = replyData['creator_last_name'];
String creatorName = "$creatorFName $creatorLName";
String creatorImage = replyData['avatar'] ?? '';
setState(() {
_replyList.add(ReplyTile(
commentMessage: replyMessage,
userName: creatorName,
userImagePath: creatorImage));
});
});
}else{
_replyList;
print('No reply comments');
}
_commentList.add(CommentModel(commentId,userImage,userName,commentMessage));
});
final isLastPage = _commentList.length < _numberOfCommentPerRequest;
if (isLastPage) {
_pagingController.appendLastPage(_commentList);
} else {
final nextPageKey = pageKey + 1;
_pagingController.appendPage(_commentList, nextPageKey);
}
} catch (e) {
print("error --> $e");
_pagingController.error = e;
}
}
@override
void initState() {
_pagingController.addPageRequestListener((pageKey) {
_fetchAllComments(pageKey);
});
super.initState();
}
@override
void dispose() {
_pagingController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
height: MediaQuery.of(context).size.height / 4,
child: RefreshIndicator(
onRefresh: () => Future.sync(() => _pagingController.refresh()),
child: PagedListView<int, CommentModel>(
pagingController: _pagingController,
builderDelegate: PagedChildBuilderDelegate<CommentModel>(
itemBuilder: (context, item, index) =>
CommentTile(
replyList: isReplyBox == true ? replyChild() : const SizedBox.shrink(),
isReplyBox: isReplyBox,
classId: widget.classId,
commentId: item.commentId,
commentMessage: item.commentMessage,
userName: item.userName,
userImagePath: item.userImagePath)),
),
),
);
}
Widget replyChild() {
final double height = MediaQuery.of(context).size.height / 3.8;
return Container(
height: _replyList.length <= 1 ? 00 : height,
child: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: _replyList.length,
itemBuilder: (BuildContext context, index) {
return _replyList[index];
}
),
);
}
Could anyone please tell how may I solve this issue? Thanks in advance.