Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

msglist: Message bounds hard to see in a run of messages from the same user #1142

Open
chrisbobbe opened this issue Dec 12, 2024 · 2 comments · May be fixed by #1152
Open

msglist: Message bounds hard to see in a run of messages from the same user #1142

chrisbobbe opened this issue Dec 12, 2024 · 2 comments · May be fixed by #1152
Labels
a-design Visual and UX design a-msglist The message-list screen, except what's label:a-content beta feedback Things beta users have specifically asked for
Milestone
M6: Post-launch

Comments

@chrisbobbe
Copy link
Collaborator

chrisbobbe commented Dec 12, 2024 •
edited
Loading

When we show a run of consecutive messages from the same user, it can be hard to see where one message ends and the next begins. Compare zulip-flutter and web:

web zulip-flutter
image image
image image

I noticed this at #446 (review) and it came up again in beta feedback: https://chat.zulip.org/#narrow/channel/48-mobile/topic/mobile.20beta.20feedback/near/2000252

One clear improvement, I think, is to tint the background of a message when you long-press it, which you might do to open the message action sheet. We even have a Figma frame we can follow:

image

Once message is pressed there should be a tint of the background, since the background color could be anything. So pressedTint is a transparent foreground color.

Pressed state here is kind of selected state, because we want to keep highlighting the message as a contextual information for a dialog of editing the message.

That design has a different motivation (#126 edit message) but would help this message-bounds issue too, without having to add or rearrange anything in the layout. (Space is tight on mobile.)

EDIT: A new idea from PR #1152 that seems reasonable to me: also keep the tint while the message action sheet is open.
@chrisbobbe chrisbobbe added the beta feedback Things beta users have specifically asked for label Dec 12, 2024
@chrisbobbe chrisbobbe added the a-msglist The message-list screen, except what's label:a-content label Dec 12, 2024
@Gaurav-Kushwaha-1225

This comment was marked as off-topic.

Sign in to view
@chrisbobbe

This comment was marked as off-topic.

Sign in to view
@Gaurav-Kushwaha-1225 Gaurav-Kushwaha-1225 linked a pull request Dec 13, 2024 that will close this issue
Open
@gnprice gnprice added this to the M6: Post-launch milestone Dec 13, 2024
@gnprice gnprice added the a-design Visual and UX design label Dec 13, 2024
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 9, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
6737860 
This feature allows to see a tint color on the
message when it is pressed.

Shifted `MessageWithPossibleSender` to StatefulWidget
and used `isMessageActionSheetOpen` to check
BottomSheet is open or not (via onDismiss) in
`showMessageActionSheet`.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 13, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
b21687c 
This feature allows to see a tint color on the
message when it is pressed.

Shifted `MessageWithPossibleSender` to StatefulWidget
and used `isMessageActionSheetOpen` to check
BottomSheet is open or not (via onDismiss) in
`showMessageActionSheet`.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Fixes: zulip#1142
gnprice pushed a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 17, 2025
@Gaurav-Kushwaha-1225 @gnprice
message_list: added pressedTint feature
03a4244 
This feature allows to see a tint color on the
message when it is pressed.

Shifted `MessageWithPossibleSender` to StatefulWidget
and used `isMessageActionSheetOpen` to check
BottomSheet is open or not (via onDismiss) in
`showMessageActionSheet`.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 18, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
029c9a8 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 21, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
30f20c6 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 21, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
a0aba57 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Jan 24, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
79b68c1 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 7, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
7534781 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 7, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
d4981ee 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 7, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
bd7396b 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 11, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
92274ad 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 20, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
b6406f0 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this issue Feb 20, 2025
@Gaurav-Kushwaha-1225
message_list: added pressedTint feature
2610fa3 
It allows to see a tint color on the message
when it is pressed.

Moved `MessageWithPossibleSender` to `StatefulWidget`
and used `ModalStatus` return type of
`showMessageActionSheet` to check whether BottomSheet
is open or not.

Added `pressedTint` to `DesignVariables` for using
it in `MessageWithPossibleSender`.

Added tests too in `message_list_test.dart`.

Fixes: zulip#1142
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
a-design Visual and UX design a-msglist The message-list screen, except what's label:a-content beta feedback Things beta users have specifically asked for
Projects
Flutter app
Status: No status
Milestone
M6: Post-launch
3 participants
@gnprice @chrisbobbe @Gaurav-Kushwaha-1225