Skip to content

Commit

Permalink
Improved commments to show the reply on the same
Browse files Browse the repository at this point in the history
  • Loading branch information
@anilkaraniya
anilkaraniya committed Mar 15, 2024
1 parent ddfdebd commit e823187
Show file tree
Hide file tree
Showing 3 changed files with 163 additions and 101 deletions.
35 changes: 20 additions & 15 deletions bakliwal_news/lib/models/public_article_model.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,25 +49,28 @@ class PublicComments {
});

factory PublicComments.fromJson(Map<String, dynamic> json) {
List<PublicComments> children = [];
List childerenData = json['children'];
for (var element in childerenData) {
children.add(
PublicComments(
commentId: element['id_code'].toString(),
commentBody: element['body_html'].toString(),
createdAt: DateTime.parse(element['created_at'].toString()),
user: PublicUser.fromJson(element['user']),
children: [],
),
);
List<PublicComments> sortComments(List childerenData) {
List<PublicComments> comments = [];
for (var element in childerenData) {
comments.add(
PublicComments(
commentId: element['id_code'].toString(),
commentBody: element['body_html'].toString(),
createdAt: DateTime.parse(element['created_at'].toString()),
user: PublicUser.fromJson(element['user']),
children: sortComments(element['children']),
),
);
}
return comments;
}

return PublicComments(
commentId: json['id_code'].toString(),
commentBody: json['body_html'].toString(),
createdAt: DateTime.parse(json['created_at'].toString()),
user: PublicUser.fromJson(json['user']),
children: children,
children: sortComments(json['children']),
);
}
}
Expand Down Expand Up @@ -126,7 +129,7 @@ class PublicArticleCanonicalModel {
final DateTime? publishedTimestamp;
final String? coverImage;
final String? readingTimeMinutes;
final String? tags;
final List? tags;
final String? bodyHtml;
final PublicUser user;
final List<PublicComments> comments;
Expand All @@ -149,6 +152,8 @@ class PublicArticleCanonicalModel {

factory PublicArticleCanonicalModel.fromJson(
Map<String, dynamic> json, List<PublicComments> comments) {
List tags = [];
tags = json['tag_list'].toString().split(',');
return PublicArticleCanonicalModel(
articleId: json['id'].toString(),
title: json['title'].toString(),
Expand All @@ -159,7 +164,7 @@ class PublicArticleCanonicalModel {
publishedTimestamp: DateTime.parse(json['published_timestamp']),
coverImage: json['cover_image'].toString(),
readingTimeMinutes: json['reading_time_minutes'].toString(),
tags: json['tag_list'].toString(),
tags: tags,
bodyHtml: json['body_html'],
user: PublicUser.fromJson(json['user']),
comments: comments,
Expand Down
222 changes: 140 additions & 82 deletions bakliwal_news/lib/screens/secondary_screens/public_article_canonical.dart
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import 'dart:math' as math;

// ignore_for_file: use_build_context_synchronously
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
Expand Down Expand Up @@ -172,6 +174,34 @@ class MainDescriptionContent extends StatelessWidget {
},
),
),
const SizedBox(
height: 15,
),
Wrap(
// spacing: 5,
runSpacing: 5,
children: [
if (newsArticle.tags![0].hashCode != 1)
...newsArticle.tags!.map((e) {
return Card(
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(8))),
color: const Color.fromARGB(255, 37, 37, 37),
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: 5, horizontal: 10),
child: Text(
"#${e.toString().trim()}",
style: const TextStyle(
color: Color.fromARGB(255, 180, 188, 207),
fontWeight: FontWeight.bold,
),
),
),
);
})
],
),
const SizedBox(
height: 25,
),
Expand Down Expand Up @@ -207,6 +237,7 @@ class MainDescriptionContent extends StatelessWidget {
return ArticleComments(
comment: comment,
newsArticle: newsArticle,
commentReplyPadding: 25,
);
}),
],
Expand All @@ -223,16 +254,49 @@ class ArticleComments extends StatefulWidget {
super.key,
required this.comment,
required this.newsArticle,
required this.commentReplyPadding,
});

final PublicComments comment;
PublicArticleCanonicalModel newsArticle;
double commentReplyPadding;

@override
State<ArticleComments> createState() => _ArticleCommentsState();
}

