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.

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

"Whole channel" button from topic narrows #1040

Open
gnprice opened this issue Nov 1, 2024 · 3 comments
Open

"Whole channel" button from topic narrows #1040

gnprice opened this issue Nov 1, 2024 · 3 comments
Labels
a-msglist The message-list screen, except what's label:a-content

Comments

@gnprice
Copy link
Member

gnprice commented Nov 1, 2024

When viewing the message list for a topic narrow, we should have a quick way to get to the enclosing stream/channel narrow.

In the legacy zulip-mobile app, this is just a button in the app bar, with an "up" icon. In a future with a fancier app bar for these message lists (as in #1039), we may do something fancier; but for now, let's just follow the legacy app and have a button.

One update from the legacy app, though: instead of an "up" icon, let's use the "all messages" / "combined feed" icon. That's the same one that web now uses in the channel menu in the left sidebar, for the new "Go to channel feed" option.

I'm giving this the near-term "Beta 4" milestone, because when I was demoing Zulip in person a lot earlier this week, I repeatedly found the lack of it awkward. (Specifically the use case was that I was viewing one conversation and wanted to start a new one. There are other ways we could serve that use case; but any deeper re-imagining of that UX is a post-launch issue.)

@gnprice gnprice added the a-msglist The message-list screen, except what's label:a-content label Nov 1, 2024
@gnprice gnprice added this to the Beta 4: Fall 2024 milestone Nov 1, 2024
@Dhanesh-Sawant
Copy link

Dhanesh-Sawant commented Nov 9, 2024

Hi @gnprice @chrisbobbe

I've implemented the "Whole channel" button within the MessageListAppBarTitle for the TopicNarrow. Here's a brief overview of the approach I've taken:

In the TopicNarrow case of the MessageListAppBarTitle component, I'm currently returning a Row that includes:
The _buildStreamRow method to display the stream and topic names.

An IconButton (currently with an "up" arrow icon) to navigate to the enclosing channel view.
The IconButton triggers Navigator.pushReplacement to navigate to the MessageListPage with a ChannelNarrow for the given streamId. This way, it directly takes the user back to the channel view without adding a new route to the navigation stack.

      case TopicNarrow(:var streamId, :var topic):
        final store = PerAccountStoreWidget.of(context);
        final stream = store.streams[streamId];
        final streamName = stream?.name ?? '(unknown channel)';
        return Row(
          children: [
            Expanded(
              child: _buildStreamRow(
                context,
                stream: stream,
                text: "$streamName > $topic",
              ),
            ),
            IconButton(
              icon: Icon(Icons.arrow_upward),
              tooltip: 'Go to channel feed',
              onPressed: () => Navigator.pushReplacement(
                context,
                MessageListPage.buildRoute(
                  context: context,
                  narrow: ChannelNarrow(streamId),
                ),
              ),
            ),
          ],
        );

output:-
https://github.com/user-attachments/assets/83ac306b-62bd-454e-b66f-4e2a4e2db57b

Could you confirm if this approach aligns with the design intent for navigating to the enclosing stream/channel narrow?

@Dhanesh-Sawant
Copy link

@gnprice @chrisbobbe can u please go through the above approach?

@PIG208
Copy link
Member

PIG208 commented Nov 14, 2024

@Dhanesh-Sawant If you want to share more details of what you're doing, please start a PR thread or a chat thread in #mobile-dev-help. Let's keep this issue thread clear so it's readable for discussion of the issue itself.

Dhanesh-Sawant added a commit to Dhanesh-Sawant/zulip-flutter that referenced this issue Nov 15, 2024
Dhanesh-Sawant added a commit to Dhanesh-Sawant/zulip-flutter that referenced this issue Nov 15, 2024
This commit relocates the "up arrow" navigation button to the ZulipAppBar for a TopicNarrow, enhancing the user interface by aligning with common navigation patterns.

Changes made:

- An IconButton is now added directly to the actions array of ZulipAppBar when the narrow context is a TopicNarrow.

- The previous method of returning a row with navigation embedded in the MessageListAppBarTitle component has been removed, simplifying the code.

Fixes zulip#1040.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a-msglist The message-list screen, except what's label:a-content
Projects
Status: No status
Development

No branches or pull requests

3 participants