diff --git a/packages/article-extras/__tests__/web/__snapshots__/article-extras.test.js.snap b/packages/article-extras/__tests__/web/__snapshots__/article-extras.test.js.snap
index a865225724d..696e7e61c80 100644
--- a/packages/article-extras/__tests__/web/__snapshots__/article-extras.test.js.snap
+++ b/packages/article-extras/__tests__/web/__snapshots__/article-extras.test.js.snap
@@ -10,9 +10,6 @@ Array [
,
-
,
@@ -98,9 +95,6 @@ Array [
,
- ,
@@ -154,9 +148,6 @@ Array [
,
- ,
diff --git a/packages/article-extras/src/article-extras.js b/packages/article-extras/src/article-extras.js
index 4b03cb2d9bc..7f6164fec13 100644
--- a/packages/article-extras/src/article-extras.js
+++ b/packages/article-extras/src/article-extras.js
@@ -38,12 +38,12 @@ const ArticleExtras = ({
relatedArticlesVisible,
commentingConfig,
topics,
- isSharingSavingEnabled,
isCommentEnabled,
storefrontConfig,
breadcrumbs,
domainSpecificUrl,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
}) => {
const renderBreadcrumb = ({ showBorder } = { showBorder: false }) => {
if (breadcrumbs && breadcrumbs.length > 0) {
@@ -90,6 +90,7 @@ const ArticleExtras = ({
>
);
+
return (
{renderBreadcrumb({ showBorder: topics && topics.length > 0 })}
- {isSharingSavingEnabled && (
-
-
- {({ showMessage }) => (
-
- showMessage("Article link copied")}
- onSaveToMyArticles={() => {}}
- onShareOnEmail={() => {}}
- savingEnabled={savingEnabled}
- sharingEnabled={sharingEnabled}
- />
-
- )}
-
-
- )}
+
+ {({ showMessage }) => (
+
+ showMessage("Article link copied")}
+ onSaveToMyArticles={() => {}}
+ onShareOnEmail={() => {}}
+ savingEnabled={savingEnabled}
+ sharingEnabled={sharingEnabled}
+ />
+
+ )}
+
{sponsoredArticlesAndRelatedArticles(true, false)}
{
+ const FP_CODE_SHARE_AND_SAVE = "fp-753";
+
+ const featureDecisions =
+ (shareSaveEntitlementData &&
+ shareSaveEntitlementData.user &&
+ shareSaveEntitlementData.user.subscriptions &&
+ shareSaveEntitlementData.user.subscriptions[0] &&
+ shareSaveEntitlementData.user.subscriptions[0].featureDecisions) ||
+ [];
+
+ const isShareSaveEntitlementEnabled =
+ featureDecisions &&
+ featureDecisions.some(
+ decision =>
+ decision.code === FP_CODE_SHARE_AND_SAVE && decision.outcomeAsBoolean
+ );
+
+ if (
+ shareSaveEntitlementData === undefined ||
+ !isShareSaveEntitlementEnabled
+ ) {
+ return null;
+ }
+
+ return children;
+};
+
+const FeatureDecisionPropTypes = PropTypes.shape({
+ code: PropTypes.string.isRequired,
+ name: PropTypes.string.isRequired,
+ outcome: PropTypes.string.isRequired,
+ outcomeAsBoolean: PropTypes.bool.isRequired
+});
+
+const SubscriptionPropTypes = PropTypes.shape({
+ id: PropTypes.string.isRequired,
+ featureDecisions: PropTypes.arrayOf(FeatureDecisionPropTypes).isRequired
+});
+
+const UserPropTypes = PropTypes.shape({
+ cpn: PropTypes.string.isRequired,
+ subscriptions: PropTypes.arrayOf(SubscriptionPropTypes).isRequired
+});
+
+ShareSaveEntitlementState.PropTypes = PropTypes.shape({
+ user: UserPropTypes.isRequired
+});
+
+export default ShareSaveEntitlementState;
diff --git a/packages/article-extras/src/styles/responsive.js b/packages/article-extras/src/styles/responsive.js
index bc6c8f510e7..f1e58b1fbe5 100644
--- a/packages/article-extras/src/styles/responsive.js
+++ b/packages/article-extras/src/styles/responsive.js
@@ -2,12 +2,15 @@
import styled from "styled-components";
import { breakpoints, colours } from "@times-components/ts-styleguide";
-export const ShareAndSaveContainer = styled.div`
+export const ShareAndSaveContainer =
+ styled.div<{ isSharingSavingEntitlementEnabled: boolean }>
+ `
border-top-color: ${colours.functional.keyline};
border-top-style: solid;
border-top-width: 1px;
width: 56.2%;
margin: 0 auto;
+ display: ${({isSharingSavingEntitlementEnabled}) => (isSharingSavingEntitlementEnabled ? "flex" : "none")};
@media (max-width: ${breakpoints.huge}px) {
display: none;
diff --git a/packages/article-in-depth/__tests__/web/__snapshots__/semantic.web.test.js.snap b/packages/article-in-depth/__tests__/web/__snapshots__/semantic.web.test.js.snap
index 7f65e0be041..69f24e68c42 100644
--- a/packages/article-in-depth/__tests__/web/__snapshots__/semantic.web.test.js.snap
+++ b/packages/article-in-depth/__tests__/web/__snapshots__/semantic.web.test.js.snap
@@ -333,153 +333,6 @@ exports[`1. a full article 1`] = `
Topic
-
-
- Share this article
-
-
-
-
-
- Email
-
-
-
-
-
- Twitter
-
-
-
-
-
- Facebook
-
-
-
-
-
- Link
-
-
PROMOTED CONTENT
diff --git a/packages/article-magazine-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap b/packages/article-magazine-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
index e5aab42fd25..fe090616077 100644
--- a/packages/article-magazine-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
+++ b/packages/article-magazine-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
@@ -338,153 +338,6 @@ exports[`1. a full article 1`] = `
Topic
-
-
- Share this article
-
-
-
-
-
- Email
-
-
-
-
-
- Twitter
-
-
-
-
-
- Facebook
-
-
-
-
-
- Link
-
-
PROMOTED CONTENT
diff --git a/packages/article-magazine-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap b/packages/article-magazine-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
index 4f07424d74d..52320e9eb9a 100644
--- a/packages/article-magazine-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
+++ b/packages/article-magazine-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
@@ -338,153 +338,6 @@ exports[`1. a full article 1`] = `
Topic
-
-
- Share this article
-
-
-
-
-
- Email
-
-
-
-
-
- Twitter
-
-
-
-
-
- Facebook
-
-
-
-
-
- Link
-
-
PROMOTED CONTENT
diff --git a/packages/article-main-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap b/packages/article-main-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
index 05fb079e9ce..54d7f1d3f0a 100644
--- a/packages/article-main-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
+++ b/packages/article-main-comment/__tests__/web/__snapshots__/semantic.web.test.js.snap
@@ -327,153 +327,6 @@ exports[`1. a full article 1`] = `
Topic
-
-
- Share this article
-
-
-
-
-
- Email
-
-
-
-
-
- Twitter
-
-
-
-
-
- Facebook
-
-
-
-
-
- Link
-
-
PROMOTED CONTENT
diff --git a/packages/article-main-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap b/packages/article-main-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
index 96ac74afbf0..4924819f341 100644
--- a/packages/article-main-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
+++ b/packages/article-main-standard/__tests__/web/__snapshots__/semantic.web.test.js.snap
@@ -199,153 +199,6 @@ exports[`1. a full article with an image as the lead asset 1`] = `
Topic
-
-
- Share this article
-
-
-
-
-
- Email
-
-
-
-
-
- Twitter
-
-
-
-
-
- Facebook
-
-
-
-
-
- Link
-
-
PROMOTED CONTENT
diff --git a/packages/article-skeleton/src/article-skeleton.js b/packages/article-skeleton/src/article-skeleton.js
index d3cbc7657c0..37ae0f1e4de 100644
--- a/packages/article-skeleton/src/article-skeleton.js
+++ b/packages/article-skeleton/src/article-skeleton.js
@@ -89,7 +89,8 @@ const ArticleSkeleton = ({
isSavingEnabled,
isSharingEnabled,
isCommentEnabled,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
} = article;
const [showVerifyEmailBanner, setShowEmailVerifyBanner] = useState(false);
@@ -435,6 +436,9 @@ const ArticleSkeleton = ({
breadcrumbs={breadcrumbs}
domainSpecificUrl={domainSpecificUrl}
isEntitlementFeatureEnabled={isEntitlementFeatureEnabled}
+ isSharingSavingEntitlementEnabled={
+ isSharingSavingEntitlementEnabled
+ }
/>
)}
diff --git a/packages/card/__tests__/web/__snapshots__/card-loading-style.test.js.snap b/packages/card/__tests__/web/__snapshots__/card-loading-style.test.js.snap
index ab3873894e2..ac12113349e 100644
--- a/packages/card/__tests__/web/__snapshots__/card-loading-style.test.js.snap
+++ b/packages/card/__tests__/web/__snapshots__/card-loading-style.test.js.snap
@@ -648,4 +648,4 @@ exports[`2. card with reversed loading state 1`] = `
-`;
+`;
\ No newline at end of file
diff --git a/packages/card/__tests__/web/__snapshots__/card.web.test.js.snap b/packages/card/__tests__/web/__snapshots__/card.web.test.js.snap
index 8d40791e3a4..a8f6eec76f8 100644
--- a/packages/card/__tests__/web/__snapshots__/card.web.test.js.snap
+++ b/packages/card/__tests__/web/__snapshots__/card.web.test.js.snap
@@ -1781,4 +1781,4 @@ exports[`15. card should re-render when loading state changes 2`] = `
-`;
+`;
\ No newline at end of file
diff --git a/packages/ssr/src/client/article.js b/packages/ssr/src/client/article.js
index ed23987abd0..71df9a94a41 100644
--- a/packages/ssr/src/client/article.js
+++ b/packages/ssr/src/client/article.js
@@ -20,7 +20,8 @@ if (window.nuk && window.nuk.ssr && window.nuk.article) {
commentingFlag = true,
showAudioPlayer,
storefrontConfig,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
} = window.nuk.article;
const { getCookieValue } = window.nuk;
@@ -43,7 +44,8 @@ if (window.nuk && window.nuk.ssr && window.nuk.article) {
commentingFlag,
showAudioPlayer,
storefrontConfig,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
};
const clientOptions = {
diff --git a/packages/ssr/src/component/article.js b/packages/ssr/src/component/article.js
index afa2d9ecbdc..894a3759765 100644
--- a/packages/ssr/src/component/article.js
+++ b/packages/ssr/src/component/article.js
@@ -37,7 +37,8 @@ module.exports = (client, analyticsStream, data, helmetContext) => {
commentingFlag,
showAudioPlayer,
storefrontConfig,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
} = data;
return React.createElement(
@@ -88,6 +89,7 @@ module.exports = (client, analyticsStream, data, helmetContext) => {
isSharingEnabled: sharingSavingFlag,
isCommentEnabled: commentingFlag,
isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled,
isPreview
},
error,
diff --git a/packages/ssr/src/server/article.js b/packages/ssr/src/server/article.js
index 232bc1ea74c..5a7ac2885a8 100644
--- a/packages/ssr/src/server/article.js
+++ b/packages/ssr/src/server/article.js
@@ -29,7 +29,8 @@ module.exports = (
commentingFlag = true,
showAudioPlayer,
storefrontConfig,
- isEntitlementFeatureEnabled = false
+ isEntitlementFeatureEnabled = false,
+ isSharingSavingEntitlementEnabled = false
},
userState
) => {
@@ -86,7 +87,8 @@ module.exports = (
commentingFlag,
showAudioPlayer,
storefrontConfig,
- isEntitlementFeatureEnabled
+ isEntitlementFeatureEnabled,
+ isSharingSavingEntitlementEnabled
},
name: "article"
};