-
diff --git a/projects/packages/my-jetpack/changelog/fix-admin-notices-inside-header b/projects/packages/my-jetpack/changelog/fix-admin-notices-inside-header
new file mode 100644
index 000000000000..bea8b1a04d18
--- /dev/null
+++ b/projects/packages/my-jetpack/changelog/fix-admin-notices-inside-header
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Move admin notices and JITMs below the tab bar instead of rendering inside the page header.
diff --git a/projects/packages/publicize/_inc/components/admin-page/header/index.js b/projects/packages/publicize/_inc/components/admin-page/header/index.js
index 694aee4b888c..d2e233e4ece3 100644
--- a/projects/packages/publicize/_inc/components/admin-page/header/index.js
+++ b/projects/packages/publicize/_inc/components/admin-page/header/index.js
@@ -1,5 +1,4 @@
import { Button, Col, Container, H3 } from '@automattic/jetpack-components';
-import { ConnectionError, useConnectionErrorNotice } from '@automattic/jetpack-connection';
import { getAdminUrl } from '@automattic/jetpack-script-data';
import { useDispatch, useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
@@ -15,41 +14,27 @@ const Header = () => {
};
} );
- const { hasConnectionError } = useConnectionErrorNotice();
-
const { openConnectionsModal } = useDispatch( socialStore );
return (
- <>
-
- { hasConnectionError && (
-
-
-
- ) }
-
-
-
-
-
-
- { __( 'Write once, post everywhere', 'jetpack-publicize-pkg' ) }
-
- { isModuleEnabled && ! hasConnections && (
-
- ) }
-
+
+
);
};
diff --git a/projects/packages/publicize/_inc/components/admin-page/header/styles.module.scss b/projects/packages/publicize/_inc/components/admin-page/header/styles.module.scss
index d0d97cee02d4..9c8638a69b66 100644
--- a/projects/packages/publicize/_inc/components/admin-page/header/styles.module.scss
+++ b/projects/packages/publicize/_inc/components/admin-page/header/styles.module.scss
@@ -57,10 +57,6 @@
}
}
-.connection-error-col {
- margin-top: 25px;
-}
-
.bar-wrapper {
margin-bottom: var(--spacing-base);
diff --git a/projects/packages/publicize/_inc/components/admin-page/index.tsx b/projects/packages/publicize/_inc/components/admin-page/index.tsx
index e5d94e1c2220..fcd6bfbe4041 100644
--- a/projects/packages/publicize/_inc/components/admin-page/index.tsx
+++ b/projects/packages/publicize/_inc/components/admin-page/index.tsx
@@ -6,7 +6,11 @@ import {
Col,
GlobalNotices,
} from '@automattic/jetpack-components';
-import { useConnection } from '@automattic/jetpack-connection';
+import {
+ ConnectionError,
+ useConnection,
+ useConnectionErrorNotice,
+} from '@automattic/jetpack-connection';
import {
getMyJetpackUrl,
isJetpackSelfHostedSite,
@@ -25,7 +29,7 @@ import ConnectionScreen from './connection-screen';
import Header from './header';
import InfoSection from './info-section';
import PricingPage from './pricing-page';
-import './styles.module.scss';
+import styles from './styles.module.scss';
import SupportSection from './support-section';
import SocialImageGeneratorToggle from './toggles/social-image-generator-toggle';
import SocialModuleToggle from './toggles/social-module-toggle';
@@ -38,6 +42,7 @@ export const SocialAdminPage = () => {
const isJetpackSite = isJetpackSelfHostedSite();
const { isUserConnected, isRegistered } = useConnection();
+ const { hasConnectionError } = useConnectionErrorNotice();
const showConnectionCard = ! isSimple && ( ! isRegistered || ! isUserConnected );
const [ pricingPageDismissed, setPricingPageDismissed ] = useState( false );
@@ -101,6 +106,16 @@ export const SocialAdminPage = () => {
{ isJetpackSite && ! hasSocialPaidFeatures() && showPricingPage && ! pricingPageDismissed ? (
+
+ { hasConnectionError && (
+
+
+
+ ) }
+
+
+
+
@@ -112,6 +127,16 @@ export const SocialAdminPage = () => {
+
+ { hasConnectionError && (
+
+
+
+ ) }
+
+
+
+
{ canManageOptions && (
diff --git a/projects/packages/publicize/_inc/components/admin-page/styles.module.scss b/projects/packages/publicize/_inc/components/admin-page/styles.module.scss
index 44901e1385cc..654492123840 100644
--- a/projects/packages/publicize/_inc/components/admin-page/styles.module.scss
+++ b/projects/packages/publicize/_inc/components/admin-page/styles.module.scss
@@ -23,3 +23,7 @@
.notice {
grid-column: 1 / -1;
}
+
+.connection-error-col {
+ margin-top: 25px;
+}
diff --git a/projects/packages/publicize/changelog/fix-admin-notices-inside-header b/projects/packages/publicize/changelog/fix-admin-notices-inside-header
new file mode 100644
index 000000000000..9825c5c69f3c
--- /dev/null
+++ b/projects/packages/publicize/changelog/fix-admin-notices-inside-header
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Move admin notices and JITMs below the page header instead of rendering inside it.
diff --git a/projects/packages/search/changelog/fix-admin-notices-inside-header b/projects/packages/search/changelog/fix-admin-notices-inside-header
new file mode 100644
index 000000000000..9825c5c69f3c
--- /dev/null
+++ b/projects/packages/search/changelog/fix-admin-notices-inside-header
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Move admin notices and JITMs below the page header instead of rendering inside it.
diff --git a/projects/packages/search/src/dashboard/components/pages/dashboard-page.jsx b/projects/packages/search/src/dashboard/components/pages/dashboard-page.jsx
index 62cbba5ecf6d..467941c9cb59 100644
--- a/projects/packages/search/src/dashboard/components/pages/dashboard-page.jsx
+++ b/projects/packages/search/src/dashboard/components/pages/dashboard-page.jsx
@@ -107,6 +107,8 @@ export default function DashboardPage( { isLoading = false } ) {
return (
<>
+ { /* Always in the DOM so JITM JS finds it immediately (Path A). */ }
+
{ isPageLoading && }
{ ! isPageLoading && (
@@ -126,20 +128,17 @@ export default function DashboardPage( { isLoading = false } ) {
className="uses-new-admin-ui"
showFooter={ false }
>
-
- { hasConnectionError && (
-
-
-
- ) }
-
-
-
-
+ { hasConnectionError && (
+
+
+
+
+
+ ) }
{ isNewPricing && supportsInstantSearch && (