Allows icons to be set on primary actions of Page component (#11780)

### WHY are these changes introduced?

Fixes an issue where icons are not shown on "primary" `Page` actions due
to legacy code that hid them on desktop screen sizes.

### WHAT is this pull request doing?

With newer guidance from UX that icons should be used more broadly for
common actions, this change allows icon only buttons as well as icons
with text buttons to be shown on desktop as primary Page actions while
continuing to have the functionality of only displaying the icon and not
the content text on mobile screens.

No changes to the interface here but the underlying `Header` component
in `Page` now doesn't silently hide icons on desktop.

### How to 🎩

🖥 [Local development
instructions](https://github.com/Shopify/polaris/blob/main/README.md#install-dependencies-and-build-workspaces)
🗒 [General tophatting
guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md)
📄 [Changelog
guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog)

### 🎩 checklist

- [x] Tested a
[snapshot](https://github.com/Shopify/polaris/blob/main/documentation/Releasing.md#-snapshot-releases)
- [x] Tested on
[mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing)
- [x] Tested on [multiple
browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers)
- [x] Tested for
[accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md)
- [ ] Updated the component's `README.md` with documentation changes
- [ ] [Tophatted
documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md)
changes in the style guide

.changeset/fluffy-monkeys-compete.md

@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': minor
+---
+
+allows icons to be displayed on primary actions on Page component

polaris-react/src/components/Page/components/Header/Header.tsx

@@ -309,14 +309,13 @@ function shouldShowIconOnly(
   isMobile: boolean,
   action: PrimaryAction,
 ): PrimaryAction {
-  let {content, accessibilityLabel, icon} = action;
+  let {content, accessibilityLabel} = action;
+  const {icon} = action;
   if (icon == null) return {...action, icon: undefined};
 
   if (isMobile) {
     accessibilityLabel = accessibilityLabel || content;
     content = undefined;
-  } else {
-    icon = undefined;
   }
 
   return {

polaris-react/src/components/Page/components/Header/tests/Header.test.tsx

@@ -353,7 +353,7 @@ describe('<Header />', () => {
     });
   });
 
-  it('renders a compact desktop layout and hides primary action icon', () => {
+  it('renders a compact desktop layout and shows primary action icon', () => {
     const header = mountWithApp(
       <Header title="mmmmmmmm" primaryAction={primaryAction} />,
       {
@@ -362,7 +362,7 @@ describe('<Header />', () => {
     );
     expect(header.findAll('div', {className: 'Row'})).toHaveLength(1);
     expect(header).toContainReactComponent(Button, {
-      icon: undefined,
+      icon: PlusIcon,
       children: 'Click me!',
     });
   });