Show current organization's name and logo atop main menu #1937

rajveermalviya · 2025-10-22T14:39:33Z

Light	Dark

Figma: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=2940-48987&p=f&m=dev
Fixes: #1037

alya · 2025-10-23T17:14:30Z

Hm, looking at this now, I don't like the "Organizations" button there. It's not immediately apparent what organizations it's referring to/why.

Where does it go? The account switcher?

rajveermalviya · 2025-10-23T18:03:36Z

Where does it go? The account switcher?

Correct in the current revision it goes to the account switcher button, also the Figma design doesn't have a separate "Switch account" button in the main menu.

alya · 2025-10-23T18:08:32Z

Can you just click on the org name itself to switch accounts?

alya · 2025-10-23T18:09:00Z

(If we're moving the account switching action to this new top line, we'll want to remove the "switch account" option in the same PR.)

chrisbobbe

Thanks! Comments below, and see also Alya's feedback (mentioning it so it doesn't get lost in the thread).

chrisbobbe · 2025-10-23T22:58:26Z

lib/model/store.dart

-  String? get realmName => account.realmName;
-
-  Uri? get realmIcon => account.realmIcon;
+  // The `account` is populated with the `realmName` before
+  // PerAccountStore is created, so this should never be null.
+  // See `UpdateMachine.load`.
+  String get realmName => account.realmName!;
+
+  // The `account` is populated with the `realmIcon` before
+  // PerAccountStore is created, so this should never be null.
+  // See `UpdateMachine.load`.
+  Uri get realmIcon => account.realmIcon!;


store: Make realmName and realmIcon getters non-null

Commit-message nit: "non-nullable", right? Also the commit message repeats reasoning that's already clear from added code comments, so we can remove it from the commit message.

chrisbobbe · 2025-10-23T23:02:12Z

test/widgets/home_test.dart

    testWidgets('_AboutZulipButton', (tester) async {
+      tester.view.physicalSize = Size(1080, 1920);
+      prepareBoringImageHttpClient();
      await prepare(tester);
      await tapOpenMenuAndAwait(tester);
      await tapButtonAndAwaitTransition(tester, find.byIcon(ZulipIcons.info));
      check(find.byType(AboutZulipPage)).findsOne();
+      debugNetworkImageHttpClientProvider = null;
    });


Rather than thinking through what's accomplished with the numbers 1080 and 1920 and whether they're correct, I'd rather just scroll until the button is in view:

testWidgets('_AboutZulipButton', (tester) async { prepareBoringImageHttpClient(); await prepare(tester); await tapOpenMenuAndAwait(tester); await tester.ensureVisible(find.byIcon(ZulipIcons.info)); await tapButtonAndAwaitTransition(tester, find.byIcon(ZulipIcons.info)); check(find.byType(AboutZulipPage)).findsOne(); debugNetworkImageHttpClientProvider = null; });

That's simpler and more transparent, and also adds some coverage of the scrolling logic; it seems like a win-win :)

chrisbobbe · 2025-10-23T23:04:44Z

lib/widgets/home.dart

+    final designVariables = DesignVariables.of(context);
+    final store = PerAccountStoreWidget.of(context);
+
+    final realmIconUrl = store.tryResolveUrl(store.realmIcon.toString());


Most of this line seems like code we'd rather not need to recite whenever we need the realm icon—should be possible to encapsulate it in PerAccountStore (maybe even Account?) where we have access to the realm URL.

chrisbobbe · 2025-10-23T23:05:49Z

lib/widgets/home.dart

