Polaris-react: [TopBar] UserMenu is left-aligned if SearchField isn't included

[cboltt]

Issue summary

When using the Top Bar component without a Search Field, the Top Bar's User Menu is left-aligned. I believe it should always be right-aligned.

The best way to see the issue is through this CodePen: https://codesandbox.io/s/7yqwzpj1q0

Expected behavior

Not including a Search Field (which is an optional prop) on Top Bar shouldn't affect the positioning of User Menu (it should always be right-aligned).

I am making an assumption here: maybe the current behaviour is expected.

Actual behavior

Failing to include a Search Field causes the User Menu to be left-aligned.

Steps to reproduce the problem

1. Implement a Top Bar component following the guidelines but without including a Search Field

Reduced test case

https://codesandbox.io/s/7yqwzpj1q0

Specifications

• Are you using the React components? (Y/N): Y
• Polaris version number: 3.0.0-rc.6
• Browser: Chrome
• Device: Macbook Pro
• Operating System: MacOS

[probot-shopify[bot]]

👋 Thanks for opening your first issue. A contributor should give feedback soon. If you haven’t already, please check out the contributing guidelines. You can also join #polaris on the Shopify Partners Slack.

[danrosenthal]

Not including a Search Field (which is an optional prop) on Top Bar shouldn't affect the positioning of User Menu (it should always be right-aligned).

I am making an assumption here: maybe the current behaviour is expected.

I think this makes sense. Elements should be aligned right without necessitating a search bar. That sounds like the fix to me, so long as it doesn't negatively impact the position of the search bar.

[cboltt]

@danrosenthal Should I take a stab at a PR?

[tmlayton]

Should I take a stab at a PR?

Please, that would be great!

[danrosenthal]

@danrosenthal Should I take a stab at a PR?

Yes, please!