|
|
|
@ -3,161 +3,46 @@ import 'dart:typed_data';
|
|
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/api/api_client.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/api/chat/chat_api_client.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/app_state/app_state.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/classes/colors.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/main.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/models/chat/get_single_user_chat_list_model.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/ui/chat/chat_full_image_preview.dart';
|
|
|
|
|
import 'package:mohem_flutter_app/widgets/bottom_sheet.dart';
|
|
|
|
|
|
|
|
|
|
// todo: @aamir use extension methods, and use correct widgets.
|
|
|
|
|
|
|
|
|
|
class ChatBubble extends StatelessWidget {
|
|
|
|
|
const ChatBubble(
|
|
|
|
|
{Key? key,
|
|
|
|
|
required this.text,
|
|
|
|
|
required this.replyText,
|
|
|
|
|
required this.isCurrentUser,
|
|
|
|
|
required this.isSeen,
|
|
|
|
|
required this.isDelivered,
|
|
|
|
|
required this.dateTime,
|
|
|
|
|
required this.isReplied,
|
|
|
|
|
required this.userName,
|
|
|
|
|
this.fileTypeID,
|
|
|
|
|
this.fileTypeDescription})
|
|
|
|
|
: super(key: key);
|
|
|
|
|
final String text;
|
|
|
|
|
final String replyText;
|
|
|
|
|
final bool isCurrentUser;
|
|
|
|
|
final bool isSeen;
|
|
|
|
|
final bool isDelivered;
|
|
|
|
|
ChatBubble({Key? key, required this.dateTime, required this.cItem}) : super(key: key);
|
|
|
|
|
final String dateTime;
|
|
|
|
|
final bool isReplied;
|
|
|
|
|
final String userName;
|
|
|
|
|
final int? fileTypeID;
|
|
|
|
|
final String? fileTypeDescription;
|
|
|
|
|
final SingleUserChatModel cItem;
|
|
|
|
|
|
|
|
|
|
bool isCurrentUser = false;
|
|
|
|
|
bool isSeen = false;
|
|
|
|
|
bool isReplied = false;
|
|
|
|
|
int? fileTypeID;
|
|
|
|
|
|
|
|
|
|
String? fileTypeDescription;
|
|
|
|
|
bool isDelivered = false;
|
|
|
|
|
String userName = '';
|
|
|
|
|
|
|
|
|
|
void makeAssign() {
|
|
|
|
|
isCurrentUser = cItem.currentUserId == AppState().chatDetails!.response!.id ? true : false;
|
|
|
|
|
isSeen = cItem.isSeen == true ? true : false;
|
|
|
|
|
isReplied = cItem.userChatReplyResponse != null ? true : false;
|
|
|
|
|
fileTypeID = cItem.fileTypeId;
|
|
|
|
|
fileTypeDescription = cItem.fileTypeResponse != null ? cItem.fileTypeResponse!.fileTypeDescription : "";
|
|
|
|
|
isDelivered = cItem.currentUserId == AppState().chatDetails!.response!.id && cItem.isDelivered == true ? true : false;
|
|
|
|
|
userName = AppState().chatDetails!.response!.userName == cItem.currentUserName.toString() ? "You" : cItem.currentUserName.toString();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@override
|
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
|
makeAssign();
|
|
|
|
|
return isCurrentUser ? currentUser(context) : receiptUser(context);
|
|
|
|
|
|
|
|
|
|
return Padding(
|
|
|
|
|
// padding: EdgeInsets.zero,
|
|
|
|
|
padding: EdgeInsets.only(
|
|
|
|
|
left: isCurrentUser ? 110 : 20,
|
|
|
|
|
right: isCurrentUser ? 20 : 110,
|
|
|
|
|
bottom: 9,
|
|
|
|
|
),
|
|
|
|
|
|
|
|
|
|
child: Align(
|
|
|
|
|
alignment: isCurrentUser ? Alignment.centerRight : Alignment.centerLeft,
|
|
|
|
|
child: DecoratedBox(
|
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
|
color: MyColors.white,
|
|
|
|
|
gradient: isCurrentUser
|
|
|
|
|
? null
|
|
|
|
|
: const LinearGradient(
|
|
|
|
|
transform: GradientRotation(
|
|
|
|
|
.46,
|
|
|
|
|
),
|
|
|
|
|
begin: Alignment.topRight,
|
|
|
|
|
end: Alignment.bottomLeft,
|
|
|
|
|
colors: <Color>[
|
|
|
|
|
MyColors.gradiantEndColor,
|
|
|
|
|
MyColors.gradiantStartColor,
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
borderRadius: BorderRadius.circular(
|
|
|
|
|
10,
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
child: Padding(
|
|
|
|
|
padding: EdgeInsets.only(
|
|
|
|
|
top: isReplied ? 8 : 5,
|
|
|
|
|
right: 8,
|
|
|
|
|
left: 8,
|
|
|
|
|
bottom: 5,
|
|
|
|
|
),
|
|
|
|
|
child: Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
|
|
|
children: [
|
|
|
|
|
if (isReplied)
|
|
|
|
|
ClipRRect(
|
|
|
|
|
borderRadius: BorderRadius.circular(
|
|
|
|
|
5.0,
|
|
|
|
|
),
|
|
|
|
|
child: Container(
|
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
|
border: Border(
|
|
|
|
|
left: BorderSide(
|
|
|
|
|
width: 6,
|
|
|
|
|
color: isCurrentUser ? MyColors.gradiantStartColor : MyColors.white,
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
color: isCurrentUser ? MyColors.black.withOpacity(0.10) : MyColors.black.withOpacity(0.30),
|
|
|
|
|
),
|
|
|
|
|
child: Row(
|
|
|
|
|
children: [
|
|
|
|
|
Expanded(
|
|
|
|
|
child: Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
(userName)
|
|
|
|
|
.toText12(
|
|
|
|
|
color: MyColors.gradiantStartColor,
|
|
|
|
|
isBold: false,
|
|
|
|
|
)
|
|
|
|
|
.paddingOnly(
|
|
|
|
|
right: 5,
|
|
|
|
|
top: 5,
|
|
|
|
|
bottom: 0,
|
|
|
|
|
left: 5,
|
|
|
|
|
),
|
|
|
|
|
replyText
|
|
|
|
|
.toText10(
|
|
|
|
|
color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5),
|
|
|
|
|
isBold: false,
|
|
|
|
|
maxlines: 4,
|
|
|
|
|
)
|
|
|
|
|
.paddingOnly(
|
|
|
|
|
right: 5,
|
|
|
|
|
top: 5,
|
|
|
|
|
bottom: 8,
|
|
|
|
|
left: 5,
|
|
|
|
|
),
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
if (isReplied) 8.height,
|
|
|
|
|
text.toText12(
|
|
|
|
|
color: isCurrentUser ? MyColors.grey57Color : MyColors.white,
|
|
|
|
|
),
|
|
|
|
|
Row(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.end,
|
|
|
|
|
mainAxisAlignment: MainAxisAlignment.end,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
dateTime.toText12(
|
|
|
|
|
color: isCurrentUser ? MyColors.grey41Color.withOpacity(.5) : MyColors.white.withOpacity(0.7),
|
|
|
|
|
),
|
|
|
|
|
if (isCurrentUser) 5.width,
|
|
|
|
|
if (isCurrentUser)
|
|
|
|
|
Icon(
|
|
|
|
|
isDelivered ? Icons.done_all : Icons.done_all,
|
|
|
|
|
color: isSeen ? MyColors.textMixColor : MyColors.grey9DColor,
|
|
|
|
|
size: 14,
|
|
|
|
|
),
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Widget currentUser(context) {
|
|
|
|
@ -166,9 +51,7 @@ class ChatBubble extends StatelessWidget {
|
|
|
|
|
children: [
|
|
|
|
|
if (isReplied)
|
|
|
|
|
ClipRRect(
|
|
|
|
|
borderRadius: BorderRadius.circular(
|
|
|
|
|
5.0,
|
|
|
|
|
),
|
|
|
|
|
borderRadius: BorderRadius.circular(5.0),
|
|
|
|
|
child: Container(
|
|
|
|
|
width: double.infinity,
|
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
@ -177,29 +60,49 @@ class ChatBubble extends StatelessWidget {
|
|
|
|
|
),
|
|
|
|
|
color: isCurrentUser ? MyColors.black.withOpacity(0.10) : MyColors.black.withOpacity(0.30),
|
|
|
|
|
),
|
|
|
|
|
child: Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
(userName).toText12(color: MyColors.gradiantStartColor, isBold: false).paddingOnly(right: 5, top: 5, bottom: 0, left: 5),
|
|
|
|
|
replyText.toText10(color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5), isBold: false, maxlines: 4).paddingOnly(right: 5, top: 5, bottom: 8, left: 5),
|
|
|
|
|
child: Row(
|
|
|
|
|
children: [
|
|
|
|
|
Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
(userName).toText12(color: MyColors.gradiantStartColor, isBold: false).paddingOnly(right: 5, top: 5, bottom: 0, left: 5),
|
|
|
|
|
(cItem.userChatReplyResponse != null ? cItem.userChatReplyResponse!.contant.toString() : "")
|
|
|
|
|
.toText10(color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5), isBold: false, maxlines: 4)
|
|
|
|
|
.paddingOnly(right: 5, top: 5, bottom: 8, left: 5),
|
|
|
|
|
],
|
|
|
|
|
).expanded,
|
|
|
|
|
if (cItem.userChatReplyResponse != null && cItem.userChatReplyResponse!.fileTypeId == 12 ||
|
|
|
|
|
cItem.userChatReplyResponse!.fileTypeId == 3 ||
|
|
|
|
|
cItem.userChatReplyResponse!.fileTypeId == 4)
|
|
|
|
|
ClipRRect(
|
|
|
|
|
borderRadius: BorderRadius.circular(
|
|
|
|
|
8,
|
|
|
|
|
),
|
|
|
|
|
child: showImage(
|
|
|
|
|
isReplyPreview: true,
|
|
|
|
|
fileName: cItem.userChatReplyResponse!.contant!,
|
|
|
|
|
fileTypeDescription: cItem.userChatReplyResponse!.fileTypeResponse!.fileTypeDescription ?? "image/jpg")
|
|
|
|
|
.paddingOnly(left: 10, right: 10, bottom: 16, top: 16),
|
|
|
|
|
)
|
|
|
|
|
],
|
|
|
|
|
).expanded,
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
).paddingOnly(right: 5, bottom: 7),
|
|
|
|
|
if (fileTypeID == 12 || fileTypeID == 4 || fileTypeID == 3) showImage().paddingOnly(right: 5),
|
|
|
|
|
if (fileTypeID != 12 || fileTypeID != 4 || fileTypeID != 3) (text).toText12(),
|
|
|
|
|
if (fileTypeID == 12 || fileTypeID == 4 || fileTypeID == 3)
|
|
|
|
|
showImage(isReplyPreview: false, fileName: cItem.contant!, fileTypeDescription: cItem.fileTypeResponse!.fileTypeDescription).paddingOnly(right: 5).onPress(() {
|
|
|
|
|
showDialog(context: context, builder: (index) => ChatImagePreviewScreen(imgTitle: cItem.contant!, img: cItem.image!));
|
|
|
|
|
}),
|
|
|
|
|
cItem.contant!.toText12(),
|
|
|
|
|
Align(
|
|
|
|
|
alignment: Alignment.centerRight,
|
|
|
|
|
child: Row(
|
|
|
|
|
mainAxisSize: MainAxisSize.min,
|
|
|
|
|
children: [
|
|
|
|
|
dateTime.toText10(color: MyColors.grey41Color.withOpacity(.5)),
|
|
|
|
|
7.width,
|
|
|
|
|
Icon(
|
|
|
|
|
isDelivered ? Icons.done_all : Icons.done_all,
|
|
|
|
|
color: isSeen ? MyColors.textMixColor : MyColors.grey9DColor,
|
|
|
|
|
size: 14,
|
|
|
|
|
dateTime.toText10(
|
|
|
|
|
color: MyColors.grey41Color.withOpacity(.5),
|
|
|
|
|
),
|
|
|
|
|
7.width,
|
|
|
|
|
Icon(isDelivered ? Icons.done_all : Icons.done_all, color: isSeen ? MyColors.textMixColor : MyColors.grey9DColor, size: 14),
|
|
|
|
|
],
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
@ -227,27 +130,45 @@ class ChatBubble extends StatelessWidget {
|
|
|
|
|
children: [
|
|
|
|
|
if (isReplied)
|
|
|
|
|
ClipRRect(
|
|
|
|
|
borderRadius: BorderRadius.circular(
|
|
|
|
|
5.0,
|
|
|
|
|
),
|
|
|
|
|
borderRadius: BorderRadius.circular(5.0),
|
|
|
|
|
child: Container(
|
|
|
|
|
width: double.infinity,
|
|
|
|
|
decoration: BoxDecoration(
|
|
|
|
|
border: Border(
|
|
|
|
|
left: BorderSide(width: 6, color: isCurrentUser ? MyColors.gradiantStartColor : MyColors.white),
|
|
|
|
|
),
|
|
|
|
|
border: Border(left: BorderSide(width: 6, color: isCurrentUser ? MyColors.gradiantStartColor : MyColors.white)),
|
|
|
|
|
color: isCurrentUser ? MyColors.black.withOpacity(0.10) : MyColors.black.withOpacity(0.30),
|
|
|
|
|
),
|
|
|
|
|
child: Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
(userName).toText12(color: MyColors.gradiantStartColor, isBold: false).paddingOnly(right: 5, top: 5, bottom: 0, left: 5),
|
|
|
|
|
replyText.toText10(color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5), isBold: false, maxlines: 4).paddingOnly(right: 5, top: 5, bottom: 8, left: 5),
|
|
|
|
|
child: Row(
|
|
|
|
|
children: [
|
|
|
|
|
Column(
|
|
|
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
|
|
children: <Widget>[
|
|
|
|
|
(userName).toText12(color: MyColors.gradiantStartColor, isBold: false).paddingOnly(right: 5, top: 5, bottom: 0, left: 5),
|
|
|
|
|
(cItem.userChatReplyResponse != null ? cItem.userChatReplyResponse!.contant.toString() : "")
|
|
|
|
|
.toText10(color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5), isBold: false, maxlines: 4)
|
|
|
|
|
.paddingOnly(right: 5, top: 5, bottom: 8, left: 5),
|
|
|
|
|
],
|
|
|
|
|
).expanded,
|
|
|
|
|
if (cItem.userChatReplyResponse != null && cItem.userChatReplyResponse!.fileTypeId == 12 ||
|
|
|
|
|
cItem.userChatReplyResponse!.fileTypeId == 3 ||
|
|
|
|
|
cItem.userChatReplyResponse!.fileTypeId == 4)
|
|
|
|
|
ClipRRect(
|
|
|
|
|
borderRadius: BorderRadius.circular(8.0),
|
|
|
|
|
child: showImage(
|
|
|
|
|
isReplyPreview: true,
|
|
|
|
|
fileName: cItem.userChatReplyResponse!.contant!,
|
|
|
|
|
fileTypeDescription: cItem.userChatReplyResponse!.fileTypeResponse!.fileTypeDescription ?? "image/jpg")
|
|
|
|
|
.paddingOnly(left: 10, right: 10, bottom: 16, top: 16),
|
|
|
|
|
)
|
|
|
|
|
],
|
|
|
|
|
).expanded,
|
|
|
|
|
),
|
|
|
|
|
),
|
|
|
|
|
).paddingOnly(right: 5, bottom: 7),
|
|
|
|
|
if (fileTypeID == 12 || fileTypeID == 4 || fileTypeID == 3) showImage().paddingOnly(right: 5) else (text).toText12(color: Colors.white),
|
|
|
|
|
if (fileTypeID == 12 || fileTypeID == 4 || fileTypeID == 3)
|
|
|
|
|
showImage(isReplyPreview: false, fileName: cItem.contant!, fileTypeDescription: cItem.fileTypeResponse!.fileTypeDescription ?? "image/jpg").paddingOnly(right: 5).onPress(() {
|
|
|
|
|
showDialog(context: context, builder: (index) => ChatImagePreviewScreen(imgTitle: cItem.contant!, img: cItem.image!));
|
|
|
|
|
})
|
|
|
|
|
else
|
|
|
|
|
(cItem.contant! ?? "").toText12(color: Colors.white),
|
|
|
|
|
Align(
|
|
|
|
|
alignment: Alignment.centerRight,
|
|
|
|
|
child: dateTime.toText10(
|
|
|
|
@ -259,25 +180,41 @@ class ChatBubble extends StatelessWidget {
|
|
|
|
|
).paddingOnly(right: MediaQuery.of(context).size.width * 0.3);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Widget showImage() {
|
|
|
|
|
return FutureBuilder<Uint8List>(
|
|
|
|
|
future: ChatApiClient().downloadURL(fileName: text, fileTypeDescription: fileTypeDescription!),
|
|
|
|
|
builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
|
|
|
|
|
if (snapshot.connectionState != ConnectionState.waiting) {
|
|
|
|
|
if (snapshot.data == null) {
|
|
|
|
|
return (text).toText12(color: Colors.white);
|
|
|
|
|
Widget showImage({required bool isReplyPreview, required String fileName, required String fileTypeDescription}) {
|
|
|
|
|
if (cItem.isImageLoaded! && cItem.image != null) {
|
|
|
|
|
return Image.memory(
|
|
|
|
|
cItem.image!,
|
|
|
|
|
height: isReplyPreview ? 32 : 140,
|
|
|
|
|
width: isReplyPreview ? 32 : 227,
|
|
|
|
|
fit: BoxFit.cover,
|
|
|
|
|
);
|
|
|
|
|
} else {
|
|
|
|
|
return FutureBuilder<Uint8List>(
|
|
|
|
|
future: ChatApiClient().downloadURL(fileName: fileName, fileTypeDescription: fileTypeDescription),
|
|
|
|
|
builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
|
|
|
|
|
if (snapshot.connectionState != ConnectionState.waiting) {
|
|
|
|
|
if (snapshot.data == null) {
|
|
|
|
|
return SizedBox();
|
|
|
|
|
} else {
|
|
|
|
|
//data = image;
|
|
|
|
|
cItem.image = snapshot.data;
|
|
|
|
|
cItem.isImageLoaded = true;
|
|
|
|
|
return Image.memory(
|
|
|
|
|
snapshot.data,
|
|
|
|
|
height: isReplyPreview ? 32 : 140,
|
|
|
|
|
width: isReplyPreview ? 32 : 227,
|
|
|
|
|
fit: BoxFit.cover,
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
return Image.memory(
|
|
|
|
|
snapshot.data,
|
|
|
|
|
height: 140,
|
|
|
|
|
width: 227,
|
|
|
|
|
fit: BoxFit.cover,
|
|
|
|
|
return SizedBox(
|
|
|
|
|
height: isReplyPreview ? 32 : 140,
|
|
|
|
|
width: isReplyPreview ? 32 : 227,
|
|
|
|
|
child: const Center(child: CircularProgressIndicator()),
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
return const SizedBox(height: 140, width: 227, child: Center(child: CircularProgressIndicator()));
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|