+      padding: const EdgeInsets.only(top: 6),
+      child: Row(children: [
+        Expanded(child: Padding(
+          padding: const EdgeInsets.fromLTRB(12, 6, 4, 6),


Use EdgeInsetsDirectional.fromSTEB here, for RTL support.

chrisbobbe · 2025-10-23T23:09:32Z

lib/widgets/home.dart

+                MaterialWidgetRoute(page: const ChooseAccountPage()));
+            },
+            style: TextButton.styleFrom(
+              padding: const EdgeInsets.fromLTRB(8, 7, 14, 7),


(Same comment about EdgeInsetsDirectional.fromSTEB.)

chrisbobbe · 2025-10-23T23:37:08Z

lib/widgets/home.dart

+                ? RealmContentNetworkImage(realmIconUrl)
+                : const SizedBox.shrink()),


When the icon URL doesn't parse for whatever reason, and also when it does but the network request fails, how about we show an empty rounded square colored by DesignVariables.avatarPlaceholderBg? Maybe we could have a reusable RealmIconImage widget that takes care of that, much like AvatarImage takes care of choosing a placeholder (which it'll do in more cases with #1558).

chrisbobbe · 2025-10-23T23:42:25Z

lib/widgets/home.dart

+/// The main-menu sheet.
+///
+/// Figma link:
+///   https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=11367-20647&t=lSnHudU6l7NWx0Fa-0


This URL is taking me to the "Read receipts" sheet; do you reproduce? (Could be a Figma issue)

chrisbobbe · 2025-10-23T23:47:00Z

lib/widgets/home.dart

+              backgroundColor: Colors.transparent,
+              overlayColor: Colors.transparent,
+              splashFactory: NoSplash.splashFactory,
+              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),


This border radius shouldn't make a difference, with a transparent background/overlay/etc., right? I see it in the Figma, but it looks accidental there, too; I think we can leave it out without comment.

rajveermalviya · 2025-10-28T15:21:39Z

Thanks for the reviews @chrisbobbe, @alya.
Pushed an update, and also updated the screenshots in the description, PTAL.

This helper will be used soon to display organization logo in various places.

Fixes: zulip#1037

alya · 2025-10-28T21:54:59Z

Seems reasonable to me, thanks! Open to feedback from @terpimost if he has another suggestion.

rajveermalviya added the maintainer review PR ready for review by Zulip maintainers label Oct 22, 2025

rajveermalviya assigned chrisbobbe Oct 22, 2025

rajveermalviya requested a review from chrisbobbe October 22, 2025 14:39

chrisbobbe reviewed Oct 24, 2025

View reviewed changes

rajveermalviya added 2 commits October 28, 2025 15:43

store: Make realmName and realmIcon getters non-nullable

87ddd72

store [nfc]: Rename _tryResolveUrl to _tryResolveUrlStr

c40a8d9

rajveermalviya force-pushed the pr-org-name-menu branch from 4e5d5f9 to 0d41609 Compare October 28, 2025 15:15

rajveermalviya requested a review from chrisbobbe October 28, 2025 15:21

store: Add resolveRealmIconUrl

83f3f9e

This helper will be used soon to display organization logo in various places.

rajveermalviya force-pushed the pr-org-name-menu branch from 0d41609 to 1dc1fb7 Compare October 28, 2025 15:25

home: Show current organization's name and logo atop main menu

c9c67d6

Fixes: zulip#1037

rajveermalviya force-pushed the pr-org-name-menu branch from 1dc1fb7 to c9c67d6 Compare October 28, 2025 19:02

		? RealmContentNetworkImage(realmIconUrl)
		: const SizedBox.shrink()),

Show current organization's name and logo atop main menu #1937

Are you sure you want to change the base?

Show current organization's name and logo atop main menu #1937

Conversation

rajveermalviya commented Oct 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

alya commented Oct 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rajveermalviya commented Oct 23, 2025

Uh oh!

alya commented Oct 23, 2025

Uh oh!

alya commented Oct 23, 2025

Uh oh!

chrisbobbe left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rajveermalviya commented Oct 28, 2025

Uh oh!

alya commented Oct 28, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

rajveermalviya commented Oct 22, 2025 •

edited

Loading

alya commented Oct 23, 2025 •

edited

Loading