diff --git a/apps/odyssey-stats/src/styles/wp-admin.scss b/apps/odyssey-stats/src/styles/wp-admin.scss index 69a69f92f12214..690dd1b2d3c03e 100644 --- a/apps/odyssey-stats/src/styles/wp-admin.scss +++ b/apps/odyssey-stats/src/styles/wp-admin.scss @@ -59,7 +59,8 @@ & .is-section-stats .has-fixed-nav { padding-top: 64px; } - & .highlight-cards.has-background-color { + & .highlight-cards.has-background-color, + & .inner-notice-container.has-background-color { background-color: var(--jetpack-white-off); } #wpcontent { diff --git a/client/lib/wpcom-xhr-wrapper/index.js b/client/lib/wpcom-xhr-wrapper/index.js index ddf55c6a10cae2..6be8b2098a74ab 100644 --- a/client/lib/wpcom-xhr-wrapper/index.js +++ b/client/lib/wpcom-xhr-wrapper/index.js @@ -27,7 +27,8 @@ export async function jetpack_site_xhr_wrapper( params, callback ) { 'X-WP-Nonce': config( 'nonce' ), }, isRestAPI: false, - apiNamespace: 'jetpack/v4/stats-app', + apiNamespace: + params.apiNamespace === 'jetpack/v4' ? params.apiNamespace : 'jetpack/v4/stats-app', }; return xhr( params, async function ( error, response, headers ) { diff --git a/client/my-sites/stats/site.jsx b/client/my-sites/stats/site.jsx index d1ca56ed056d33..c2309160b75f32 100644 --- a/client/my-sites/stats/site.jsx +++ b/client/my-sites/stats/site.jsx @@ -1,6 +1,7 @@ import config from '@automattic/calypso-config'; import { getUrlParts } from '@automattic/calypso-url'; import { eye } from '@automattic/components/src/icons'; +import NoticeBanner from '@automattic/components/src/notice-banner'; import { Icon, people, starEmpty, commentContent } from '@wordpress/icons'; import classNames from 'classnames'; import { localize, translate } from 'i18n-calypso'; @@ -31,10 +32,12 @@ import { withAnalytics, } from 'calypso/state/analytics/actions'; import { activateModule } from 'calypso/state/jetpack/modules/actions'; +import { dismissJITMDirect } from 'calypso/state/jitm/actions'; import getCurrentRouteParameterized from 'calypso/state/selectors/get-current-route-parameterized'; import isJetpackModuleActive from 'calypso/state/selectors/is-jetpack-module-active'; import isPrivateSite from 'calypso/state/selectors/is-private-site'; import { isJetpackSite } from 'calypso/state/sites/selectors'; +import hasOptOutNewStatsNotice from 'calypso/state/sites/selectors/has-opt-out-new-stats-notice'; import { getSelectedSiteId, getSelectedSiteSlug } from 'calypso/state/ui/selectors'; import HighlightsSection from './highlights-section'; import MiniCarousel from './mini-carousel'; @@ -117,6 +120,7 @@ class StatsSite extends Component { state = { activeTab: null, activeLegend: null, + isOptOutNoticeDismissed: false, }; static getDerivedStateFromProps( props, state ) { @@ -157,7 +161,16 @@ class StatsSite extends Component { }; renderStats() { - const { date, siteId, slug, isJetpack, isSitePrivate, isOdysseyStats, context } = this.props; + const { + date, + siteId, + slug, + isJetpack, + isSitePrivate, + isOdysseyStats, + context, + showOptOutNotice, + } = this.props; const queryDate = date.format( 'YYYY-MM-DD' ); const { period, endOf } = this.props.period; @@ -179,6 +192,11 @@ class StatsSite extends Component { 'is-period-year': period === 'year', } ); + const dismissOptOutNotice = () => { + this.setState( { isOptOutNoticeDismissed: true } ); + context.store.dispatch( dismissJITMDirect( 'opt-out-new-stats', 'opt-out-new-stats' ) ); + }; + return (