List of topics in channel #1158

gnprice · 2024-12-13T23:18:58Z

In the legacy app, if you're looking at the messages in a topic, we have a button in the app bar (a "list" icon) that gets you a list of all the topics in that channel. It's sorted by recency, and shows the number of unreads, whether you have an @-mention, and whether the topic is muted etc.

Basically it's similar to what you get in the web left sidebar after hitting "Show all topics" under a given channel.

We should offer the same thing in the new app. I wasn't sure people really use that feature; but it came up in user feedback after yesterday's beta announcement, so that's a sign that people do.

Design

Design is in Figma:
https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=6819-35869&m=dev

For this issue, differences from the design there:

The design shows a "pinned topics" feature, which is a possible future Zulip feature but doesn't currently exist. Pending that feature, we'll leave out the "pinned" icon, and avoid using up horizontal space for it.
For this first version, let's leave out the "filter" feature. I'll file a post-launch followup issue for that. → Filter topics in topic-list screen #1384
For this issue, we'll leave out the "New topic" button and the modal it leads to. I'll file a separate, post-launch issue for that. → "New topic" modal from list of topics in channel #1385

Implementation

The list of topics will come from making a request to the server, after opening the page.

As a follow-up task, after getting the list for a given channel we might store it (on ChannelStore), and keep it up to date when handling events, so that coming back a second time to this topic-list page for a given channel is fast. For this PR, though, that's out of scope. Instead the list of topics can just live on a StatefulWidget for the page.

References

Design thread: #mobile-design > Topic list in channel
A different feature serving some of the same use cases: Show topics on channels page #412

The text was updated successfully, but these errors were encountered:

chrisbobbe · 2024-12-27T21:15:39Z

Tim and others propose featuring this page more prominently than the interleaved channel view:

Tim said:

I've never been happy with the legacy app's approach of having the channel feed be what clicking on a channel takes you to by default. We've been moving towards it being a secondary action on channels in the web app, and I think it'd be wise to just make the default click be the list of topics, and channel feed be the thing that's a smaller tap target button.

chrisbobbe · 2024-12-27T21:17:06Z

And another long-time Zulip user said:

In the old app, opening a channel from the channel view shows a feed of all the messages in the channel, but it has a button in the upper right that looks like a list, which opens a view of all topics with a single line for each topic.

In the new app, there doesn't seem to be any way to show all the topics in a channel without showing the messages within those topics.

(In an ideal world, that would be the default view I get when opening a channel.)

chrisbobbe · 2024-12-27T21:17:39Z

Another user said:

[…] it feels unnatural to always browse all messages in all topics. Topics can be really long like folks talking about Haiku operating system.

And browsing all of them to cherry pick something is also a pain.

chrisbobbe · 2025-02-04T23:41:06Z

From a review in the Google Play Console:

It is nice, but the absence of a search bar (at least to search for topics) makes it frustrating to use.

I assume we'll want this list of topics to be searchable, like in zulip-mobile.

Add "Show topics" button tooltip and "Search topics" placeholder text to all language files (English, Slovak, Norwegian, Polish, Russian, Arabic, and Japanese). Fixes part of zulip#1158.

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Fixes part of zulip#1158.

Add topic list button to app bar actions in message list view. The button appears in channel narrows and navigates to the topic list page when pressed. Uses the topic icon and localized tooltip. Fixes zulip#1158.

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Fixes part of zulip#1158.

Add topic list button to app bar actions in message list view. The button appears in channel narrows and navigates to the topic list page when pressed. Uses the topic icon and localized tooltip. Fixes zulip#1158.

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Also adds a button to app bar actions in message list page which appears in channel narrows and navigates to the topic list page when pressed Fixes zulip#1158.

gnprice · 2025-02-28T01:19:31Z

@lakshya1goel plans to implement this feature; see #mobile-design > Topic list in channel @ 💬.

gnprice · 2025-03-06T00:55:29Z

We now have a design for this feature; I've updated the issue description with details.

fixes: zulip#1158

