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

UI for channel muting/unmuting #347

Open
gnprice opened this issue Oct 31, 2023 · 5 comments
Open

UI for channel muting/unmuting #347

gnprice opened this issue Oct 31, 2023 · 5 comments
Labels
beta feedback Things beta users have specifically asked for
Milestone
M6: Post-launch

Comments

@gnprice
Copy link
Member

gnprice commented Oct 31, 2023 •
edited by chrisbobbe
Loading

This will be a followup from #346.

In zulip-mobile, we offer this in two places:

  • From the "stream info screen" ("i" icon button) for a channel/stream.
  • From the channel action sheet, which you get by long-pressing on a channel name:
    • in the app bar for a channel narrow;
    • in the various places the StreamItem component is used, including the inbox screen and the list-of-channels screen.

We should do something broadly comparable, though we might not organize things quite the same way.

Related issues:
@gnprice gnprice added the a-settings UI to show and edit settings and do admin tasks label Oct 31, 2023
@gnprice gnprice added this to the Launch milestone Oct 31, 2023
@gnprice gnprice mentioned this issue Oct 31, 2023
Closed
@gnprice gnprice mentioned this issue Nov 28, 2023
Closed
@gnprice gnprice modified the milestones: Launch, B2: Summer 2024 May 9, 2024
@shivanshsharma13
Copy link
Contributor

shivanshsharma13 commented Nov 29, 2024 •
edited
Loading

Hi @gnprice, Greetings for the day!

I tried to build this functionality the same way what we have done in action sheet for the message list. Here is a recording. Please let me know.

I am new to codebase so I might need some help for the structuring and following the code practices, else I can open a related PR 🙂

mute.mp4

Edited-

Hi @PIG208, Greetings!

I saw your commits for #348 and now have a clearer understanding of the structure we're following. I believe we can apply a similar approach for implementing the stream mute/unmute functionality. Correct me if I’m wrong, but it seems we’ll need to handle all scenarios related to the bottom navigation within the action_sheet.

I can work on this and raise a PR once #1041 is merged. Let me know your thoughts!

@gnprice
Copy link
Member Author

gnprice commented Dec 5, 2024

Cool, thanks. Yeah, the structure in #1041 (after whatever revisions we make before it's merged) will be the right thing to base this on.

@chrisbobbe chrisbobbe mentioned this issue Dec 10, 2024
Merged
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 10, 2024
@PIG208
msglist: Show topic visibility on app bar
8ff7abd 
The referenced design from the legacy mobile app displays
the 'mute' icon when the channel is muted, replacing a privacy
level related icon (e.g.: web public, invite only):
  https://github.com/zulip/zulip-mobile/blob/a115df1f71c9dc31e9b41060a8d57b51c017d786/src/streams/StreamIcon.js#L20-L29
We diverge from that in the Flutter app.  We will have a different
place to show channel mute/unmute status in zulip#347.

This implementation also shows the corresponding icons for 'muted' and
'unmuted' topics; previously, only the icon for 'follow' was displayed.
And we continue using the existing icons in the Flutter app, without
trying to match the exact ones in the old design.

Signed-off-by: Zixuan James Li <[email protected]>
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 10, 2024
@PIG208
msglist: Show topic visibility on app bar
e10fbbe 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

Signed-off-by: Zixuan James Li <[email protected]>
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 10, 2024
@PIG208
msglist: Show topic visibility on app bar
eb67f92 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 10, 2024
@PIG208
msglist: Show topic visibility on app bar
24b5baf 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 11, 2024
@PIG208
msglist: Show topic visibility on app bar
83e6ca6 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
PIG208 added a commit to PIG208/zulip-flutter that referenced this issue Dec 11, 2024
@PIG208
msglist: Show topic visibility on app bar
d695e4e 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
gnprice pushed a commit to PIG208/zulip-flutter that referenced this issue Dec 11, 2024
@PIG208 @gnprice
msglist: Show topic visibility on app bar
8540c29 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
shivanshsharma13 pushed a commit to shivanshsharma13/zulip-flutter that referenced this issue Dec 13, 2024
@PIG208 @shivanshsharma13
msglist: Show topic visibility on app bar
37e376c 
The design took some inspiration from the legacy mobile app.

This displays a privacy level related icon (e.g.: web public,
invite only).  We will have a different place to show channel
mute/unmute status in zulip#347.

The color for the icon is taken from the web app:
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/message_header.css#L296-L297
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L590
  https://github.com/zulip/zulip/blob/dc58c8450f8524f226115a7b449b05e01ae15d8b/web/styles/app_variables.css#L1330

In the web app, these colors are used for the topic visibility icons
on message recipient headers.

To maintain the different conventional title alignment on iOS and
Android, we borrow some checks from AppBar in title centering.

Signed-off-by: Zixuan James Li <[email protected]>
@gnprice gnprice changed the title UI for stream muting/unmuting UI for channel muting/unmuting Dec 27, 2024
@chrisbobbe chrisbobbe mentioned this issue Dec 27, 2024
Open
4 tasks
@chrisbobbe chrisbobbe added the beta feedback Things beta users have specifically asked for label Dec 27, 2024
@chrisbobbe
Copy link
Collaborator

I think a "channel action sheet", in the style of the existing topic action sheet, is a fine place for this.

@chrisbobbe
Copy link
Collaborator

This came up in beta feedback on CZO:

In the new app, I don't see any way to unsubscribe / mute / notifications / add subscriber.

@chrisbobbe
Copy link
Collaborator

chrisbobbe commented Dec 27, 2024 •
edited
Loading

Tentatively removing the a-settings label (feel free to add it back 🙂), which I think makes this feature sound like a bigger effort than it is. It's comparable to

which didn't get that label. I don't think we need more new UI than a "channel action sheet" for this feature, especially in a first pass. That should be easier than any alternative, now that we have a topic action sheet to model it on.

@chrisbobbe chrisbobbe removed the a-settings UI to show and edit settings and do admin tasks label Dec 27, 2024
@chrisbobbe chrisbobbe mentioned this issue Dec 27, 2024
Open
This was referenced Dec 27, 2024
Open
Open
@chrisbobbe chrisbobbe mentioned this issue Jan 4, 2025
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
beta feedback Things beta users have specifically asked for
Projects
Flutter app
Status: No status
Milestone
M6: Post-launch
Development

No branches or pull requests
3 participants
@gnprice @chrisbobbe @shivanshsharma13