cwtch.im
/
cwtch-ui
10
11
Fork 17
Code Issues 89 Pull Requests 1 Projects 2 Releases 28 Wiki Activity

Clickable hyperlinks for MessageBubbles #235

Merged
sarah merged 9 commits from NimaBoscarino/cwtch-ui:nima/clickable-links into trunk 2021-11-17 02:09:06 +00:00
Conversation 10 Commits 9 Files Changed 8 +3 -4
1 changed files with 3 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 35dcc24e66 - Show all commits

7
lib/widgets/messagebubble.dart
View File

@ -68,7 +68,7 @@ class MessageBubbleState extends State<MessageBubble> {
text: widget.content + '\u202F',
// TODO: onOpen breaks the "selectable" functionality. Maybe something to do with gesture handler?
NimaBoscarino commented 2021-11-06 06:37:08 +00:00
Review
Copy Link

For some reason, once I add the onOpen handler the text selection breaks (e.g. https://i.imgur.com/SrtOLIG.mp4). I don't know enough about Flutter/Dart to figure it out easily, do you know what the case might be? I tried to recreate it in a fresh sandbox but had no luck, so I'm wondering if maybe the TapGestureRecognizer in Linkify conflicts with the MouseRegion in messagerow.dart?

For some reason, once I add the `onOpen` handler the text selection breaks (e.g. https://i.imgur.com/SrtOLIG.mp4). I don't know enough about Flutter/Dart to figure it out easily, do you know what the case might be? I tried to recreate it in a fresh sandbox but had no luck, so I'm wondering if maybe the `TapGestureRecognizer` in [Linkify](https://github.com/Cretezy/flutter_linkify/blob/1363236817d2c703770fdc7e02ccb4a3754b8ef8/lib/flutter_linkify.dart#L344) conflicts with the `MouseRegion` in `messagerow.dart`?
sarah commented 2021-11-06 17:24:37 +00:00
Review
Copy Link

We've definitely had a few issues with widgets interacting in these kinds of ways. I will take a look into this early next week.

We've definitely had a few issues with widgets interacting in these kinds of ways. I will take a look into this early next week.
👍 1
sarah commented 2021-11-08 20:03:03 +00:00
Review
Copy Link

I could not replicate the lack of text selection on Linux under the following Flutter Build

Flutter 2.6.0-12.0.pre.637 • channel master • https://github.com/flutter/flutter.git
Framework • revision d6dd2fa78d (15 minutes ago) • 2021-11-08 11:23:34 -0800
Engine • revision 469d6f1a09
Tools • Dart 2.15.0 (build 2.15.0-285.0.dev)

As such I wonder if this is platform specific (or perhaps fixed in a newer version of flutter).

I could not replicate the lack of text selection on Linux under the following Flutter Build Flutter 2.6.0-12.0.pre.637 • channel master • https://github.com/flutter/flutter.git Framework • revision d6dd2fa78d (15 minutes ago) • 2021-11-08 11:23:34 -0800 Engine • revision 469d6f1a09 Tools • Dart 2.15.0 (build 2.15.0-285.0.dev) As such I wonder if this is platform specific (or perhaps fixed in a newer version of flutter).
NimaBoscarino commented 2021-11-08 21:21:29 +00:00
Review
Copy Link

I tried it with

Flutter 2.6.0-12.0.pre.641 • channel master • https://github.com/flutter/flutter.git
Framework • revision f4f23ecb59 (46 minutes ago) • 2021-11-08 12:27:14 -0800
Engine • revision 469d6f1a09
Tools • Dart 2.15.0 (build 2.15.0-285.0.dev)

and still ran into the issue, so it looks like it might be as macOS-specific issue!

I tried it with ``` Flutter 2.6.0-12.0.pre.641 • channel master • https://github.com/flutter/flutter.git Framework • revision f4f23ecb59 (46 minutes ago) • 2021-11-08 12:27:14 -0800 Engine • revision 469d6f1a09 Tools • Dart 2.15.0 (build 2.15.0-285.0.dev) ``` and still ran into the issue, so it looks like it might be as macOS-specific issue!
options: LinkifyOptions(humanize: false),
linkifiers: [UrlLinkifier()], // TODO: double-check on this (only web links to avoid Android messiness)
linkifiers: [UrlLinkifier()],
onOpen: (link) {
_modalOpenLink(context, link);
},
@ -122,7 +122,6 @@ class MessageBubbleState extends State<MessageBubble> {
context: ctx,
builder: (BuildContext bcontext) {
return Container(
// TODO: Ask re: hard-coded height
height: 200, // bespoke value courtesy of the [TextField] docs
child: Center(
NimaBoscarino commented 2021-11-06 06:38:35 +00:00
Review
Copy Link

I stole this modal from elsewhere in the code. Since the height has been hard-coded to 200 in several places, should I extract the modal out to be its own widget?

I stole this modal from elsewhere in the code. Since the height has been hard-coded to 200 in several places, should I extract the modal out to be its own widget?
sarah commented 2021-11-06 17:25:25 +00:00
Review
Copy Link

I think having this widget defined here right now is fine. We have a separate task planned to go through and check widgets like (with hard coded heights etc.)

I think having this widget defined here right now is fine. We have a separate task planned to go through and check widgets like (with hard coded heights etc.)
child: Padding(
@ -134,7 +133,6 @@ class MessageBubbleState extends State<MessageBubble> {
Text(
"Opening this link will launch an application outside of Cwtch and may reveal metadata or otherwise compromise the security of Cwtch. Only open links from people you trust. Are you sure you want to continue?"
),
// TODO: Ask about styling preferences (should this be a reusable "inline-button"?)
Flex(direction: Axis.horizontal, mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[
Container(
margin: EdgeInsets.symmetric(vertical: 20, horizontal: 10),
NimaBoscarino commented 2021-11-06 06:39:21 +00:00
Review
Copy Link

I'm quite new to styling and layout in Flutter. Does this look okay, or are there cleaner/other ways preferred?

I'm quite new to styling and layout in Flutter. Does this look okay, or are there cleaner/other ways preferred?
sarah commented 2021-11-06 17:25:57 +00:00
Review
Copy Link

This looks fine :)

This looks fine :)
@ -143,10 +141,11 @@ class MessageBubbleState extends State<MessageBubble> {
onPressed: () {
Clipboard.setData(new ClipboardData(text: link.url));
// TODO: Ask about desired SnackBar + modal behaviour
final snackBar = SnackBar(
content: Text(AppLocalizations.of(context)!.copiedClipboardNotification),
);
Navigator.pop(bcontext);
ScaffoldMessenger.of(context).showSnackBar(snackBar);
},
),