Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: purchase protection messsage #1075

Merged
merged 6 commits into from
Apr 30, 2024
Merged

feat: purchase protection messsage #1075

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e1c5749
btns purchase protection msg
surekhaw Apr 16, 2024
b5305b2
create marks purchase protection msg
surekhaw Apr 16, 2024
7af4e6e
fix purchase protection styles
surekhaw Apr 17, 2024
d411d3f
update purchase protection url
surekhaw Apr 18, 2024
012dc8b
enable purchase protection popup
surekhaw Apr 18, 2024
7c2eaec
add comment for getURIPopup fxn
surekhaw Apr 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions content/messages/US/buttons/purchase_protection.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
{
"_variables": {
"financing_code": "PURCHASE_PROTECTION"
},
"meta": {
"id": "",
"offer_country_code": "US",
"offerType": "PURCHASE_PROTECTION",
"lander": "https://www.paypal.com/us/digital-wallet/buyer-purchase-protection"
},
"headline": [
["A safer, easier way to pay", ["default", "xsmall"]],
["You're protected on most purchases.", ["small", "medium", "large", "xlarge"]]
],
"subHeadline": [],
"disclaimer": [
["<span aria-hidden='true'>Terms Apply</span><span class='sr-only'> Terms Apply</span>", ["default"]]
]
}
19 changes: 19 additions & 0 deletions content/messages/US/marks/purchase_protection.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
{
"_variables": {
"financing_code": "PURCHASE_PROTECTION"
},
"meta": {
"id": "",
"offer_country_code": "US",
"offerType": "PURCHASE_PROTECTION",
"lander": "https://www.paypal.com/us/digital-wallet/buyer-purchase-protection"
},
"headline": [
["A safer, easier way to pay", ["default", "xsmall"]],
["You're protected on most purchases.", ["small", "medium", "large", "xlarge"]]
],
"subHeadline": [],
"disclaimer": [
["<span aria-hidden='true'>Terms Apply</span><span class='sr-only'> Terms Apply</span>", ["default"]]
]
}
2 changes: 2 additions & 0 deletions demo/helpers/accounts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ const accounts = [
// 'DEV0GENERICPL',
// 'DEV000GENBNPL',
// 'DEV000GENPYPL',
// 'DEV0BTNPYPLPP',
// 'DEVBTNLTMQGTZ',
// 'DEVBTNLTMQEQZ',
// 'DEVBTNLTNQGTZ',
Expand All @@ -44,6 +45,7 @@ const accounts = [
// 'DEV00MRKGENPL',
// 'DEVMRKGENBNPL',
// 'DEVMRKGENPYPL',
// 'DEV0MRKPYPLPP',
// 'DEVMRKLTMQGTZ',
// 'DEVMRKLTMQEQZ',
// 'DEVMRKLTNQGTZ',
Expand Down
40 changes: 22 additions & 18 deletions src/library/zoid/message/component.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,8 @@ import {
getDevTouchpoint,
getMerchantConfig,
getLocalTreatments,
getTsCookieFromStorage
getTsCookieFromStorage,
getURIPopup
} from '../../../utils';
import validate from './validation';
import containerTemplate from './containerTemplate';
Expand Down Expand Up @@ -141,23 +142,26 @@ export default createGlobalVariableGetter('__paypal_credit_message__', () =>

return ({ meta }) => {
const { modal, index, account, merchantId, currency, amount, buyerCountry, onApply } = props;
const { offerType, offerCountry, messageRequestId } = meta;

// Avoid spreading message props because both message and modal
// zoid components have an onClick prop that functions differently
modal.show({
account,
merchantId,
currency,
amount,
buyerCountry,
onApply,
offer: offerType,
offerCountry,
refId: messageRequestId,
refIndex: index,
src: 'message_click'
});
const { offerType, offerCountry, messageRequestId, lander } = meta;
if (offerType === 'PURCHASE_PROTECTION') {
getURIPopup(lander, offerType);
} else {
// Avoid spreading message props because both message and modal
// zoid components have an onClick prop that functions differently
modal.show({
account,
merchantId,
currency,
amount,
buyerCountry,
onApply,
offer: offerType,
offerCountry,
refId: messageRequestId,
refIndex: index,
src: 'message_click'
});
}

logger.track({
index,
Expand Down
3 changes: 3 additions & 0 deletions src/server/locale/US/CONTEXTUAL_COMPONENTS/BUTTONS/mutations/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import shortTermSingleNQ from './short_term_nq';
import genericPayLater from './generic_pay_later';
import genericPayLaterBNPL from './generic_pay_later_bnpl';
import genericPayPal from './generic_paypal';
import purchaseProtection from './purchase_protection';

export default function getMutations(id, type) {
switch (id) {
Expand Down Expand Up @@ -47,6 +48,8 @@ export default function getMutations(id, type) {
// // Generic Pay Later - Buy now, Pay Later message
case 'GENERIC_PL_BNPL':
return genericPayLaterBNPL[type];
case 'PURCHASE_PROTECTION':
return purchaseProtection[type];
// // Generic PayPal message
case 'GENERIC_PAYPAL':
default:
Expand Down
147 changes: 147 additions & 0 deletions src/server/locale/US/CONTEXTUAL_COMPONENTS/BUTTONS/mutations/purchase_protection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,147 @@
import Logo from '../../../../../message/logos';
import {
textWrap,
messageLogoWidth,
altNoWrap,
setLogoTop,
xSmallFallback,
hideDisclaimer
} from '../../../../../message/mediaQueries';
import { textLogoMutations } from '../../../../../message/logoMutations';

export default {
'layout:text': [
[
'default',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
textWrap(textSize * 32, textSize, 'US'),
messageLogoWidth(false, textSize * 4, textSize * 1.25),
setLogoTop(textSize * 10.5),
hideDisclaimer(textSize * 10.5),
`.message__headline .tag--xsmall > span {display: inline-block;}`
],
logo: Logo.PP_PAYPAL.COLOR,
headline: [
{
tag: 'medium',
br: ['on']
},
{
tag: 'xsmall',
br: ['easier']
}
],
disclaimer: ['default']
})
],
[
'logo.type:primary && logo.position:right',
({ textSize }) => ({
styles: [
setLogoTop(textSize * 28.5),
xSmallFallback(textSize * 10.5),
setLogoTop(textSize * 18),
messageLogoWidth(textSize * 6, textSize * 4, textSize * 1.25),
hideDisclaimer(textSize * 10.5),
`.locale--US .message__messaging {padding-right: 0.4rem;}`,
`.message__headline .tag--xsmall > span {white-space: normal;}`
]
})
],
[
'logo.type:primary && logo.position:right && text.align:right',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
setLogoTop(textSize * 28.5),
messageLogoWidth(textSize * 6, textSize * 4, textSize * 1.25),
hideDisclaimer(textSize * 10.5),
`.locale--US .message__logo-container {margin-left: 0.4rem;} `,
`.message__headline .tag--xsmall > span {white-space: normal;}`
]
})
],
[
'logo.type:primary && logo.position:top',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
messageLogoWidth(textSize * 6, textSize * 4, textSize * 1.25),
hideDisclaimer(textSize * 10.5),
`.message__headline .tag--xsmall > span {white-space: normal;}`
]
})
],
[
'logo.type:alternative',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
textWrap(textSize * 32, textSize, 'US'),
altNoWrap(textSize * 10.6),
messageLogoWidth(textSize * 1.75, textSize * 4, textSize * 1.25),
`.message__headline .tag--xsmall > span {white-space: normal;}
`,
hideDisclaimer(textSize * 10.5)
],
logo: Logo.PP_PAYPAL.COLOR[0]
})
],
[
'logo.type:none',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
`.message__headline span:last-child > strong {
content: 'PayPal';
display: inline-block;
font-weight: bold;
}
`,
hideDisclaimer(textSize * 10.5),
`.message__headline .tag--xsmall > span {white-space: normal;}
`
],
logo: false,
headline: [
{
tag: 'medium',
br: ['on'],
replace: [['purchases.', 'purchases']]
},
{
tag: 'xsmall',
br: ['easier']
}
]
})
],
[
'logo.type:inline',
({ textSize }) => ({
styles: [
xSmallFallback(textSize * 10.5),
`.message__logo { width: ${textSize * 4}px }`,
hideDisclaimer(textSize * 10.5),
`.message__headline .tag--xsmall > span {white-space: normal;}
`
],
logo: Logo.NO_PP_MONOGRAM.COLOR,
headline: [
{
tag: 'medium',
br: ['on'],
replace: [['purchases.', 'purchases']]
},
{
tag: 'xsmall',
br: ['easier']
}
]
})
],
...textLogoMutations
]
};
3 changes: 3 additions & 0 deletions src/server/locale/US/CONTEXTUAL_COMPONENTS/MARKS/mutations/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import shortTermSingleNQ from './short_term_nq';
import genericPayLater from './generic_pay_later';
import genericPayLaterBNPL from './generic_pay_later_bnpl';
import genericPayPal from './generic_paypal';
import purchaseProtection from './purchase_protection';

export default function getMutations(id, type) {
switch (id) {
Expand Down Expand Up @@ -47,6 +48,8 @@ export default function getMutations(id, type) {
// // Generic Pay Later - Buy now, Pay Later message
case 'GENERIC_PL_BNPL':
return genericPayLaterBNPL[type];
case 'PURCHASE_PROTECTION':
return purchaseProtection[type];
// // Generic PayPal message
case 'GENERIC_PAYPAL':
default:
Expand Down
26 changes: 26 additions & 0 deletions src/server/locale/US/CONTEXTUAL_COMPONENTS/MARKS/mutations/purchase_protection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { xSmallFallback, hideDisclaimer } from '../../../../../message/mediaQueries';

export default {
'layout:text': [
[
'default',
({ textSize }) => ({
styles: [
`.message__headline > .tag--xsmall > span:first-child { white-space: normal; } `,
xSmallFallback(textSize * 10.5),
hideDisclaimer(textSize * 10.5)
],
headline: [
{
tag: 'medium'
},
{
tag: 'xsmall',
br: ['easier']
}
],
disclaimer: ['default']
})
]
]
};
4 changes: 4 additions & 0 deletions src/utils/sdk.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,3 +255,7 @@ export function getFeatures() {
return undefined;
}
}

surekhaw marked this conversation as resolved.
Show resolved Hide resolved
export function getURIPopup(lander, label) {
return window.open(lander, label, 'width=460,height=900');
}
2 changes: 2 additions & 0 deletions tests/functional/spec/US/accounts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export default [
'DEV0GENERICPL',
'DEV000GENBNPL',
'DEV000GENPYPL',
'DEV0BTNPYPLPP',
'DEVBTNLTMQGTZ',
'DEVBTNLTMQEQZ',
'DEVBTNLTNQGTZ',
Expand All @@ -35,6 +36,7 @@ export default [
'DEV00MRKGENPL',
'DEVMRKGENBNPL',
'DEVMRKGENPYPL',
'DEV0MRKPYPLPP',
'DEVMRKLTMQGTZ',
'DEVMRKLTMQEQZ',
'DEVMRKLTNQGTZ',
Expand Down
Loading
Loading