Skip to content

Commit

Permalink
Fixed pinned message bug on iOS
Browse files Browse the repository at this point in the history
  • Loading branch information
Decoder07 committed Jan 8, 2024
1 parent 5b0d862 commit 35c4ddd
Show file tree
Hide file tree
Showing 11 changed files with 218 additions and 154 deletions.
100 changes: 70 additions & 30 deletions packages/hms_room_kit/lib/src/hls_viewer/overlay_chat_component.dart
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import 'package:flutter/material.dart';
import 'package:flutter_linkify/flutter_linkify.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hms_room_kit/src/widgets/bottom_sheets/chat_utilities_bottom_sheet.dart';
import 'package:hms_room_kit/src/widgets/chat_widgets/chat_text_field.dart';
import 'package:hms_room_kit/src/widgets/chat_widgets/pin_chat_widget.dart';
import 'package:hmssdk_flutter/hmssdk_flutter.dart';
Expand Down Expand Up @@ -74,39 +75,78 @@ class _OverlayChatComponentState extends State<OverlayChatComponent> {
shrinkWrap: true,
itemCount: data.item1.length,
itemBuilder: (_, index) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
HMSTitleText(
text: data.item1[index].sender?.name ??
"Anonymous",
textColor: Colors.white,
fontSize: 14,
lineHeight: 20,
letterSpacing: 0.1,
),
const SizedBox(
height: 2,
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
HMSTitleText(
text: data.item1[index].sender?.name ??
"Anonymous",
textColor: Colors.white,
fontSize: 14,
lineHeight: 20,
letterSpacing: 0.1,
),
const SizedBox(
height: 2,
),
SelectableLinkify(
text: data.item1[index].message,
onOpen: (link) async {
Uri url = Uri.parse(link.url);
if (await canLaunchUrl(url)) {
await launchUrl(url,
mode: LaunchMode
.externalApplication);
}
},
scrollPhysics:
const NeverScrollableScrollPhysics(),
options:
const LinkifyOptions(humanize: false),
style: HMSTextStyle.setTextStyle(
color: Colors.white,
fontSize: 14,
height: 20 / 14,
letterSpacing: 0.25,
),
),
const SizedBox(
height: 8,
)
],
),
),
SelectableLinkify(
text: data.item1[index].message,
onOpen: (link) async {
Uri url = Uri.parse(link.url);
if (await canLaunchUrl(url)) {
await launchUrl(url,
mode: LaunchMode.externalApplication);
}
GestureDetector(
onTap: () {
showModalBottomSheet(
isScrollControlled: true,
backgroundColor: HMSThemeColors.surfaceDim,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16),
topRight: Radius.circular(16)),
),
context: context,
builder: (ctx) =>
ChangeNotifierProvider.value(
value: context.read<MeetingStore>(),
child: ChatUtilitiesBottomSheet(
message: data.item1[index],
)),
);
},
options: const LinkifyOptions(humanize: false),
style: HMSTextStyle.setTextStyle(
color: Colors.white,
fontSize: 14,
height: 20 / 14,
letterSpacing: 0.25,
child: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/more.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceMediumEmphasis,
BlendMode.srcIn),
),
),
const SizedBox(
height: 8,
)
],
);
Expand All @@ -124,7 +164,7 @@ class _OverlayChatComponentState extends State<OverlayChatComponent> {
meetingStore.pinnedMessages.length),
builder: (_, data, __) {
return PinChatWidget(
pinnedMessage: data.item1,
pinnedMessage: data.item1.reversed.toList(),
backgroundColor: HMSThemeColors.backgroundDim.withAlpha(64),
);
}),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -100,9 +100,9 @@ class _ChatBottomSheetState extends State<ChatBottomSheet> {
child: Center(child: HMSEmptyChatWidget()))
: Expanded(
child: Column(children: [
///If there is a pinned chat
if (data.item3.isNotEmpty)
PinChatWidget(pinnedMessage: data.item3),
PinChatWidget(
pinnedMessage:
data.item3.reversed.toList()),

/// List containing chats
Expanded(
Expand Down
207 changes: 108 additions & 99 deletions packages/hms_room_kit/lib/src/widgets/chat_widgets/pin_chat_widget.dart
Original file line number Diff line number Diff line change
Expand Up @@ -57,109 +57,118 @@ class _PinChatWidgetState extends State<PinChatWidget> {

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => toggleExpand(),
child: Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Row(
children: [
AnimatedContainer(
height: MediaQuery.of(context).size.height *
(isExpanded ? 0.13 : 0.07),
width: (HMSRoomLayout.chatData?.allowPinningMessages ?? false)
? MediaQuery.of(context).size.width * 0.85
: MediaQuery.of(context).size.width * 0.9,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color:
widget.backgroundColor ?? HMSThemeColors.surfaceDefault),
duration: const Duration(milliseconds: 0),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
if (widget.pinnedMessage.length > 1)
DotsIndicator(
axis: Axis.vertical,
mainAxisSize: MainAxisSize.min,
dotsCount: widget.pinnedMessage.length,
position: currentPage > widget.pinnedMessage.length
? 0
: currentPage,
decorator: DotsDecorator(
spacing: const EdgeInsets.only(bottom: 3.0, right: 8),
size: Size(2.0, isExpanded ? 24 : 9.0),
activeSize: Size(2.0, isExpanded ? 24 : 9.0),
color: HMSThemeColors.onSurfaceLowEmphasis,
activeColor: HMSThemeColors.onSurfaceHighEmphasis,
activeShape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16.0)),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16.0)),
),
onTap: (position) => setCurrentPage(position),
),
Expanded(
child: PageView.builder(
scrollDirection: Axis.vertical,
controller: _pageController,
itemCount: widget.pinnedMessage.length,
physics: const PageScrollPhysics(),
onPageChanged: (value) => setCurrentPage(value),
itemBuilder: (context, index) => SelectableLinkify(
maxLines: 2,
scrollPhysics: isExpanded
? const BouncingScrollPhysics()
: const NeverScrollableScrollPhysics(),
text: widget.pinnedMessage[index]["text"],
onOpen: (link) async {
Uri url = Uri.parse(link.url);
if (await canLaunchUrl(url)) {
await launchUrl(url,
mode: LaunchMode.externalApplication);
}
},
onTap: () => toggleExpand(),
options: const LinkifyOptions(humanize: false),
style: HMSTextStyle.setTextStyle(
fontSize: 14.0,
color: HMSThemeColors.onSurfaceHighEmphasis,
letterSpacing: 0.25,
height: 20 / 14,
fontWeight: FontWeight.w400,
///If there are no pinnedMessage we render an empty SizedBox
///else we render the pinned message widget
return widget.pinnedMessage.isEmpty
? const SizedBox()
: GestureDetector(
onTap: () => toggleExpand(),
child: Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Row(
children: [
AnimatedContainer(
height: MediaQuery.of(context).size.height *
(isExpanded ? 0.13 : 0.07),
width:
(HMSRoomLayout.chatData?.allowPinningMessages ?? false)
? MediaQuery.of(context).size.width * 0.85
: MediaQuery.of(context).size.width * 0.9,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: widget.backgroundColor ??
HMSThemeColors.surfaceDefault),
duration: const Duration(milliseconds: 0),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
if (widget.pinnedMessage.length > 1)
DotsIndicator(
axis: Axis.vertical,
mainAxisSize: MainAxisSize.min,
dotsCount: widget.pinnedMessage.length,
position:
currentPage > widget.pinnedMessage.length
? 0
: currentPage,
decorator: DotsDecorator(
spacing: const EdgeInsets.only(
bottom: 3.0, right: 8),
size: Size(2.0, isExpanded ? 24 : 9.0),
activeSize: Size(2.0, isExpanded ? 24 : 9.0),
color: HMSThemeColors.onSurfaceLowEmphasis,
activeColor:
HMSThemeColors.onSurfaceHighEmphasis,
activeShape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16.0)),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16.0)),
),
onTap: (position) => setCurrentPage(position),
),
Expanded(
child: PageView.builder(
scrollDirection: Axis.vertical,
controller: _pageController,
itemCount: widget.pinnedMessage.length,
physics: const PageScrollPhysics(),
onPageChanged: (value) => setCurrentPage(value),
itemBuilder: (context, index) =>
SelectableLinkify(
maxLines: 2,
scrollPhysics: isExpanded
? const BouncingScrollPhysics()
: const NeverScrollableScrollPhysics(),
text: widget.pinnedMessage[index]["text"],
onOpen: (link) async {
Uri url = Uri.parse(link.url);
if (await canLaunchUrl(url)) {
await launchUrl(url,
mode: LaunchMode.externalApplication);
}
},
onTap: () => toggleExpand(),
options: const LinkifyOptions(humanize: false),
style: HMSTextStyle.setTextStyle(
fontSize: 14.0,
color: HMSThemeColors.onSurfaceHighEmphasis,
letterSpacing: 0.25,
height: 20 / 14,
fontWeight: FontWeight.w400,
),
linkStyle: HMSTextStyle.setTextStyle(
fontSize: 14.0,
color: HMSThemeColors.primaryDefault,
letterSpacing: 0.25,
height: 20 / 14,
fontWeight: FontWeight.w400),
),
),
),
linkStyle: HMSTextStyle.setTextStyle(
fontSize: 14.0,
color: HMSThemeColors.primaryDefault,
letterSpacing: 0.25,
height: 20 / 14,
fontWeight: FontWeight.w400),
),
],
),
),
),
const SizedBox(width: 8),
if (HMSRoomLayout.chatData?.allowPinningMessages ?? false)
GestureDetector(
onTap: () => context.read<MeetingStore>().unpinMessage(
widget.pinnedMessage[currentPage]["id"]),
child: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/unpin.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceMediumEmphasis,
BlendMode.srcIn),
),
),
],
),
],
),
),
const SizedBox(width: 8),
if (HMSRoomLayout.chatData?.allowPinningMessages ?? false)
GestureDetector(
onTap: () => context
.read<MeetingStore>()
.unpinMessage(widget.pinnedMessage[currentPage]["id"]),
child: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/unpin.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceMediumEmphasis, BlendMode.srcIn),
),
),
],
),
),
);
);
}
}
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
///Dart imports
import 'dart:math' as math;