class _ArticleCommentsState extends State<ArticleComments> {
@override
Widget build(BuildContext context) {
// ignore: avoid_unnecessary_containers
return Container(
child: Column(
children: [
CommentCard(comment: widget.comment),
if (widget.comment.children.isNotEmpty)
Container(
padding: EdgeInsets.only(left: widget.commentReplyPadding),
child: Column(
children: [
...widget.comment.children.map((element) {
return ArticleComments(
comment: element,
newsArticle: widget.newsArticle,
commentReplyPadding: 10,
);
}).toList(),
],
),
),
],
),
);
}
}

class CommentCard extends StatelessWidget {
const CommentCard({super.key, required this.comment});

String _parseHtmlString(String htmlString) {
final document = parse(htmlString);
final String parsedString =
Expand All @@ -241,99 +305,93 @@ class _ArticleCommentsState extends State<ArticleComments> {
return parsedString;
}

final PublicComments comment;

@override
Widget build(BuildContext context) {
// ignore: avoid_unnecessary_containers
return Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
height: 40.0,
width: 40.0,
decoration: const BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.all(
Radius.circular(7),
),
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
height: 40.0,
width: 40.0,
decoration: const BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.all(
Radius.circular(7),
),
child: widget.comment.user.profileImage == null ||
widget.comment.user.profileImage!.isEmpty
? ClipRRect(
borderRadius: BorderRadius.circular(7),
child: const Image(
fit: BoxFit.cover,
image: AssetImage(
"assets/images/profilePlaceholder.jpeg",
),
),
child: comment.user.profileImage == null ||
comment.user.profileImage!.isEmpty
? ClipRRect(
borderRadius: BorderRadius.circular(7),
child: const Image(
fit: BoxFit.cover,
image: AssetImage(
"assets/images/profilePlaceholder.jpeg",
),
)
: ClipRRect(
borderRadius: BorderRadius.circular(7),
child: Image(
fit: BoxFit.cover,
image: NetworkImage(
widget.comment.user.profileImage!,
),
),
)
: ClipRRect(
borderRadius: BorderRadius.circular(7),
child: Image(
fit: BoxFit.cover,
image: NetworkImage(
comment.user.profileImage!,
),
),
),
const SizedBox(
width: 10,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
widget.comment.user.username!,
style: const TextStyle(color: Colors.white),
),
Text(
DateFormat("MMMd").format(
widget.comment.createdAt,
),
style: TextStyle(
fontSize: 15,
color: Colors.blueGrey[200],
),
),
const SizedBox(
width: 10,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
comment.user.username!,
style: const TextStyle(color: Colors.white),
),
Text(
DateFormat("MMMd").format(
comment.createdAt,
),
],
),
],
),
],
),
Container(
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey[900],
),
margin: const EdgeInsets.symmetric(vertical: 10),
padding: const EdgeInsets.all(15),
child: Text(
_parseHtmlString(widget.comment.commentBody).trim(),
style: const TextStyle(
fontSize: 18,
color: Colors.white,
),
style: TextStyle(
fontSize: 15,
color: Colors.blueGrey[200],
),
),
],
),
],
),
],
),
Container(
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey[900],
),
const SizedBox(
height: 10,
margin: const EdgeInsets.symmetric(vertical: 10),
padding: const EdgeInsets.all(15),
child: Text(
_parseHtmlString(comment.commentBody).trim(),
style: const TextStyle(
fontSize: 18,
color: Colors.white,
),
),
// Row(
// children: [
// IconButton(onPressed: () {}, icon: const Icon(Icons.add))
// ],
// )
],
),
),
const SizedBox(
height: 10,
),
],
);
}
}
Expand Down
7 changes: 3 additions & 4 deletions bakliwal_news/lib/widget/view/article_discription_appbar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ class ArticleDiscriptionAppBar extends StatelessWidget {
publicArticle != null
? Row(
children: [
publicArticle!.user.twitterUsername != null
publicArticle!.user.twitterUsername != "null"
? InkWell(
onTap: () async {
launchUrl(
Expand All @@ -167,13 +167,12 @@ class ArticleDiscriptionAppBar extends StatelessWidget {
),
)
: Container(),
publicArticle!.user.twitterUsername != null
publicArticle!.user.twitterUsername != "null"
? const SizedBox(
width: 10,
)
: Container(),
publicArticle!.user.githubUsername != null ||
publicArticle!.user.githubUsername!.isNotEmpty
publicArticle!.user.githubUsername != "null"
? InkWell(
onTap: () async {
launchUrl(
Expand Down

0 comments on commit e823187

Please sign in to comment.