Add topic-list page #1500
Add topic-list page #1500
Conversation
PIG208
force-pushed
the
pr-topics
branch
2 times, most recently
from
a2d1174 to
e8fb3c3
Compare
|
Updated the PR to implement a intentional deviation from the Figma design on aligning items, discussed in #mobile-team > topic list item alignment @ 💬. |
|
For the "small" and "large" screenshots, I think it would look much better if the checkmarks and indicators on the right scaled too. |
|
Let's name the option "List of topics". I think that's a bit easier to parse, and it's what we're currently testing for the web app UI. |
Seems reasonable. I'd want to clamp the scale factor, for the reasons described at #1023. (For existing examples of implementing that, search for |
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]>
|
Thanks both! Updated the PR and the screenshots. I picked 1.5 to be the I clamped only the icons, though, not the topic name text. Because I think #1023 applies to scaling relatively unimportant information. |
|
Works for me, thanks! |
Stacked on top of #1491.
Some non-goals of this change are deferred to #1499. In this implementation, we fetch the topics but do not handle all events to receive live-updates. It's expected that when topics are resolved/unresolved or moved, or when new messages arrived, the changes to the topic-list will not be seen until the next fetch.
We also skip thinning down the app bar, since that will require work on app bars on message-list page too.
The PR is structured to encourage side-by-side comparison with similar existing code. Namely
_TopicItemfromlib/widgets/inbox.dartandMessageListAppBarTitle.Fixes: #1158
screenshots (taken on my Android device, hence the left-aligned app bar!)
debugDefaultTargetPlatformOverride = TargetPlatform.iOS: