@financial-times/n-conversion-forms 45.1.0 → 45.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.toolkitstate/ci.json +3 -3
- package/components/__snapshots__/confirmation.spec.js.snap +90 -3
- package/components/confirmation.jsx +23 -16
- package/components/confirmation.spec.js +16 -0
- package/components/confirmation.stories.js +2 -0
- package/dist/confirmation.jsx +11 -5
- package/package.json +1 -1
package/.toolkitstate/ci.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`Confirmation renders appropriately if
|
|
3
|
+
exports[`Confirmation renders appropriately if a confirmation email has been sent 1`] = `
|
|
4
4
|
<div class="ncf ncf__wrapper">
|
|
5
5
|
<div class="ncf__center">
|
|
6
6
|
<div class="ncf__icon ncf__icon--tick ncf__icon--large">
|
|
@@ -50,7 +50,54 @@ exports[`Confirmation renders appropriately if is 'Evergreen' subscription term
|
|
|
50
50
|
</div>
|
|
51
51
|
`;
|
|
52
52
|
|
|
53
|
-
exports[`Confirmation renders appropriately if
|
|
53
|
+
exports[`Confirmation renders appropriately if a confirmation email has not been sent 1`] = `
|
|
54
|
+
<div class="ncf ncf__wrapper">
|
|
55
|
+
<div class="ncf__center">
|
|
56
|
+
<div class="ncf__icon ncf__icon--tick ncf__icon--large">
|
|
57
|
+
</div>
|
|
58
|
+
<p class="ncf__paragraph--reduced-padding ncf__paragraph--subscription-confirmation">
|
|
59
|
+
You are now subscribed to:
|
|
60
|
+
</p>
|
|
61
|
+
<h1 class="ncf__header ncf__header--confirmation">
|
|
62
|
+
</h1>
|
|
63
|
+
</div>
|
|
64
|
+
<p class="ncf__paragraph">
|
|
65
|
+
Here’s a summary of your subscription:
|
|
66
|
+
</p>
|
|
67
|
+
<div class="ncf__headed-paragraph">
|
|
68
|
+
<h3 class="ncf__header">
|
|
69
|
+
Something not right?
|
|
70
|
+
</h3>
|
|
71
|
+
<p class="ncf__paragraph o3-type-body-base">
|
|
72
|
+
Go to your
|
|
73
|
+
<a href="https://www.ft.com/myaccount/personal-details"
|
|
74
|
+
target="_blank"
|
|
75
|
+
rel="noopener noreferrer"
|
|
76
|
+
data-trackable="yourAccount"
|
|
77
|
+
>
|
|
78
|
+
account settings
|
|
79
|
+
</a>
|
|
80
|
+
to view or edit your account. If you need to get in touch call us on
|
|
81
|
+
<a href="tel:+442077556248">
|
|
82
|
+
+44 (0) 207 755 6248
|
|
83
|
+
</a>
|
|
84
|
+
. Or contact us for additional support.
|
|
85
|
+
</p>
|
|
86
|
+
</div>
|
|
87
|
+
<p class="ncf__paragraph o3-type-body-base">
|
|
88
|
+
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date. See our
|
|
89
|
+
<a href="http://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
90
|
+
target="_top"
|
|
91
|
+
rel="noopener"
|
|
92
|
+
>
|
|
93
|
+
Terms & Conditions
|
|
94
|
+
</a>
|
|
95
|
+
for details on how to cancel.
|
|
96
|
+
</p>
|
|
97
|
+
</div>
|
|
98
|
+
`;
|
|
99
|
+
|
|
100
|
+
exports[`Confirmation renders appropriately if is 'Evergreen' subscription term type 1`] = `
|
|
54
101
|
<div class="ncf ncf__wrapper">
|
|
55
102
|
<div class="ncf__center">
|
|
56
103
|
<div class="ncf__icon ncf__icon--tick ncf__icon--large">
|
|
@@ -88,7 +135,7 @@ exports[`Confirmation renders appropriately if is 'Termed' subscription term typ
|
|
|
88
135
|
</p>
|
|
89
136
|
</div>
|
|
90
137
|
<p class="ncf__paragraph o3-type-body-base">
|
|
91
|
-
See our
|
|
138
|
+
We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date. See our
|
|
92
139
|
<a href="http://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
93
140
|
target="_top"
|
|
94
141
|
rel="noopener"
|
|
@@ -100,6 +147,46 @@ exports[`Confirmation renders appropriately if is 'Termed' subscription term typ
|
|
|
100
147
|
</div>
|
|
101
148
|
`;
|
|
102
149
|
|
|
150
|
+
exports[`Confirmation renders appropriately if is 'Termed' subscription term type 1`] = `
|
|
151
|
+
<div class="ncf ncf__wrapper">
|
|
152
|
+
<div class="ncf__center">
|
|
153
|
+
<div class="ncf__icon ncf__icon--tick ncf__icon--large">
|
|
154
|
+
</div>
|
|
155
|
+
<p class="ncf__paragraph--reduced-padding ncf__paragraph--subscription-confirmation">
|
|
156
|
+
Your purchase is complete for:
|
|
157
|
+
</p>
|
|
158
|
+
<h1 class="ncf__header ncf__header--confirmation">
|
|
159
|
+
</h1>
|
|
160
|
+
</div>
|
|
161
|
+
<p class="ncf__paragraph">
|
|
162
|
+
We’ve sent confirmation to your email. Make sure you check your spam folder if you don’t receive it.
|
|
163
|
+
</p>
|
|
164
|
+
<p class="ncf__paragraph">
|
|
165
|
+
Here’s a summary of your subscription:
|
|
166
|
+
</p>
|
|
167
|
+
<div class="ncf__headed-paragraph">
|
|
168
|
+
<h3 class="ncf__header">
|
|
169
|
+
Something not right?
|
|
170
|
+
</h3>
|
|
171
|
+
<p class="ncf__paragraph o3-type-body-base">
|
|
172
|
+
Go to your
|
|
173
|
+
<a href="https://www.ft.com/myaccount/personal-details"
|
|
174
|
+
target="_blank"
|
|
175
|
+
rel="noopener noreferrer"
|
|
176
|
+
data-trackable="yourAccount"
|
|
177
|
+
>
|
|
178
|
+
account settings
|
|
179
|
+
</a>
|
|
180
|
+
to view or edit your account. If you need to get in touch call us on
|
|
181
|
+
<a href="tel:+442077556248">
|
|
182
|
+
+44 (0) 207 755 6248
|
|
183
|
+
</a>
|
|
184
|
+
. Or contact us for additional support.
|
|
185
|
+
</p>
|
|
186
|
+
</div>
|
|
187
|
+
</div>
|
|
188
|
+
`;
|
|
189
|
+
|
|
103
190
|
exports[`Confirmation renders appropriately if is B2C Partnership 1`] = `
|
|
104
191
|
<div class="ncf ncf__wrapper">
|
|
105
192
|
<div class="ncf__center">
|
|
@@ -8,7 +8,9 @@ export function Confirmation({
|
|
|
8
8
|
isTrial = false,
|
|
9
9
|
isB2cPartnership = false,
|
|
10
10
|
b2cPartnershipCopy = [],
|
|
11
|
+
sendConfirmationEmail = true,
|
|
11
12
|
isEvergreenSubscriptionTermType = true,
|
|
13
|
+
isTermedSubscriptionTermType = false,
|
|
12
14
|
offer = '',
|
|
13
15
|
email = EMAIL_DEFAULT_TEXT,
|
|
14
16
|
details = null,
|
|
@@ -63,13 +65,14 @@ export function Confirmation({
|
|
|
63
65
|
<div className="ncf__center">
|
|
64
66
|
<div className="ncf__icon ncf__icon--tick ncf__icon--large"></div>
|
|
65
67
|
<p className="ncf__paragraph--reduced-padding ncf__paragraph--subscription-confirmation">
|
|
66
|
-
You are now subscribed to:
|
|
68
|
+
{isEvergreenSubscriptionTermType && 'You are now subscribed to:'}
|
|
69
|
+
{isTermedSubscriptionTermType && 'Your purchase is complete for:'}
|
|
67
70
|
</p>
|
|
68
71
|
<h1 className="ncf__header ncf__header--confirmation">{offer}</h1>
|
|
69
72
|
</div>
|
|
70
73
|
|
|
71
74
|
{nextActionTop}
|
|
72
|
-
{!isB2cPartnershipCopyAvailable && (
|
|
75
|
+
{sendConfirmationEmail && !isB2cPartnershipCopyAvailable && (
|
|
73
76
|
<p className="ncf__paragraph">
|
|
74
77
|
We’ve sent confirmation to {email}. Make sure you check your spam
|
|
75
78
|
folder if you don’t receive it.
|
|
@@ -113,20 +116,22 @@ export function Confirmation({
|
|
|
113
116
|
for additional support.
|
|
114
117
|
</p>
|
|
115
118
|
</div>
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
119
|
+
|
|
120
|
+
{isEvergreenSubscriptionTermType && (
|
|
121
|
+
<p className="ncf__paragraph o3-type-body-base">
|
|
122
|
+
We will automatically renew your subscription using the payment method
|
|
123
|
+
provided unless you cancel before your renewal date. See our{' '}
|
|
124
|
+
<a
|
|
125
|
+
href="http://help.ft.com/help/legal-privacy/terms-conditions/"
|
|
126
|
+
target="_top"
|
|
127
|
+
rel="noopener"
|
|
128
|
+
>
|
|
129
|
+
Terms & Conditions
|
|
130
|
+
</a>{' '}
|
|
131
|
+
for details on how to cancel.
|
|
132
|
+
</p>
|
|
133
|
+
)}
|
|
134
|
+
|
|
130
135
|
{nextActionBottom}
|
|
131
136
|
</div>
|
|
132
137
|
);
|
|
@@ -136,7 +141,9 @@ Confirmation.propTypes = {
|
|
|
136
141
|
isTrial: PropTypes.bool,
|
|
137
142
|
isB2cPartnership: PropTypes.bool,
|
|
138
143
|
b2cPartnershipCopy: PropTypes.array,
|
|
144
|
+
sendConfirmationEmail: PropTypes.bool,
|
|
139
145
|
isEvergreenSubscriptionTermType: PropTypes.bool,
|
|
146
|
+
isTermedSubscriptionTermType: PropTypes.bool,
|
|
140
147
|
offer: PropTypes.string.isRequired,
|
|
141
148
|
email: PropTypes.string,
|
|
142
149
|
details: PropTypes.arrayOf(
|
|
@@ -47,6 +47,22 @@ describe('Confirmation', () => {
|
|
|
47
47
|
expect(Confirmation).toRenderCorrectly(props);
|
|
48
48
|
});
|
|
49
49
|
|
|
50
|
+
it('renders appropriately if a confirmation email has been sent', () => {
|
|
51
|
+
const props = {
|
|
52
|
+
sendConfirmationEmail: true,
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
expect(Confirmation).toRenderCorrectly(props);
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
it('renders appropriately if a confirmation email has not been sent', () => {
|
|
59
|
+
const props = {
|
|
60
|
+
sendConfirmationEmail: false,
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
expect(Confirmation).toRenderCorrectly(props);
|
|
64
|
+
});
|
|
65
|
+
|
|
50
66
|
it('renders with custom email', () => {
|
|
51
67
|
const props = { offer: OFFER_TEXT, email: 'test@example.com' };
|
|
52
68
|
|
|
@@ -65,6 +65,8 @@ Basic.args = {
|
|
|
65
65
|
|
|
66
66
|
export const TermedSubscriptionTermType = (args) => <Confirmation {...args} />;
|
|
67
67
|
TermedSubscriptionTermType.args = {
|
|
68
|
+
sendConfirmationEmail: false,
|
|
69
|
+
isEvergreenTermedSubscriptionTermType: false,
|
|
68
70
|
isTermedSubscriptionTermType: true,
|
|
69
71
|
offer: 'Single-term subscription',
|
|
70
72
|
details: [
|
package/dist/confirmation.jsx
CHANGED
|
@@ -18,8 +18,12 @@ function Confirmation(_ref) {
|
|
|
18
18
|
isB2cPartnership = _ref$isB2cPartnership === void 0 ? false : _ref$isB2cPartnership,
|
|
19
19
|
_ref$b2cPartnershipCo = _ref.b2cPartnershipCopy,
|
|
20
20
|
b2cPartnershipCopy = _ref$b2cPartnershipCo === void 0 ? [] : _ref$b2cPartnershipCo,
|
|
21
|
+
_ref$sendConfirmation = _ref.sendConfirmationEmail,
|
|
22
|
+
sendConfirmationEmail = _ref$sendConfirmation === void 0 ? true : _ref$sendConfirmation,
|
|
21
23
|
_ref$isEvergreenSubsc = _ref.isEvergreenSubscriptionTermType,
|
|
22
24
|
isEvergreenSubscriptionTermType = _ref$isEvergreenSubsc === void 0 ? true : _ref$isEvergreenSubsc,
|
|
25
|
+
_ref$isTermedSubscrip = _ref.isTermedSubscriptionTermType,
|
|
26
|
+
isTermedSubscriptionTermType = _ref$isTermedSubscrip === void 0 ? false : _ref$isTermedSubscrip,
|
|
23
27
|
_ref$offer = _ref.offer,
|
|
24
28
|
offer = _ref$offer === void 0 ? '' : _ref$offer,
|
|
25
29
|
_ref$email = _ref.email,
|
|
@@ -70,9 +74,9 @@ function Confirmation(_ref) {
|
|
|
70
74
|
className: "ncf__icon ncf__icon--tick ncf__icon--large"
|
|
71
75
|
}), /*#__PURE__*/_react["default"].createElement("p", {
|
|
72
76
|
className: "ncf__paragraph--reduced-padding ncf__paragraph--subscription-confirmation"
|
|
73
|
-
},
|
|
77
|
+
}, isEvergreenSubscriptionTermType && 'You are now subscribed to:', isTermedSubscriptionTermType && 'Your purchase is complete for:'), /*#__PURE__*/_react["default"].createElement("h1", {
|
|
74
78
|
className: "ncf__header ncf__header--confirmation"
|
|
75
|
-
}, offer)), nextActionTop, !isB2cPartnershipCopyAvailable && /*#__PURE__*/_react["default"].createElement("p", {
|
|
79
|
+
}, offer)), nextActionTop, sendConfirmationEmail && !isB2cPartnershipCopyAvailable && /*#__PURE__*/_react["default"].createElement("p", {
|
|
76
80
|
className: "ncf__paragraph"
|
|
77
81
|
}, "We\u2019ve sent confirmation to ", email, ". Make sure you check your spam folder if you don\u2019t receive it."), isB2cPartnershipCopyAvailable ? /*#__PURE__*/_react["default"].createElement("p", {
|
|
78
82
|
className: "ncf__paragraph"
|
|
@@ -93,19 +97,21 @@ function Confirmation(_ref) {
|
|
|
93
97
|
"data-trackable": "yourAccount"
|
|
94
98
|
}, "account settings"), ' ', "to view or edit your account. If you need to get in touch call us on", ' ', /*#__PURE__*/_react["default"].createElement("a", {
|
|
95
99
|
href: "tel:+442077556248"
|
|
96
|
-
}, "+44 (0) 207 755 6248"), ". Or contact us for additional support.")), /*#__PURE__*/_react["default"].createElement("p", {
|
|
100
|
+
}, "+44 (0) 207 755 6248"), ". Or contact us for additional support.")), isEvergreenSubscriptionTermType && /*#__PURE__*/_react["default"].createElement("p", {
|
|
97
101
|
className: "ncf__paragraph o3-type-body-base"
|
|
98
|
-
},
|
|
102
|
+
}, "We will automatically renew your subscription using the payment method provided unless you cancel before your renewal date. See our", ' ', /*#__PURE__*/_react["default"].createElement("a", {
|
|
99
103
|
href: "http://help.ft.com/help/legal-privacy/terms-conditions/",
|
|
100
104
|
target: "_top",
|
|
101
105
|
rel: "noopener"
|
|
102
|
-
}, "Terms & Conditions"), ' for details on how to cancel.
|
|
106
|
+
}, "Terms & Conditions"), ' ', "for details on how to cancel."), nextActionBottom);
|
|
103
107
|
}
|
|
104
108
|
Confirmation.propTypes = {
|
|
105
109
|
isTrial: _propTypes["default"].bool,
|
|
106
110
|
isB2cPartnership: _propTypes["default"].bool,
|
|
107
111
|
b2cPartnershipCopy: _propTypes["default"].array,
|
|
112
|
+
sendConfirmationEmail: _propTypes["default"].bool,
|
|
108
113
|
isEvergreenSubscriptionTermType: _propTypes["default"].bool,
|
|
114
|
+
isTermedSubscriptionTermType: _propTypes["default"].bool,
|
|
109
115
|
offer: _propTypes["default"].string.isRequired,
|
|
110
116
|
email: _propTypes["default"].string,
|
|
111
117
|
details: _propTypes["default"].arrayOf(_propTypes["default"].shape({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@financial-times/n-conversion-forms",
|
|
3
|
-
"version": "45.
|
|
3
|
+
"version": "45.3.0",
|
|
4
4
|
"description": "Containing jsx components and styles for forms included on Accounts and Acquisition apps (next-signup, next-profile, next-retention, etc).",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"scripts": {
|