lakshya1goel · 2025-04-01T17:20:17Z

Hi, PR #1449 is ready for review, PTAL. Thanks!

fixes: zulip#1158

chrisbobbe · 2025-04-22T20:51:24Z

This came up in beta feedback: #mobile > Flutter Beta: Some Feedback @ 💬

fixes: zulip#1158

gnprice · 2025-05-01T20:27:38Z

Copying here what I wrote just now (#1449 (comment)) on the PR:

Thanks @lakshya1goel for your work on this issue. I think we'll be able to get this to something we're happy to merge much more quickly by having one of us on the core team drive it, so I've asked @PIG208 to take it on.

The topic-list page app bar should match the Figma design except for its height. That part needs to be coordinated with other pages. Also on the topic-list page app bar, the icon "chveron_down.svg" (originally "chveron-down-16.svg") comes from: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=6820-36184&m=dev and not the "Icons" page, since the "chveron-down" there appears to be different from the one on the topic list page design. We also leave out the new topic button and topic filtering. Those are out-of-scope for zulip#1158. --- On the message-list page, "TOPICS" is not aligned to the middle part of the app bar, that's because we haven't got to zulip#1039 yet. --- The topic-list implementation is quite similar to parts of inbox page and message-list page. Therefore, we structure the code to make them look similar to compare for changes side-by-side to help with reviewing what has changed. Figma design: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=6819-35869&m=dev

The icon was taken from CZO discussion: https://chat.zulip.org/#narrow/channel/530-mobile-design/topic/Topic.20list.20in.20channel/near/2140324 Fixes: zulip#1158 Co-authored-by: Zixuan James Li <[email protected]>

The topic-list page app bar should match the Figma design except for its height. That part needs to be coordinated with other pages. Also on the topic-list page app bar, the icon "chveron_down.svg" (originally "chveron-down-16.svg") comes from: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=6820-36184&m=dev and not the "Icons" page, since the "chveron-down" there appears to be different from the one on the topic list page design. We also leave out the new topic button and topic filtering. Those are out-of-scope for zulip#1158. --- On the message-list page, "TOPICS" is not aligned to the middle part of the app bar, that's because we haven't got to zulip#1039 yet. --- The topic-list implementation is quite similar to parts of inbox page and message-list page. Therefore, we structure the code to make them look similar to compare for changes side-by-side to help with reviewing what has changed. Figma design: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=6819-35869&m=dev

The icon was taken from CZO discussion: https://chat.zulip.org/#narrow/channel/530-mobile-design/topic/Topic.20list.20in.20channel/near/2140324 Fixes: zulip#1158 Co-authored-by: Zixuan James Li <[email protected]>

This removes the ad-hoc color we use for null subscriptions, which is a workaround for not having logic to generate different base colors within constraints for unsubscribed channels: https://chat.zulip.org/#narrow/channel/48-mobile/topic/All.20channels.20screen.20-.20.23F832/near/1904009 While this change does not implement that logic either, it removes the ad-hoc color in favor of a constant base color, intended for colorSwatchFor. The base color can be reused on topic-list page (zulip#1158), giving us access to `.iconOnBarBackground` and friends for the app bar.

gnprice added the beta feedback Things beta users have specifically asked for label Dec 13, 2024

gnprice added this to the M6: Post-launch milestone Dec 13, 2024

github-project-automation bot added this to Flutter app Dec 13, 2024

gnprice mentioned this issue Dec 14, 2024

Show topics on channels page #412

Open

gnprice modified the milestones: M6: Post-launch, M5: Launch Dec 18, 2024

PIG208 assigned PIG208 and unassigned PIG208 Dec 23, 2024

chrisbobbe added the a-design Visual and UX design label Dec 27, 2024

gnprice modified the milestones: M5: Launch, M5-a: Server 10 Jan 14, 2025

This comment has been minimized.

Sign in to view

E-m-i-n-e-n-c-e added a commit to E-m-i-n-e-n-c-e/zulip-flutter that referenced this issue Feb 26, 2025

msglist: Add topic list page

a0c9f2f

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Fixes part of zulip#1158.

E-m-i-n-e-n-c-e added a commit to E-m-i-n-e-n-c-e/zulip-flutter that referenced this issue Feb 26, 2025

msglist: Add topic list page

f75e83b

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Fixes part of zulip#1158.

E-m-i-n-e-n-c-e mentioned this issue Feb 26, 2025

msglist: Show list of topics in channel #1378

Closed

E-m-i-n-e-n-c-e added a commit to E-m-i-n-e-n-c-e/zulip-flutter that referenced this issue Feb 26, 2025

msglist: Add topic list page

40ed9b2

This commit creates a new topic list page showing all topics in current channel with search functionality ordered by recency Fixes part of zulip#1158.

gnprice mentioned this issue Mar 6, 2025

Filter topics in topic-list screen #1384

Open

This comment has been minimized.

Sign in to view

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 29, 2025

topicList: Add topic list page for each channel

c317fbe

fixes: zulip#1158

lakshya1goel mentioned this issue Mar 29, 2025

topicList: Add topic list page for each channel #1449

Closed

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 29, 2025

topicList: Add topic list page for each channel

3ccccf3

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 29, 2025

topicList: Add topic list page for each channel

dfc6f79

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 30, 2025

topicList: Add topic list page for each channel

6f6e5b6

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 30, 2025

topicList: Add topic list page for each channel

5dea5f1

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Mar 30, 2025

topicList: Add topic list page for each channel

5a7871f

fixes: zulip#1158

gnprice assigned lakshya1goel Apr 2, 2025

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Apr 2, 2025

topicList: Add topic list page for each channel

504056a

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Apr 8, 2025

topicList: Add topic list page for each channel

4d29e1a

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue Apr 9, 2025

topicList: Add topic list page for each channel

771f58c

fixes: zulip#1158

PIG208 mentioned this issue Apr 30, 2025

Compute colorSwatchFor when subscription is null #1491

Open

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue May 1, 2025

topicList: Add topic list page for each channel

bade99a

fixes: zulip#1158

lakshya1goel added a commit to lakshya1goel/zulip-flutter that referenced this issue May 1, 2025

topicList: Add topic list page for each channel

67e3004

fixes: zulip#1158

gnprice assigned PIG208 and unassigned lakshya1goel May 1, 2025

PIG208 mentioned this issue May 6, 2025

Keep track of topics in ChannelStore #1499

Open

PIG208 linked a pull request May 6, 2025 that will close this issue

Add topic-list page #1500

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

List of topics in channel #1158

List of topics in channel #1158

gnprice commented Dec 13, 2024 •

edited

Loading

chrisbobbe commented Dec 27, 2024

chrisbobbe commented Dec 27, 2024

chrisbobbe commented Dec 27, 2024 •

edited by gnprice

Loading

chrisbobbe commented Feb 4, 2025

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

gnprice commented Feb 28, 2025

gnprice commented Mar 6, 2025

This comment has been minimized.

This comment has been minimized.

lakshya1goel commented Apr 1, 2025

chrisbobbe commented Apr 22, 2025

gnprice commented May 1, 2025

List of topics in channel #1158

List of topics in channel #1158

Comments

gnprice commented Dec 13, 2024 • edited Loading

Design

Implementation

References

chrisbobbe commented Dec 27, 2024

chrisbobbe commented Dec 27, 2024

chrisbobbe commented Dec 27, 2024 • edited by gnprice Loading

chrisbobbe commented Feb 4, 2025

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

gnprice commented Feb 28, 2025

gnprice commented Mar 6, 2025

This comment has been minimized.

This comment has been minimized.

lakshya1goel commented Apr 1, 2025

chrisbobbe commented Apr 22, 2025

gnprice commented May 1, 2025

gnprice commented Dec 13, 2024 •

edited

Loading

chrisbobbe commented Dec 27, 2024 •

edited by gnprice

Loading