///Package imports
import 'package:flutter/material.dart';
import 'package:hmssdk_flutter/hmssdk_flutter.dart';
Expand Down Expand Up @@ -28,7 +31,8 @@ class HMSErrorToast extends StatelessWidget {
toastColor: toastColor,
toastPosition: toastPosition,
subtitle: HMSSubheadingText(
text: error.description,
text: error.description
.substring(0, math.min(50, error.description.length)),
textColor: HMSThemeColors.onSurfaceHighEmphasis,
fontWeight: FontWeight.w600,
letterSpacing: 0.1,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ class _HMSToastState extends State<HMSToast> {
return Padding(
padding: EdgeInsets.only(bottom: widget.toastPosition ?? 68),
child: AlertDialog(
backgroundColor: widget.toastColor,
insetPadding: const EdgeInsets.all(0),
alignment: Alignment.bottomCenter,
contentPadding: const EdgeInsets.all(0),
Expand Down
6 changes: 6 additions & 0 deletions packages/hmssdk_flutter/example/ExampleAppChangelog.txt
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,12 @@ https://100ms.atlassian.net/browse/LIVE-1981
- Block Peer From Chat
https://100ms.atlassian.net/browse/FLUT-157

- Multi Pin Chat
https://100ms.atlassian.net/browse/FLUT-154

- can't see pinned chat(by remote peer) on Flutter
https://100ms.atlassian.net/browse/FLUT-187

Room Kit: 1.0.9
Core SDK: 1.9.6
Android SDK: 2.8.4
Expand Down
Loading

0 comments on commit 35c4ddd

Please sign in to comment.