From 9790be18348ad2745fe1bf7e07071a956f5a1712 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Tue, 24 Oct 2023 14:41:21 +0200
Subject: [PATCH 01/15] feat: storing cookies

---
 .../CtPOneTimePassword/CtPOneTimePassword.tsx |   4 +
 .../CtPOneTimePasswordInput.scss              |   2 +-
 .../CtPSaveCookiesCheckbox.scss               |  23 ++
 .../CtPSaveCookiesCheckbox.tsx                |  35 +++
 .../CtPSaveCookiesCheckbox/index.ts           |   1 +
 .../components/CtPSection/CtPSection.scss     |   5 +-
 .../ClickToPay/context/ClickToPayContext.ts   |   2 +
 .../ClickToPay/context/ClickToPayProvider.tsx |   8 +
 .../ClickToPay/services/ClickToPayService.ts  |  12 +-
 .../services/sdks/AbstractSrcInitiator.ts     |   2 +
 .../ClickToPay/services/sdks/types.ts         |  10 +
 .../internal/ClickToPay/services/types.ts     |   1 +
 .../FormFields/Checkbox/Checkbox.scss         |   1 -
 packages/lib/src/language/locales/en-US.json  |   4 +-
 packages/playground/src/pages/Cards/Cards.js  | 250 +++++++++---------
 15 files changed, 228 insertions(+), 132 deletions(-)
 create mode 100644 packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
 create mode 100644 packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
 create mode 100644 packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/index.ts

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.tsx
index 825c9173be..576aa2380b 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.tsx
@@ -8,6 +8,7 @@ import { CtPInfo } from '../CtPInfo';
 import CtPSection from '../CtPSection';
 import useCoreContext from '../../../../../core/Context/useCoreContext';
 import './CtPOneTimePassword.scss';
+import CtPSaveCookiesCheckbox from './CtPSaveCookiesCheckbox';
 
 type CtPOneTimePasswordProps = {
     onDisplayCardComponent?(): void;
@@ -80,6 +81,9 @@ const CtPOneTimePassword = ({ onDisplayCardComponent }: CtPOneTimePasswordProps)
                 onResendCode={onResendCode}
                 isValidatingOtp={isValidatingOtp}
             />
+
+            <CtPSaveCookiesCheckbox />
+
             <Button
                 disabled={isAccountLocked}
                 label={i18n.get('continue')}
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.scss
index 922a07d3c0..bb92667a1a 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePasswordInput/CtPOneTimePasswordInput.scss
@@ -38,5 +38,5 @@
 }
 
 .adyen-checkout-ctp__section > .adyen-checkout__field.adyen-checkout__field--otp {
-    margin-bottom: 20px;
+    margin-bottom: 12px;
 }
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
new file mode 100644
index 0000000000..a83cec66a2
--- /dev/null
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
@@ -0,0 +1,23 @@
+@import "../../../../../../style/index";
+
+.adyen-checkout-ctp__otp-checkbox-container {
+  padding: 12px;
+  background-color: $color-gray-lighter;
+  border-radius: $border-radius-medium;
+}
+
+.adyen-checkout-ctp__otp-checkbox-container  label {
+  cursor: pointer;
+}
+
+.adyen-checkout-ctp__section .adyen-checkout__field.adyen-checkout-ctp__otp-checkbox-container {
+  margin-bottom: 4px;
+}
+
+.adyen-checkout-ctp__otp-checkbox-info {
+  color: $color-new-gray-darker;
+  font-size: 13px;
+  line-height: 19px;
+  font-weight: 400;
+  margin: 0 0 16px;
+}
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
new file mode 100644
index 0000000000..47b34e266d
--- /dev/null
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -0,0 +1,35 @@
+import { h, Fragment } from 'preact';
+import Field from '../../../../FormFields/Field';
+import Checkbox from '../../../../FormFields/Checkbox';
+import useCoreContext from '../../../../../../core/Context/useCoreContext';
+import { useCallback } from 'preact/hooks';
+import useClickToPayContext from '../../../context/useClickToPayContext';
+import './CtPSaveCookiesCheckbox.scss';
+
+function CtPSaveCookiesCheckbox() {
+    const { i18n } = useCoreContext();
+    const { updateStoreCookiesConsent } = useClickToPayContext();
+
+    const handleOnChange = useCallback(event => {
+        const { checked } = event.target;
+        updateStoreCookiesConsent(checked);
+    }, []);
+
+    return (
+        <Fragment>
+            <Field
+                className="adyen-checkout-ctp__otp-checkbox-container"
+                name={'click-to-pay-cookies-checkbox'}
+                addContextualElement={false}
+                useLabelElement={false}
+                i18n={i18n}
+            >
+                <Checkbox name={'click-to-pay-cookies-checkbox'} onInput={handleOnChange} label={i18n.get('ctp.otp.saveCookiesCheckbox')} />
+            </Field>
+
+            <p className="adyen-checkout-ctp__otp-checkbox-info">{i18n.get('ctp.otp.saveCookiesCheckbox.info')}</p>
+        </Fragment>
+    );
+}
+
+export default CtPSaveCookiesCheckbox;
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/index.ts b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/index.ts
new file mode 100644
index 0000000000..bfaacd0df1
--- /dev/null
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/index.ts
@@ -0,0 +1 @@
+export { default } from './CtPSaveCookiesCheckbox';
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
index 24091c246f..777039fc42 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
@@ -11,7 +11,7 @@
         display: flex;
         align-items: center;
         height: 18px;
-        margin-bottom: 14px;
+        margin-bottom: 16px;
     }
 
     &--standalone {
@@ -31,7 +31,6 @@
         font-size: 17px;
         font-weight: 600;
         line-height: 22px;
-        margin: 0 0 4px;
         padding: 0;
         width: auto;
 
@@ -49,7 +48,7 @@
     font-size: 13px;
     font-weight: 400;
     line-height: 19px;
-    color: $color-gray-darker;
+    color: $color-new-gray-darker;
     margin: 0 0 16px;
 }
 
diff --git a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
index 4bee65d829..e356340fdc 100644
--- a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
+++ b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
@@ -13,6 +13,7 @@ export interface IClickToPayContext
     isCtpPrimaryPaymentMethod: boolean;
     setIsCtpPrimaryPaymentMethod(isPrimary: boolean): void;
     logoutShopper(): Promise<void>;
+    updateStoreCookiesConsent(shouldStore: boolean): void;
     ctpState: CtpState;
     cards: ShopperCard[];
     schemes: string[];
@@ -39,6 +40,7 @@ const ClickToPayContext = createContext<IClickToPayContext>({
     isCtpPrimaryPaymentMethod: null,
     setIsCtpPrimaryPaymentMethod: null,
     logoutShopper: null,
+    updateStoreCookiesConsent: null,
     ctpState: null,
     cards: [],
     schemes: [],
diff --git a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
index ed0916994a..a9329a77bb 100644
--- a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
@@ -90,6 +90,13 @@ const ClickToPayProvider = ({
         await ctpService?.logout();
     }, [ctpService]);
 
+    const updateStoreCookiesConsent = useCallback(
+        (shouldStore: boolean) => {
+            ctpService.updateStoreCookiesConsent(shouldStore);
+        },
+        [ctpService]
+    );
+
     return (
         <ClickToPayContext.Provider
             value={{
@@ -112,6 +119,7 @@ const ClickToPayProvider = ({
                 logoutShopper,
                 startIdentityValidation,
                 finishIdentityValidation,
+                updateStoreCookiesConsent,
                 onReady
             }}
         >
diff --git a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
index 3b2e47b109..9ec444f923 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
@@ -55,6 +55,11 @@ class ClickToPayService implements IClickToPayService {
     public shopperCards: ShopperCard[] = null;
     public identityValidationData: IdentityValidationData = null;
 
+    /**
+     * Indicates if the shopper opted for saving cookies during the transaction
+     */
+    public storeCookies = false;
+
     constructor(
         schemesConfig: SchemesConfiguration,
         sdkLoader: ISrcSdkLoader,
@@ -77,6 +82,10 @@ class ClickToPayService implements IClickToPayService {
         return this.sdkLoader.schemes;
     }
 
+    public updateStoreCookiesConsent(shouldStore: boolean) {
+        this.storeCookies = shouldStore;
+    }
+
     public async initialize(): Promise<void> {
         this.setState(CtpState.Loading);
 
@@ -168,7 +177,8 @@ class ClickToPayService implements IClickToPayService {
         const checkoutResponse = await checkoutSdk.checkout({
             srcDigitalCardId: card.srcDigitalCardId,
             srcCorrelationId: card.srcCorrelationId,
-            ...(card.isDcfPopupEmbedded && { windowRef: window.frames[CTP_IFRAME_NAME] })
+            ...(card.isDcfPopupEmbedded && { windowRef: window.frames[CTP_IFRAME_NAME] }),
+            ...(this.storeCookies && { complianceSettings: { complianceResources: [{ complianceType: 'REMEMBER_ME', uri: '' }] } })
         });
 
         if (checkoutResponse.dcfActionCode !== 'COMPLETE') {
diff --git a/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts b/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
index 006d558c11..4104051d92 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
@@ -83,6 +83,8 @@ export default abstract class AbstractSrcInitiator implements ISrcInitiator {
      */
     public async checkout(params: SrcCheckoutParams): Promise<SrciCheckoutResponse> {
         try {
+            console.log(params);
+
             const checkoutResponse = await this.schemeSdk.checkout(params);
             return checkoutResponse;
         } catch (error) {
diff --git a/packages/lib/src/components/internal/ClickToPay/services/sdks/types.ts b/packages/lib/src/components/internal/ClickToPay/services/sdks/types.ts
index b52152f2f6..38e09149c1 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/sdks/types.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/sdks/types.ts
@@ -59,6 +59,16 @@ export type SrcCard = {
 export type SrcCheckoutParams = {
     srcCorrelationId: string;
     srcDigitalCardId: string;
+    complianceSettings?: {
+        complianceResources: [
+            {
+                complianceType: 'REMEMBER_ME';
+                uri: string;
+                version?: string;
+                dataPublished?: string;
+            }
+        ];
+    };
     windowRef?: Window;
 };
 
diff --git a/packages/lib/src/components/internal/ClickToPay/services/types.ts b/packages/lib/src/components/internal/ClickToPay/services/types.ts
index c6472d48b6..c0ee514e2a 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/types.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/types.ts
@@ -9,6 +9,7 @@ export interface IClickToPayService {
     identityValidationData: IdentityValidationData;
     schemes: string[];
     shopperAccountFound: boolean;
+    updateStoreCookiesConsent(shouldStore: boolean): void;
     initialize(): Promise<void>;
     checkout(card: ShopperCard): Promise<ClickToPayCheckoutPayload>;
     logout(): Promise<void>;
diff --git a/packages/lib/src/components/internal/FormFields/Checkbox/Checkbox.scss b/packages/lib/src/components/internal/FormFields/Checkbox/Checkbox.scss
index 6868c4d997..bd6d2a8667 100644
--- a/packages/lib/src/components/internal/FormFields/Checkbox/Checkbox.scss
+++ b/packages/lib/src/components/internal/FormFields/Checkbox/Checkbox.scss
@@ -7,7 +7,6 @@
         position: relative;
         padding-left: 24px;
         cursor: pointer;
-        display: inline-block;
         line-height: 19px;
         color: $color-black;
         font-size: $font-size-small;
diff --git a/packages/lib/src/language/locales/en-US.json b/packages/lib/src/language/locales/en-US.json
index 35ca67a1bc..609bdf33da 100644
--- a/packages/lib/src/language/locales/en-US.json
+++ b/packages/lib/src/language/locales/en-US.json
@@ -259,6 +259,8 @@
     "ctp.otp.codeResent": "Code resent",
     "ctp.otp.title": "Access your Click to Pay cards",
     "ctp.otp.subtitle": "Enter the code %@ sent to %@ to verify it‘s you.",
+    "ctp.otp.saveCookiesCheckbox": "Skip verification next time",
+    "ctp.otp.saveCookiesCheckbox.info": "Select to be remembered on your device and browser at participating stores for faster checkout. Not recommended for shared devices.",
     "ctp.emptyProfile.message": "No cards registered in this Click to Pay profile",
     "ctp.separatorText": "or use",
     "ctp.cards.title": "Complete payment with Click to Pay",
@@ -299,4 +301,4 @@
     "ancv.confirmPayment": "Use your ANCV application to confirm the payment.",
     "ancv.form.instruction": "The Cheque-Vacances application is necessary to validate this payment.",
     "ancv.beneficiaryId.invalid": "Enter a valid email address or ANCV ID"
-}
\ No newline at end of file
+}
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index dca46e6939..79085a6c86 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -48,129 +48,129 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
         }
     });
 
-    // Stored Card
-    if (showComps.storedCard) {
-        if (checkout.paymentMethodsResponse.storedPaymentMethods && checkout.paymentMethodsResponse.storedPaymentMethods.length > 0) {
-            const storedCardData = checkout.paymentMethodsResponse.storedPaymentMethods[2];
-            window.storedCard = checkout
-                .create('card', {
-                    ...storedCardData,
-                    disclaimerMessage
-                })
-                .mount('.storedcard-field');
-        }
-    }
-
-    // Credit card with installments
-    if (showComps.card) {
-        window.card = checkout
-            .create('card', {
-                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-                installmentOptions: {
-                    mc: {
-                        values: [1, 2],
-                        preselectedValue: 2
-                    },
-                    visa: {
-                        values: [1, 2, 3, 4],
-                        plans: ['regular', 'revolving'],
-                        preselectedValue: 4
-                    }
-                },
-                disclaimerMessage,
-                showBrandsUnderCardNumber: true,
-                showInstallmentAmounts: true,
-                onError: obj => {
-                    console.log('### Cards::onError:: obj=', obj);
-                },
-                onBinLookup: obj => {
-                    console.log('### Cards::onBinLookup:: obj=', obj);
-                },
-                billingAddressRequired: true,
-                onAddressLookup: searchFunctionExample
-            })
-            .mount('.card-field');
-    }
-
-    // Card mounted in a React app
-    if (showComps.cardInReact) {
-        window.cardReact = checkout.create('card', {});
-        MockReactApp(window, 'cardReact', document.querySelector('.react-card-field'), false);
-    }
-
-    // Bancontact card
-    if (showComps.bcmcCard) {
-        window.bancontact = checkout.create('bcmc').mount('.bancontact-field');
-    }
-
-    // Credit card with AVS
-    if (showComps.avsCard) {
-        window.cardAvs = checkout
-            .create('card', {
-                type: 'scheme',
-                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-                enableStoreDetails: true,
-
-                // holderName config:
-                hasHolderName: true,
-                holderNameRequired: true,
-                holderName: 'J. Smith',
-                positionHolderNameOnTop: true,
-
-                // billingAddress config:
-                billingAddressRequired: true,
-                billingAddressAllowedCountries: ['US', 'CA', 'GB'],
-                // billingAddressRequiredFields: ['postalCode', 'country'],
-
-                // data:
-                data: {
-                    holderName: 'J. Smith',
-                    billingAddress: {
-                        street: 'Infinite Loop',
-                        postalCode: '95014',
-                        city: 'Cupertino',
-                        houseNumberOrName: '1',
-                        country: 'US',
-                        stateOrProvince: 'CA'
-                    }
-                },
-                onError: objdobj => {
-                    console.log('component level merchant defined error handler for Card objdobj=', objdobj);
-                }
-            })
-            .mount('.card-avs-field');
-    }
-
-    if (showComps.avsPartialCard) {
-        window.avsPartialCard = checkout
-            .create('card', {
-                type: 'scheme',
-                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-                // billingAddress config:
-                billingAddressRequired: true,
-                billingAddressMode: 'partial',
-                onError: objdobj => {
-                    console.log('component level merchant defined error handler for Card objdobj=', objdobj);
-                }
-            })
-            .mount('.card-avs-partial-field');
-    }
-
-    // Credit card with KCP Authentication
-    if (showComps.kcpCard) {
-        window.kcpCard = checkout
-            .create('card', {
-                type: 'scheme',
-                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro', 'korean_local_card'],
-                // Set koreanAuthenticationRequired AND countryCode so KCP fields show at start
-                // Just set koreanAuthenticationRequired if KCP fields should only show if korean_local_card entered
-                configuration: {
-                    koreanAuthenticationRequired: true
-                },
-                countryCode: 'KR'
-            })
-            .mount('.card-kcp-field');
-    }
+    // // Stored Card
+    // if (showComps.storedCard) {
+    //     if (checkout.paymentMethodsResponse.storedPaymentMethods && checkout.paymentMethodsResponse.storedPaymentMethods.length > 0) {
+    //         const storedCardData = checkout.paymentMethodsResponse.storedPaymentMethods[2];
+    //         window.storedCard = checkout
+    //             .create('card', {
+    //                 ...storedCardData,
+    //                 disclaimerMessage
+    //             })
+    //             .mount('.storedcard-field');
+    //     }
+    // }
+    //
+    // // Credit card with installments
+    // if (showComps.card) {
+    //     window.card = checkout
+    //         .create('card', {
+    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+    //             installmentOptions: {
+    //                 mc: {
+    //                     values: [1, 2],
+    //                     preselectedValue: 2
+    //                 },
+    //                 visa: {
+    //                     values: [1, 2, 3, 4],
+    //                     plans: ['regular', 'revolving'],
+    //                     preselectedValue: 4
+    //                 }
+    //             },
+    //             disclaimerMessage,
+    //             showBrandsUnderCardNumber: true,
+    //             showInstallmentAmounts: true,
+    //             onError: obj => {
+    //                 console.log('### Cards::onError:: obj=', obj);
+    //             },
+    //             onBinLookup: obj => {
+    //                 console.log('### Cards::onBinLookup:: obj=', obj);
+    //             },
+    //             billingAddressRequired: true,
+    //             onAddressLookup: searchFunctionExample
+    //         })
+    //         .mount('.card-field');
+    // }
+    //
+    // // Card mounted in a React app
+    // if (showComps.cardInReact) {
+    //     window.cardReact = checkout.create('card', {});
+    //     MockReactApp(window, 'cardReact', document.querySelector('.react-card-field'), false);
+    // }
+    //
+    // // Bancontact card
+    // if (showComps.bcmcCard) {
+    //     window.bancontact = checkout.create('bcmc').mount('.bancontact-field');
+    // }
+    //
+    // // Credit card with AVS
+    // if (showComps.avsCard) {
+    //     window.cardAvs = checkout
+    //         .create('card', {
+    //             type: 'scheme',
+    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+    //             enableStoreDetails: true,
+    //
+    //             // holderName config:
+    //             hasHolderName: true,
+    //             holderNameRequired: true,
+    //             holderName: 'J. Smith',
+    //             positionHolderNameOnTop: true,
+    //
+    //             // billingAddress config:
+    //             billingAddressRequired: true,
+    //             billingAddressAllowedCountries: ['US', 'CA', 'GB'],
+    //             // billingAddressRequiredFields: ['postalCode', 'country'],
+    //
+    //             // data:
+    //             data: {
+    //                 holderName: 'J. Smith',
+    //                 billingAddress: {
+    //                     street: 'Infinite Loop',
+    //                     postalCode: '95014',
+    //                     city: 'Cupertino',
+    //                     houseNumberOrName: '1',
+    //                     country: 'US',
+    //                     stateOrProvince: 'CA'
+    //                 }
+    //             },
+    //             onError: objdobj => {
+    //                 console.log('component level merchant defined error handler for Card objdobj=', objdobj);
+    //             }
+    //         })
+    //         .mount('.card-avs-field');
+    // }
+    //
+    // if (showComps.avsPartialCard) {
+    //     window.avsPartialCard = checkout
+    //         .create('card', {
+    //             type: 'scheme',
+    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+    //             // billingAddress config:
+    //             billingAddressRequired: true,
+    //             billingAddressMode: 'partial',
+    //             onError: objdobj => {
+    //                 console.log('component level merchant defined error handler for Card objdobj=', objdobj);
+    //             }
+    //         })
+    //         .mount('.card-avs-partial-field');
+    // }
+    //
+    // // Credit card with KCP Authentication
+    // if (showComps.kcpCard) {
+    //     window.kcpCard = checkout
+    //         .create('card', {
+    //             type: 'scheme',
+    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro', 'korean_local_card'],
+    //             // Set koreanAuthenticationRequired AND countryCode so KCP fields show at start
+    //             // Just set koreanAuthenticationRequired if KCP fields should only show if korean_local_card entered
+    //             configuration: {
+    //                 koreanAuthenticationRequired: true
+    //             },
+    //             countryCode: 'KR'
+    //         })
+    //         .mount('.card-kcp-field');
+    // }
 
     if (showComps.clickToPay) {
         /**
@@ -184,11 +184,11 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                 configuration: {
                     visaSrciDpaId: '8e6e347c-254e-863f-0e6a-196bf2d9df02',
                     visaSrcInitiatorId: 'B9SECVKIQX2SOBQ6J9X721dVBBKHhJJl1nxxVbemHGn5oB6S8',
-                    mcDpaId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1_dpa2',
+                    mcDpaId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1_dpa2336428' + '',
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'shopper@example.com',
+                    shopperEmail: 'guilherme.ribeiro-ctp1@adyen.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From 5b1d2f6b0c2b3f5256ef377cf71ebf145bf8f55b Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Wed, 25 Oct 2023 15:24:06 +0200
Subject: [PATCH 02/15] feat: tests

---
 .../CtPOneTimePassword.test.tsx               | 71 +++++++++++++++
 .../CtPSaveCookiesCheckbox.tsx                | 13 ++-
 .../ClickToPay/context/ClickToPayContext.ts   |  2 +
 .../ClickToPay/context/ClickToPayProvider.tsx |  1 +
 .../services/ClickToPayService.test.ts        | 88 ++++++++++++++++++-
 .../internal/ClickToPay/services/types.ts     |  1 +
 6 files changed, 172 insertions(+), 4 deletions(-)
 create mode 100644 packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.test.tsx

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.test.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.test.tsx
new file mode 100644
index 0000000000..f42c481c11
--- /dev/null
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPOneTimePassword.test.tsx
@@ -0,0 +1,71 @@
+import { h } from 'preact';
+import { render, screen } from '@testing-library/preact';
+import CoreProvider from '../../../../../core/Context/CoreProvider';
+import ClickToPayProvider from '../../context/ClickToPayProvider';
+import { IClickToPayService } from '../../services/types';
+import { mock } from 'jest-mock-extended';
+import { Resources } from '../../../../../core/Context/Resources';
+import Language from '../../../../../language';
+import userEvent from '@testing-library/user-event';
+import CtPOneTimePassword from './CtPOneTimePassword';
+
+const customRender = (ui, { clickToPayService = mock<IClickToPayService>(), configuration = {} } = {}) => {
+    return render(
+        <CoreProvider i18n={new Language()} loadingContext="test" resources={new Resources()}>
+            <ClickToPayProvider
+                clickToPayService={clickToPayService}
+                isStandaloneComponent={true}
+                amount={{ value: 5000, currency: 'USD' }}
+                onSetStatus={jest.fn()}
+                configuration={configuration}
+                onError={jest.fn()}
+                onSubmit={jest.fn()}
+                setClickToPayRef={jest.fn()}
+            >
+                {ui}
+            </ClickToPayProvider>
+        </CoreProvider>
+    );
+};
+
+describe('Click to Pay - CtPOneTimePassword', () => {
+    test('should set to store the cookie if shopper ticks the checkbox', async () => {
+        const user = userEvent.setup();
+        const ctpServiceMock = mock<IClickToPayService>();
+        ctpServiceMock.schemes = ['visa', 'mc'];
+        // const onResendCodeMock = jest.fn();
+
+        customRender(<CtPOneTimePassword />, { clickToPayService: ctpServiceMock });
+
+        // Default false
+        const checkbox = (await screen.findByLabelText('Skip verification next time')) as HTMLInputElement;
+        expect(checkbox.checked).toBe(false);
+
+        // Checked
+        await user.click(checkbox);
+        expect(checkbox.checked).toBe(true);
+        expect(ctpServiceMock.updateStoreCookiesConsent).toHaveBeenCalledWith(true);
+        expect(ctpServiceMock.updateStoreCookiesConsent).toHaveBeenCalledTimes(1);
+
+        // Unchecked
+        await user.click(checkbox);
+        expect(checkbox.checked).toBe(false);
+        expect(ctpServiceMock.updateStoreCookiesConsent).toHaveBeenCalledWith(false);
+        expect(ctpServiceMock.updateStoreCookiesConsent).toHaveBeenCalledTimes(2);
+    });
+
+    test('should pass OTP to ClickToPay service', async () => {
+        const user = userEvent.setup({ delay: 100 });
+        const ctpServiceMock = mock<IClickToPayService>();
+        ctpServiceMock.schemes = ['visa', 'mc'];
+
+        customRender(<CtPOneTimePassword />, { clickToPayService: ctpServiceMock });
+
+        await screen.findByLabelText('One time code', { exact: false });
+
+        await user.keyboard('654321');
+        await user.keyboard('[Enter]');
+
+        expect(ctpServiceMock.finishIdentityValidation).toHaveBeenCalledWith('654321');
+    });
+});
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
index 47b34e266d..504e841b33 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -2,16 +2,18 @@ import { h, Fragment } from 'preact';
 import Field from '../../../../FormFields/Field';
 import Checkbox from '../../../../FormFields/Checkbox';
 import useCoreContext from '../../../../../../core/Context/useCoreContext';
-import { useCallback } from 'preact/hooks';
+import { useCallback, useState } from 'preact/hooks';
 import useClickToPayContext from '../../../context/useClickToPayContext';
 import './CtPSaveCookiesCheckbox.scss';
 
 function CtPSaveCookiesCheckbox() {
     const { i18n } = useCoreContext();
-    const { updateStoreCookiesConsent } = useClickToPayContext();
+    const { updateStoreCookiesConsent, isStoringCookies } = useClickToPayContext();
+    const [checked, setIsChecked] = useState(isStoringCookies);
 
     const handleOnChange = useCallback(event => {
         const { checked } = event.target;
+        setIsChecked(checked);
         updateStoreCookiesConsent(checked);
     }, []);
 
@@ -24,7 +26,12 @@ function CtPSaveCookiesCheckbox() {
                 useLabelElement={false}
                 i18n={i18n}
             >
-                <Checkbox name={'click-to-pay-cookies-checkbox'} onInput={handleOnChange} label={i18n.get('ctp.otp.saveCookiesCheckbox')} />
+                <Checkbox
+                    name={'click-to-pay-cookies-checkbox'}
+                    onInput={handleOnChange}
+                    label={i18n.get('ctp.otp.saveCookiesCheckbox')}
+                    checked={checked}
+                />
             </Field>
 
             <p className="adyen-checkout-ctp__otp-checkbox-info">{i18n.get('ctp.otp.saveCookiesCheckbox.info')}</p>
diff --git a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
index e356340fdc..b7e8a89370 100644
--- a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
+++ b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
@@ -11,6 +11,7 @@ export interface IClickToPayContext
     extends Pick<IClickToPayService, 'checkout' | 'startIdentityValidation' | 'finishIdentityValidation' | 'verifyIfShopperIsEnrolled'> {
     isStandaloneComponent: boolean;
     isCtpPrimaryPaymentMethod: boolean;
+    isStoringCookies: boolean;
     setIsCtpPrimaryPaymentMethod(isPrimary: boolean): void;
     logoutShopper(): Promise<void>;
     updateStoreCookiesConsent(shouldStore: boolean): void;
@@ -38,6 +39,7 @@ const ClickToPayContext = createContext<IClickToPayContext>({
     configuration: null,
     isStandaloneComponent: null,
     isCtpPrimaryPaymentMethod: null,
+    isStoringCookies: null,
     setIsCtpPrimaryPaymentMethod: null,
     logoutShopper: null,
     updateStoreCookiesConsent: null,
diff --git a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
index a9329a77bb..41f2add472 100644
--- a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayProvider.tsx
@@ -106,6 +106,7 @@ const ClickToPayProvider = ({
                 onSetStatus,
                 amount,
                 configuration,
+                isStoringCookies: ctpService?.storeCookies,
                 isStandaloneComponent,
                 isCtpPrimaryPaymentMethod,
                 setIsCtpPrimaryPaymentMethod,
diff --git a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.test.ts b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.test.ts
index b543b90723..1ecd73f515 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.test.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.test.ts
@@ -4,8 +4,94 @@ import { ISrcSdkLoader } from './sdks/SrcSdkLoader';
 import VisaSdk from './sdks/VisaSdk';
 import MastercardSdk from './sdks/MastercardSdk';
 import { IdentityLookupParams, SchemesConfiguration } from './types';
-import { SrciIdentityLookupResponse, SrcProfile } from './sdks/types';
+import { SrciCheckoutResponse, SrciIdentityLookupResponse, SrcProfile } from './sdks/types';
 import SrciError from './sdks/SrciError';
+import ShopperCard from '../models/ShopperCard';
+
+test('should be able to tweak the configuration to store the cookie', () => {
+    const visa = mock<VisaSdk>();
+    const schemesConfig = mock<SchemesConfiguration>();
+    const sdkLoader = mock<ISrcSdkLoader>();
+    sdkLoader.load.mockResolvedValue([visa]);
+
+    const service = new ClickToPayService(schemesConfig, sdkLoader, 'test');
+    expect(service.storeCookies).toBe(false);
+
+    service.updateStoreCookiesConsent(true);
+    expect(service.storeCookies).toBe(true);
+
+    service.updateStoreCookiesConsent(false);
+    expect(service.storeCookies).toBe(false);
+});
+
+test('should pass the complianceSettings if the cookie is set to be stored', async () => {
+    const checkoutResponseMock = mock<SrciCheckoutResponse>();
+    checkoutResponseMock.dcfActionCode = 'COMPLETE';
+
+    const profileFromVisaSrcSystem: SrcProfile = {
+        srcCorrelationId: '123456',
+        profiles: [
+            {
+                maskedCards: [
+                    {
+                        srcDigitalCardId: 'xxxx',
+                        panLastFour: '8902',
+                        dateOfCardLastUsed: '2019-09-28T08:10:02.312Z',
+                        paymentCardDescriptor: 'visa',
+                        panExpirationMonth: '12',
+                        panExpirationYear: '2020',
+                        digitalCardData: {
+                            descriptorName: 'Visa',
+                            artUri: 'https://image.com/visa'
+                        },
+                        tokenId: '9w8e8e'
+                    }
+                ]
+            }
+        ]
+    };
+
+    const visa = mock<VisaSdk>();
+    // @ts-ignore Mocking readonly property
+    visa.schemeName = 'visa';
+    visa.checkout.mockResolvedValue(checkoutResponseMock);
+    visa.init.mockResolvedValue();
+    visa.isRecognized.mockResolvedValue({ recognized: true, idTokens: ['id-token'] });
+    visa.getSrcProfile.mockResolvedValue(profileFromVisaSrcSystem);
+
+    const sdkLoader = mock<ISrcSdkLoader>();
+    const schemesConfig = mock<SchemesConfiguration>();
+
+    const shopperCard = mock<ShopperCard>();
+    shopperCard.srcDigitalCardId = 'xxxx';
+    shopperCard.srcCorrelationId = 'zzzz';
+    shopperCard.scheme = 'visa';
+    Object.defineProperty(shopperCard, 'isDcfPopupEmbedded', {
+        get: jest.fn(() => false)
+    });
+
+    sdkLoader.load.mockResolvedValue([visa]);
+
+    const service = new ClickToPayService(schemesConfig, sdkLoader, 'test');
+    service.updateStoreCookiesConsent(true);
+
+    await service.initialize();
+    await service.checkout(shopperCard);
+
+    expect(visa.checkout).toHaveBeenCalledTimes(1);
+    expect(visa.checkout).toHaveBeenCalledWith({
+        complianceSettings: {
+            complianceResources: [
+                {
+                    complianceType: 'REMEMBER_ME',
+                    uri: ''
+                }
+            ]
+        },
+        srcCorrelationId: 'zzzz',
+        srcDigitalCardId: 'xxxx'
+    });
+});
 
 test('should pass the correct configuration to the respective scheme SDKs', async () => {
     const visa = mock<VisaSdk>();
diff --git a/packages/lib/src/components/internal/ClickToPay/services/types.ts b/packages/lib/src/components/internal/ClickToPay/services/types.ts
index c0ee514e2a..e42fe3fe0e 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/types.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/types.ts
@@ -9,6 +9,7 @@ export interface IClickToPayService {
     identityValidationData: IdentityValidationData;
     schemes: string[];
     shopperAccountFound: boolean;
+    storeCookies: boolean;
     updateStoreCookiesConsent(shouldStore: boolean): void;
     initialize(): Promise<void>;
     checkout(card: ShopperCard): Promise<ClickToPayCheckoutPayload>;

From 57687e31ee92c7cb7bf319beb1b14ddb6739b09a Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Thu, 26 Oct 2023 15:44:27 +0200
Subject: [PATCH 03/15] feat: timeout adjust

---
 .../ClickToPay/services/ClickToPayService.ts  |   9 +-
 .../ClickToPay/services/sdks/MastercardSdk.ts |  17 +-
 .../ClickToPay/services/sdks/VisaSdk.ts       |  17 +-
 packages/playground/src/pages/Cards/Cards.js  | 250 +++++++++---------
 4 files changed, 154 insertions(+), 139 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
index 9ec444f923..a23c882620 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/ClickToPayService.ts
@@ -92,6 +92,7 @@ class ClickToPayService implements IClickToPayService {
         try {
             this.sdks = await this.sdkLoader.load(this.environment);
             await this.initiateSdks();
+
             const { recognized = false, idTokens = null } = await this.verifyIfShopperIsRecognized();
 
             if (recognized) {
@@ -113,10 +114,14 @@ class ClickToPayService implements IClickToPayService {
 
             this.setState(CtpState.NotAvailable);
         } catch (error) {
-            if (error instanceof SrciError) console.warn(`Error at ClickToPayService # init: ${error.toString()}`);
-            if (error instanceof TimeoutError) {
+            if (error instanceof SrciError && error?.reason === 'REQUEST_TIMEOUT') {
+                const timeoutError = new TimeoutError(`ClickToPayService - Timeout during ${error.source}() of the scheme '${error.scheme}'`);
+                this.onTimeout?.(timeoutError);
+            } else if (error instanceof TimeoutError) {
                 console.warn(error.toString());
                 this.onTimeout?.(error);
+            } else if (error instanceof SrciError) {
+                console.warn(`Error at ClickToPayService # init: ${error.toString()}`);
             } else {
                 console.warn(error);
             }
diff --git a/packages/lib/src/components/internal/ClickToPay/services/sdks/MastercardSdk.ts b/packages/lib/src/components/internal/ClickToPay/services/sdks/MastercardSdk.ts
index 901439a5ae..0df9d20d75 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/sdks/MastercardSdk.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/sdks/MastercardSdk.ts
@@ -33,12 +33,17 @@ class MastercardSdk extends AbstractSrcInitiator {
     }
 
     public async init(params: SrcInitParams, srciTransactionId: string): Promise<void> {
-        const sdkProps = {
-            ...params,
-            ...getMastercardSettings(this.customSdkConfiguration),
-            srciTransactionId
-        };
-        await this.schemeSdk.init(sdkProps);
+        try {
+            const sdkProps = {
+                ...params,
+                ...getMastercardSettings(this.customSdkConfiguration),
+                srciTransactionId
+            };
+            await this.schemeSdk.init(sdkProps);
+        } catch (err) {
+            const srciError = new SrciError(err, 'init', this.schemeName);
+            throw srciError;
+        }
     }
 
     public async identityLookup({ identityValue, type }: SrcIdentityLookupParams): Promise<SrciIdentityLookupResponse> {
diff --git a/packages/lib/src/components/internal/ClickToPay/services/sdks/VisaSdk.ts b/packages/lib/src/components/internal/ClickToPay/services/sdks/VisaSdk.ts
index bbe3b3ae35..90eb4249b6 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/sdks/VisaSdk.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/sdks/VisaSdk.ts
@@ -33,13 +33,18 @@ class VisaSdk extends AbstractSrcInitiator {
     }
 
     public async init(params: SrcInitParams, srciTransactionId: string): Promise<void> {
-        const sdkProps = {
-            ...params,
-            ...getVisaSetttings(this.customSdkConfiguration),
-            srciTransactionId
-        };
+        try {
+            const sdkProps = {
+                ...params,
+                ...getVisaSetttings(this.customSdkConfiguration),
+                srciTransactionId
+            };
 
-        await this.schemeSdk.init(sdkProps);
+            await this.schemeSdk.init(sdkProps);
+        } catch (err) {
+            const srciError = new SrciError(err, 'init', this.schemeName);
+            throw srciError;
+        }
     }
 
     public async identityLookup({ identityValue, type }: SrcIdentityLookupParams): Promise<SrciIdentityLookupResponse> {
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index 79085a6c86..dca46e6939 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -48,129 +48,129 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
         }
     });
 
-    // // Stored Card
-    // if (showComps.storedCard) {
-    //     if (checkout.paymentMethodsResponse.storedPaymentMethods && checkout.paymentMethodsResponse.storedPaymentMethods.length > 0) {
-    //         const storedCardData = checkout.paymentMethodsResponse.storedPaymentMethods[2];
-    //         window.storedCard = checkout
-    //             .create('card', {
-    //                 ...storedCardData,
-    //                 disclaimerMessage
-    //             })
-    //             .mount('.storedcard-field');
-    //     }
-    // }
-    //
-    // // Credit card with installments
-    // if (showComps.card) {
-    //     window.card = checkout
-    //         .create('card', {
-    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-    //             installmentOptions: {
-    //                 mc: {
-    //                     values: [1, 2],
-    //                     preselectedValue: 2
-    //                 },
-    //                 visa: {
-    //                     values: [1, 2, 3, 4],
-    //                     plans: ['regular', 'revolving'],
-    //                     preselectedValue: 4
-    //                 }
-    //             },
-    //             disclaimerMessage,
-    //             showBrandsUnderCardNumber: true,
-    //             showInstallmentAmounts: true,
-    //             onError: obj => {
-    //                 console.log('### Cards::onError:: obj=', obj);
-    //             },
-    //             onBinLookup: obj => {
-    //                 console.log('### Cards::onBinLookup:: obj=', obj);
-    //             },
-    //             billingAddressRequired: true,
-    //             onAddressLookup: searchFunctionExample
-    //         })
-    //         .mount('.card-field');
-    // }
-    //
-    // // Card mounted in a React app
-    // if (showComps.cardInReact) {
-    //     window.cardReact = checkout.create('card', {});
-    //     MockReactApp(window, 'cardReact', document.querySelector('.react-card-field'), false);
-    // }
-    //
-    // // Bancontact card
-    // if (showComps.bcmcCard) {
-    //     window.bancontact = checkout.create('bcmc').mount('.bancontact-field');
-    // }
-    //
-    // // Credit card with AVS
-    // if (showComps.avsCard) {
-    //     window.cardAvs = checkout
-    //         .create('card', {
-    //             type: 'scheme',
-    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-    //             enableStoreDetails: true,
-    //
-    //             // holderName config:
-    //             hasHolderName: true,
-    //             holderNameRequired: true,
-    //             holderName: 'J. Smith',
-    //             positionHolderNameOnTop: true,
-    //
-    //             // billingAddress config:
-    //             billingAddressRequired: true,
-    //             billingAddressAllowedCountries: ['US', 'CA', 'GB'],
-    //             // billingAddressRequiredFields: ['postalCode', 'country'],
-    //
-    //             // data:
-    //             data: {
-    //                 holderName: 'J. Smith',
-    //                 billingAddress: {
-    //                     street: 'Infinite Loop',
-    //                     postalCode: '95014',
-    //                     city: 'Cupertino',
-    //                     houseNumberOrName: '1',
-    //                     country: 'US',
-    //                     stateOrProvince: 'CA'
-    //                 }
-    //             },
-    //             onError: objdobj => {
-    //                 console.log('component level merchant defined error handler for Card objdobj=', objdobj);
-    //             }
-    //         })
-    //         .mount('.card-avs-field');
-    // }
-    //
-    // if (showComps.avsPartialCard) {
-    //     window.avsPartialCard = checkout
-    //         .create('card', {
-    //             type: 'scheme',
-    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
-    //             // billingAddress config:
-    //             billingAddressRequired: true,
-    //             billingAddressMode: 'partial',
-    //             onError: objdobj => {
-    //                 console.log('component level merchant defined error handler for Card objdobj=', objdobj);
-    //             }
-    //         })
-    //         .mount('.card-avs-partial-field');
-    // }
-    //
-    // // Credit card with KCP Authentication
-    // if (showComps.kcpCard) {
-    //     window.kcpCard = checkout
-    //         .create('card', {
-    //             type: 'scheme',
-    //             brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro', 'korean_local_card'],
-    //             // Set koreanAuthenticationRequired AND countryCode so KCP fields show at start
-    //             // Just set koreanAuthenticationRequired if KCP fields should only show if korean_local_card entered
-    //             configuration: {
-    //                 koreanAuthenticationRequired: true
-    //             },
-    //             countryCode: 'KR'
-    //         })
-    //         .mount('.card-kcp-field');
-    // }
+    // Stored Card
+    if (showComps.storedCard) {
+        if (checkout.paymentMethodsResponse.storedPaymentMethods && checkout.paymentMethodsResponse.storedPaymentMethods.length > 0) {
+            const storedCardData = checkout.paymentMethodsResponse.storedPaymentMethods[2];
+            window.storedCard = checkout
+                .create('card', {
+                    ...storedCardData,
+                    disclaimerMessage
+                })
+                .mount('.storedcard-field');
+        }
+    }
+
+    // Credit card with installments
+    if (showComps.card) {
+        window.card = checkout
+            .create('card', {
+                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+                installmentOptions: {
+                    mc: {
+                        values: [1, 2],
+                        preselectedValue: 2
+                    },
+                    visa: {
+                        values: [1, 2, 3, 4],
+                        plans: ['regular', 'revolving'],
+                        preselectedValue: 4
+                    }
+                },
+                disclaimerMessage,
+                showBrandsUnderCardNumber: true,
+                showInstallmentAmounts: true,
+                onError: obj => {
+                    console.log('### Cards::onError:: obj=', obj);
+                },
+                onBinLookup: obj => {
+                    console.log('### Cards::onBinLookup:: obj=', obj);
+                },
+                billingAddressRequired: true,
+                onAddressLookup: searchFunctionExample
+            })
+            .mount('.card-field');
+    }
+
+    // Card mounted in a React app
+    if (showComps.cardInReact) {
+        window.cardReact = checkout.create('card', {});
+        MockReactApp(window, 'cardReact', document.querySelector('.react-card-field'), false);
+    }
+
+    // Bancontact card
+    if (showComps.bcmcCard) {
+        window.bancontact = checkout.create('bcmc').mount('.bancontact-field');
+    }
+
+    // Credit card with AVS
+    if (showComps.avsCard) {
+        window.cardAvs = checkout
+            .create('card', {
+                type: 'scheme',
+                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+                enableStoreDetails: true,
+
+                // holderName config:
+                hasHolderName: true,
+                holderNameRequired: true,
+                holderName: 'J. Smith',
+                positionHolderNameOnTop: true,
+
+                // billingAddress config:
+                billingAddressRequired: true,
+                billingAddressAllowedCountries: ['US', 'CA', 'GB'],
+                // billingAddressRequiredFields: ['postalCode', 'country'],
+
+                // data:
+                data: {
+                    holderName: 'J. Smith',
+                    billingAddress: {
+                        street: 'Infinite Loop',
+                        postalCode: '95014',
+                        city: 'Cupertino',
+                        houseNumberOrName: '1',
+                        country: 'US',
+                        stateOrProvince: 'CA'
+                    }
+                },
+                onError: objdobj => {
+                    console.log('component level merchant defined error handler for Card objdobj=', objdobj);
+                }
+            })
+            .mount('.card-avs-field');
+    }
+
+    if (showComps.avsPartialCard) {
+        window.avsPartialCard = checkout
+            .create('card', {
+                type: 'scheme',
+                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro'],
+                // billingAddress config:
+                billingAddressRequired: true,
+                billingAddressMode: 'partial',
+                onError: objdobj => {
+                    console.log('component level merchant defined error handler for Card objdobj=', objdobj);
+                }
+            })
+            .mount('.card-avs-partial-field');
+    }
+
+    // Credit card with KCP Authentication
+    if (showComps.kcpCard) {
+        window.kcpCard = checkout
+            .create('card', {
+                type: 'scheme',
+                brands: ['mc', 'visa', 'amex', 'bcmc', 'maestro', 'korean_local_card'],
+                // Set koreanAuthenticationRequired AND countryCode so KCP fields show at start
+                // Just set koreanAuthenticationRequired if KCP fields should only show if korean_local_card entered
+                configuration: {
+                    koreanAuthenticationRequired: true
+                },
+                countryCode: 'KR'
+            })
+            .mount('.card-kcp-field');
+    }
 
     if (showComps.clickToPay) {
         /**
@@ -184,11 +184,11 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                 configuration: {
                     visaSrciDpaId: '8e6e347c-254e-863f-0e6a-196bf2d9df02',
                     visaSrcInitiatorId: 'B9SECVKIQX2SOBQ6J9X721dVBBKHhJJl1nxxVbemHGn5oB6S8',
-                    mcDpaId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1_dpa2336428' + '',
+                    mcDpaId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1_dpa2',
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'guilherme.ribeiro-ctp1@adyen.com',
+                    shopperEmail: 'shopper@example.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From 9c048191376903d342cf6c11879658da42a2d8bf Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Thu, 26 Oct 2023 15:46:54 +0200
Subject: [PATCH 04/15] fix: removed log

---
 .../internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts   | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts b/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
index 4104051d92..006d558c11 100644
--- a/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
+++ b/packages/lib/src/components/internal/ClickToPay/services/sdks/AbstractSrcInitiator.ts
@@ -83,8 +83,6 @@ export default abstract class AbstractSrcInitiator implements ISrcInitiator {
      */
     public async checkout(params: SrcCheckoutParams): Promise<SrciCheckoutResponse> {
         try {
-            console.log(params);
-
             const checkoutResponse = await this.schemeSdk.checkout(params);
             return checkoutResponse;
         } catch (error) {

From f816ec3d4ce615a98998032f7354a28ff321b49d Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Fri, 27 Oct 2023 15:11:37 +0200
Subject: [PATCH 05/15] fix: checking checkbox + styles

---
 .../CtPSaveCookiesCheckbox.tsx                   | 16 ++++++++--------
 .../components/CtPSection/CtPSection.scss        |  1 +
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
index 504e841b33..2535d09ca4 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -2,7 +2,7 @@ import { h, Fragment } from 'preact';
 import Field from '../../../../FormFields/Field';
 import Checkbox from '../../../../FormFields/Checkbox';
 import useCoreContext from '../../../../../../core/Context/useCoreContext';
-import { useCallback, useState } from 'preact/hooks';
+import { useState, useCallback } from 'preact/hooks';
 import useClickToPayContext from '../../../context/useClickToPayContext';
 import './CtPSaveCookiesCheckbox.scss';
 
@@ -11,23 +11,23 @@ function CtPSaveCookiesCheckbox() {
     const { updateStoreCookiesConsent, isStoringCookies } = useClickToPayContext();
     const [checked, setIsChecked] = useState(isStoringCookies);
 
-    const handleOnChange = useCallback(event => {
-        const { checked } = event.target;
-        setIsChecked(checked);
-        updateStoreCookiesConsent(checked);
-    }, []);
+    const handleOnChange = useCallback(() => {
+        const newChecked = !checked;
+        setIsChecked(newChecked);
+        updateStoreCookiesConsent(newChecked);
+    }, [updateStoreCookiesConsent, setIsChecked, checked]);
 
     return (
         <Fragment>
             <Field
                 className="adyen-checkout-ctp__otp-checkbox-container"
-                name={'click-to-pay-cookies-checkbox'}
+                name={'clickToPayCookiesCheckbox'}
                 addContextualElement={false}
                 useLabelElement={false}
                 i18n={i18n}
             >
                 <Checkbox
-                    name={'click-to-pay-cookies-checkbox'}
+                    name={'clickToPayCookiesCheckbox'}
                     onInput={handleOnChange}
                     label={i18n.get('ctp.otp.saveCookiesCheckbox')}
                     checked={checked}
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
index 777039fc42..1f6c8cd586 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
@@ -32,6 +32,7 @@
         font-weight: 600;
         line-height: 22px;
         padding: 0;
+        margin: 0;
         width: auto;
 
         @media screen and (max-width: 400px) {

From 3ba9d6f22398aea07ca302e207cd888754ad2b11 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Mon, 30 Oct 2023 11:55:53 +0100
Subject: [PATCH 06/15] fix: using input email

---
 .../internal/ClickToPay/components/CtPLogin/CtPLoginInput.tsx | 4 ++--
 .../lib/src/components/internal/FormFields/InputEmail.tsx     | 4 ++--
 packages/playground/src/pages/Cards/Cards.js                  | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPLogin/CtPLoginInput.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPLogin/CtPLoginInput.tsx
index 244b8df5fe..4a89bedc77 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPLogin/CtPLoginInput.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPLogin/CtPLoginInput.tsx
@@ -4,7 +4,7 @@ import { loginValidationRules } from './validate';
 import useCoreContext from '../../../../../core/Context/useCoreContext';
 import useForm from '../../../../../utils/useForm';
 import Field from '../../../FormFields/Field';
-import InputText from '../../../FormFields/InputText';
+import InputEmail from '../../../FormFields/InputEmail';
 
 type OnChangeProps = { data: CtPLoginInputDataState; valid; errors; isValid: boolean };
 
@@ -73,7 +73,7 @@ const CtPLoginInput = (props: CtPLoginInputProps): h.JSX.Element => {
             errorMessage={isLoginInputDirty ? props.errorMessage || !!errors.shopperLogin : null}
             classNameModifiers={['shopperLogin']}
         >
-            <InputText
+            <InputEmail
                 name={'shopperLogin'}
                 autocorrect={'off'}
                 spellcheck={false}
diff --git a/packages/lib/src/components/internal/FormFields/InputEmail.tsx b/packages/lib/src/components/internal/FormFields/InputEmail.tsx
index 888601615f..9da03e0d6c 100644
--- a/packages/lib/src/components/internal/FormFields/InputEmail.tsx
+++ b/packages/lib/src/components/internal/FormFields/InputEmail.tsx
@@ -1,6 +1,6 @@
 import { h } from 'preact';
-import InputBase from './InputBase';
+import InputBase, { InputBaseProps } from './InputBase';
 
-export default function InputEmail(props) {
+export default function InputEmail(props: InputBaseProps) {
     return <InputBase {...props} type="email" autoCapitalize="off" />;
 }
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index dca46e6939..fee2de3722 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -188,7 +188,7 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'shopper@example.com',
+                    shopperEmail: 'gui.ctp@adyen.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From d140714a1edb6620296255937d400d7c57c25927 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Mon, 6 Nov 2023 14:21:00 +0100
Subject: [PATCH 07/15] feat: ui changes

---
 .../CtPSaveCookiesCheckbox.scss               | 14 +++++++-
 .../CtPSaveCookiesCheckbox.tsx                | 36 ++++++++++++-------
 packages/lib/src/language/locales/en-US.json  |  6 ++--
 3 files changed, 41 insertions(+), 15 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
index a83cec66a2..4ec86da541 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
@@ -4,6 +4,18 @@
   padding: 12px;
   background-color: $color-gray-lighter;
   border-radius: $border-radius-medium;
+  margin-bottom: 16px;
+}
+
+.adyen-checkout-ctp__otp-checkbox-container--checked {
+  background-color: #F2F8FF;
+}
+
+.adyen-checkout-ctp__otp-readmore-button {
+  all: unset;
+  text-transform: lowercase;
+  cursor: pointer;
+  color: $color-blue;
 }
 
 .adyen-checkout-ctp__otp-checkbox-container  label {
@@ -19,5 +31,5 @@
   font-size: 13px;
   line-height: 19px;
   font-weight: 400;
-  margin: 0 0 16px;
+  margin: 4px 0 0;
 }
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
index 2535d09ca4..18b73838e4 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -1,4 +1,5 @@
-import { h, Fragment } from 'preact';
+import { Fragment, h } from 'preact';
+import classnames from 'classnames';
 import Field from '../../../../FormFields/Field';
 import Checkbox from '../../../../FormFields/Checkbox';
 import useCoreContext from '../../../../../../core/Context/useCoreContext';
@@ -10,6 +11,7 @@ function CtPSaveCookiesCheckbox() {
     const { i18n } = useCoreContext();
     const { updateStoreCookiesConsent, isStoringCookies } = useClickToPayContext();
     const [checked, setIsChecked] = useState(isStoringCookies);
+    const [isTextTruncated, setIsTextTruncated] = useState<boolean>(true);
 
     const handleOnChange = useCallback(() => {
         const newChecked = !checked;
@@ -18,24 +20,34 @@ function CtPSaveCookiesCheckbox() {
     }, [updateStoreCookiesConsent, setIsChecked, checked]);
 
     return (
-        <Fragment>
-            <Field
-                className="adyen-checkout-ctp__otp-checkbox-container"
-                name={'clickToPayCookiesCheckbox'}
-                addContextualElement={false}
-                useLabelElement={false}
-                i18n={i18n}
-            >
+        <div
+            className={classnames('adyen-checkout-ctp__otp-checkbox-container', {
+                'adyen-checkout-ctp__otp-checkbox-container--checked': checked
+            })}
+        >
+            <Field name={'clickToPayCookiesCheckbox'} addContextualElement={false} useLabelElement={false} i18n={i18n}>
                 <Checkbox
                     name={'clickToPayCookiesCheckbox'}
                     onInput={handleOnChange}
-                    label={i18n.get('ctp.otp.saveCookiesCheckbox')}
+                    label={i18n.get('ctp.otp.saveCookiesCheckbox.label')}
                     checked={checked}
+                    aria-describedby={'adyen-ctp-cookies-info'}
                 />
             </Field>
 
-            <p className="adyen-checkout-ctp__otp-checkbox-info">{i18n.get('ctp.otp.saveCookiesCheckbox.info')}</p>
-        </Fragment>
+            <p className="adyen-checkout-ctp__otp-checkbox-info">
+                {isTextTruncated ? (
+                    <Fragment>
+                        <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.shorterInfo')} </span>
+                        <button className="adyen-checkout-ctp__otp-readmore-button" onClick={() => setIsTextTruncated(false)}>
+                            {i18n.get('readMore')}..
+                        </button>
+                    </Fragment>
+                ) : (
+                    <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.information')}</span>
+                )}
+            </p>
+        </div>
     );
 }
 
diff --git a/packages/lib/src/language/locales/en-US.json b/packages/lib/src/language/locales/en-US.json
index 609bdf33da..b2b2a89ddf 100644
--- a/packages/lib/src/language/locales/en-US.json
+++ b/packages/lib/src/language/locales/en-US.json
@@ -4,6 +4,7 @@
     "payButton.with": "Pay %{value} with %{maskedData}",
     "close": "Close",
     "storeDetails": "Save for my next payment",
+    "readMore": "Read more",
     "creditCard.holderName": "Name on card",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Enter name as shown on card",
@@ -259,8 +260,9 @@
     "ctp.otp.codeResent": "Code resent",
     "ctp.otp.title": "Access your Click to Pay cards",
     "ctp.otp.subtitle": "Enter the code %@ sent to %@ to verify it‘s you.",
-    "ctp.otp.saveCookiesCheckbox": "Skip verification next time",
-    "ctp.otp.saveCookiesCheckbox.info": "Select to be remembered on your device and browser at participating stores for faster checkout. Not recommended for shared devices.",
+    "ctp.otp.saveCookiesCheckbox.label": "Skip verification next time",
+    "ctp.otp.saveCookiesCheckbox.information": "Select to be remembered on your device and browser at participating stores for faster checkout. Not recommended for shared devices.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Select to be remembered on your device and browser",
     "ctp.emptyProfile.message": "No cards registered in this Click to Pay profile",
     "ctp.separatorText": "or use",
     "ctp.cards.title": "Complete payment with Click to Pay",

From 0165e3172c4102cf61cfc92cbcf071fb191c8363 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Mon, 13 Nov 2023 14:39:39 +0100
Subject: [PATCH 08/15] feat: removing truncating text feature

---
 .../CtPSaveCookiesCheckbox.scss                  |  7 -------
 .../CtPSaveCookiesCheckbox.tsx                   | 16 +++-------------
 packages/playground/src/pages/Cards/Cards.js     |  2 +-
 3 files changed, 4 insertions(+), 21 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
index 4ec86da541..a697c6ed72 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
@@ -11,13 +11,6 @@
   background-color: #F2F8FF;
 }
 
-.adyen-checkout-ctp__otp-readmore-button {
-  all: unset;
-  text-transform: lowercase;
-  cursor: pointer;
-  color: $color-blue;
-}
-
 .adyen-checkout-ctp__otp-checkbox-container  label {
   cursor: pointer;
 }
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
index 18b73838e4..54913dff98 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -1,4 +1,4 @@
-import { Fragment, h } from 'preact';
+import { h } from 'preact';
 import classnames from 'classnames';
 import Field from '../../../../FormFields/Field';
 import Checkbox from '../../../../FormFields/Checkbox';
@@ -11,7 +11,6 @@ function CtPSaveCookiesCheckbox() {
     const { i18n } = useCoreContext();
     const { updateStoreCookiesConsent, isStoringCookies } = useClickToPayContext();
     const [checked, setIsChecked] = useState(isStoringCookies);
-    const [isTextTruncated, setIsTextTruncated] = useState<boolean>(true);
 
     const handleOnChange = useCallback(() => {
         const newChecked = !checked;
@@ -35,17 +34,8 @@ function CtPSaveCookiesCheckbox() {
                 />
             </Field>
 
-            <p className="adyen-checkout-ctp__otp-checkbox-info">
-                {isTextTruncated ? (
-                    <Fragment>
-                        <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.shorterInfo')} </span>
-                        <button className="adyen-checkout-ctp__otp-readmore-button" onClick={() => setIsTextTruncated(false)}>
-                            {i18n.get('readMore')}..
-                        </button>
-                    </Fragment>
-                ) : (
-                    <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.information')}</span>
-                )}
+            <p className="adyen-checkout-ctp__otp-checkbox-info" id="adyen-ctp-cookies-info">
+                {i18n.get('ctp.otp.saveCookiesCheckbox.information')}
             </p>
         </div>
     );
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index fee2de3722..b8b8f18388 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -188,7 +188,7 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'gui.ctp@adyen.com',
+                    shopperEmail: 'shopper@email.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From 0c636621990c28d2ff9562cce96db232e6735d96 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Mon, 13 Nov 2023 17:01:20 +0100
Subject: [PATCH 09/15] feat: changeset

---
 .changeset/lemon-emus-wait.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/lemon-emus-wait.md

diff --git a/.changeset/lemon-emus-wait.md b/.changeset/lemon-emus-wait.md
new file mode 100644
index 0000000000..7d3f2c95d6
--- /dev/null
+++ b/.changeset/lemon-emus-wait.md
@@ -0,0 +1,5 @@
+---
+'@adyen/adyen-web': minor
+---
+
+Click to Pay - Enabling MC/Visa to drop cookies if the shopper gives consent

From 2995e80049e5f5c39457e4216598286e1cf24177 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Mon, 13 Nov 2023 17:03:52 +0100
Subject: [PATCH 10/15] fix: code review points

---
 .../components/internal/ClickToPay/context/ClickToPayContext.ts | 2 +-
 packages/playground/src/pages/Cards/Cards.js                    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
index b7e8a89370..be561ef336 100644
--- a/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
+++ b/packages/lib/src/components/internal/ClickToPay/context/ClickToPayContext.ts
@@ -39,7 +39,7 @@ const ClickToPayContext = createContext<IClickToPayContext>({
     configuration: null,
     isStandaloneComponent: null,
     isCtpPrimaryPaymentMethod: null,
-    isStoringCookies: null,
+    isStoringCookies: false,
     setIsCtpPrimaryPaymentMethod: null,
     logoutShopper: null,
     updateStoreCookiesConsent: null,
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index b8b8f18388..28aaea7026 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -188,7 +188,7 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'shopper@email.com',
+                    shopperEmail: 'shopper@adyen.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From 28a7e9f460e1a7aad5fbe8f715407d9b9f55f4a0 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Tue, 14 Nov 2023 10:26:44 +0100
Subject: [PATCH 11/15] fix: margins

---
 .../lib/src/components/internal/OpenInvoice/OpenInvoice.scss  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/lib/src/components/internal/OpenInvoice/OpenInvoice.scss b/packages/lib/src/components/internal/OpenInvoice/OpenInvoice.scss
index 0d4bc2eda6..80a89bd5b5 100644
--- a/packages/lib/src/components/internal/OpenInvoice/OpenInvoice.scss
+++ b/packages/lib/src/components/internal/OpenInvoice/OpenInvoice.scss
@@ -1,7 +1,7 @@
 @import "../../../style/index";
 
 .adyen-checkout__open-invoice .adyen-checkout__fieldset--billingAddress {
-    padding-bottom: 8px;
+    margin-bottom: 16px;
 }
 
 .adyen-checkout__open-invoice .adyen-checkout__fieldset--deliveryAddress {
@@ -14,7 +14,7 @@
 }
 
 .adyen-checkout__open-invoice .adyen-checkout__field--consentCheckbox {
-    margin-top: 22px;
+    margin-top: 16px;
 }
 
 .adyen-checkout__input--separateDeliveryAddress + .adyen-checkout__checkbox__label {

From 2daf0c7c90bf366ab38df836cf52037cd865a38f Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Wed, 15 Nov 2023 14:29:14 +0100
Subject: [PATCH 12/15] feat: translations

---
 packages/lib/src/language/locales/ar.json    | 4 +++-
 packages/lib/src/language/locales/cs-CZ.json | 4 +++-
 packages/lib/src/language/locales/da-DK.json | 4 +++-
 packages/lib/src/language/locales/de-DE.json | 4 +++-
 packages/lib/src/language/locales/el-GR.json | 4 +++-
 packages/lib/src/language/locales/en-US.json | 6 ++----
 packages/lib/src/language/locales/es-ES.json | 4 +++-
 packages/lib/src/language/locales/fi-FI.json | 4 +++-
 packages/lib/src/language/locales/fr-FR.json | 4 +++-
 packages/lib/src/language/locales/hr-HR.json | 4 +++-
 packages/lib/src/language/locales/hu-HU.json | 4 +++-
 packages/lib/src/language/locales/it-IT.json | 4 +++-
 packages/lib/src/language/locales/ja-JP.json | 4 +++-
 packages/lib/src/language/locales/ko-KR.json | 4 +++-
 packages/lib/src/language/locales/nl-NL.json | 4 +++-
 packages/lib/src/language/locales/no-NO.json | 4 +++-
 packages/lib/src/language/locales/pl-PL.json | 4 +++-
 packages/lib/src/language/locales/pt-BR.json | 4 +++-
 packages/lib/src/language/locales/pt-PT.json | 4 +++-
 packages/lib/src/language/locales/ro-RO.json | 4 +++-
 packages/lib/src/language/locales/ru-RU.json | 4 +++-
 packages/lib/src/language/locales/sk-SK.json | 4 +++-
 packages/lib/src/language/locales/sl-SI.json | 4 +++-
 packages/lib/src/language/locales/sv-SE.json | 5 ++++-
 packages/lib/src/language/locales/zh-CN.json | 4 +++-
 packages/lib/src/language/locales/zh-TW.json | 4 +++-
 26 files changed, 78 insertions(+), 29 deletions(-)

diff --git a/packages/lib/src/language/locales/ar.json b/packages/lib/src/language/locales/ar.json
index 72fea6b65d..56286473c5 100644
--- a/packages/lib/src/language/locales/ar.json
+++ b/packages/lib/src/language/locales/ar.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "رمز الأمان (اختياري)",
     "issuerList.wallet.placeholder": "حدد محفظتك",
     "privacyPolicy": "سياسة الخصوصية",
-    "afterPay.agreement": "أوافق على %@ لشركة AfterPay",
+    "afterPay.agreement": "أوافق على ٪ @ لشركة Riverty",
     "paymentConditions": "شروط الدفع",
     "openApp": "فتح التطبيق",
     "voucher.readInstructions": "قراءة التعليمات",
@@ -258,6 +258,8 @@
     "ctp.otp.codeResent": "تم إرسال الرمز",
     "ctp.otp.title": "تمتع بالوصول إلى بطاقات Click to Pay الخاصة بك",
     "ctp.otp.subtitle": "أدخل الرمز %@ الذي أرسلناه إلى ٪@ للتحقق من هويتك.",
+    "ctp.otp.saveCookiesCheckbox.label": "تخطي التحقق في المرة القادمة",
+    "ctp.otp.saveCookiesCheckbox.information": "حدد حفظ البيانات على جهازك ومتصفحك في المتاجر المشاركة لإتمام عملية الدفع بشكل أسرع. لا يوصى به للأجهزة المشتركة.",
     "ctp.emptyProfile.message": "لا توجد بطاقات مسجلة في هذا الملف التعريفي على Click to Pay",
     "ctp.separatorText": "أو استخدم",
     "ctp.cards.title": "أكمل الدفع باستخدام بطاقة Click to Pay",
diff --git a/packages/lib/src/language/locales/cs-CZ.json b/packages/lib/src/language/locales/cs-CZ.json
index a5778452da..81ba67bbff 100644
--- a/packages/lib/src/language/locales/cs-CZ.json
+++ b/packages/lib/src/language/locales/cs-CZ.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Bezpečnostní kód (volitelný)",
     "issuerList.wallet.placeholder": "Vyberte svou peněženku",
     "privacyPolicy": "Zásady ochrany osobních údajů",
-    "afterPay.agreement": "Souhlasím s %@ společnosti AfterPay",
+    "afterPay.agreement": "Souhlasím s %@ of Riverty",
     "paymentConditions": "platebními podmínkami",
     "openApp": "Otevřete aplikaci",
     "voucher.readInstructions": "Přečtěte si pokyny",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Kód odeslán",
     "ctp.otp.title": "Získejte přístup ke svým kartám Click to Pay",
     "ctp.otp.subtitle": "Zadejte kód %@, který jsme vám odeslali na %@ a ověřte sami sebe.",
+    "ctp.otp.saveCookiesCheckbox.label": "Příště přeskočte ověřování",
+    "ctp.otp.saveCookiesCheckbox.information": "Zvolte, že si je chcete zapamatovat ve svém zařízení a prohlížeči v zúčastněných obchodech, abyste se rychleji odhlásili. Nedoporučuje se pro sdílená zařízení.",
     "ctp.emptyProfile.message": "V tomto profilu Click to Pay nejsou zaregistrovány žádné karty",
     "ctp.separatorText": "nebo použijte",
     "ctp.cards.title": "Dokončete platbu pomocí Click to Pay",
diff --git a/packages/lib/src/language/locales/da-DK.json b/packages/lib/src/language/locales/da-DK.json
index a88d9a6e3b..b24f6e6c17 100644
--- a/packages/lib/src/language/locales/da-DK.json
+++ b/packages/lib/src/language/locales/da-DK.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Sikkerhedskode (valgfrit)",
     "issuerList.wallet.placeholder": "Vælg tegnebog",
     "privacyPolicy": "Politik om privatlivets fred",
-    "afterPay.agreement": "Jeg accepterer AfterPays %@",
+    "afterPay.agreement": "Jeg accepterer %@ fra Riverty",
     "paymentConditions": "betalingsbetingelser",
     "openApp": "Åbn appen",
     "voucher.readInstructions": "Læs anvisningerne",
@@ -258,6 +258,8 @@
     "ctp.otp.codeResent": "Kode er sendt igen",
     "ctp.otp.title": "Få adgang til dine Click to Pay-kort",
     "ctp.otp.subtitle": "Indtast den kode, vi har sendt til %@ for at bekræfte, at det er dig.",
+    "ctp.otp.saveCookiesCheckbox.label": "Spring bekræftelse over næste gang",
+    "ctp.otp.saveCookiesCheckbox.information": "Vælg dette for at blive husket på din enhed og browser i deltagende butikker for hurtigere betaling. Anbefales ikke på delte enheder.",
     "ctp.emptyProfile.message": "Ingen kort registreret i denne Click to Pay-profil",
     "ctp.separatorText": "eller brug",
     "ctp.cards.title": "Gennemfør betaling med Click to Pay",
diff --git a/packages/lib/src/language/locales/de-DE.json b/packages/lib/src/language/locales/de-DE.json
index e68b50987b..52249167f9 100644
--- a/packages/lib/src/language/locales/de-DE.json
+++ b/packages/lib/src/language/locales/de-DE.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Sicherheitscode (optional)",
     "issuerList.wallet.placeholder": "Virtuelle Brieftasche auswählen",
     "privacyPolicy": "Datenschutz",
-    "afterPay.agreement": "Ich bin mit den %@ von AfterPay einverstanden",
+    "afterPay.agreement": "Ich stimme den %@ von Riverty zu",
     "paymentConditions": "Zahlungsbedingungen",
     "openApp": "App öffnen",
     "voucher.readInstructions": "Anweisungen lesen",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Code erneut gesendet",
     "ctp.otp.title": "Zugriff auf Ihre Click-to-Pay-Karten",
     "ctp.otp.subtitle": "Geben Sie den Code ein, der von %@ an %@ gesendet wurde, um Ihre Identität zu bestätigen.",
+    "ctp.otp.saveCookiesCheckbox.label": "Verifizierung beim nächsten Mal überspringen",
+    "ctp.otp.saveCookiesCheckbox.information": "Wählen Sie diese Option, um bei teilnehmenden Geschäften auf Ihrem Gerät und Browser gespeichert zu werden, um den Bestellvorgang zu beschleunigen. Nicht für gemeinsam genutzte Geräte empfohlen.",
     "ctp.emptyProfile.message": "In diesem Click-to-Pay-Profil sind keine Karten registriert",
     "ctp.separatorText": "oder verwenden",
     "ctp.cards.title": "Zahlung mit Click to Pay abschließen",
diff --git a/packages/lib/src/language/locales/el-GR.json b/packages/lib/src/language/locales/el-GR.json
index 961326f90c..66cae5d4ea 100644
--- a/packages/lib/src/language/locales/el-GR.json
+++ b/packages/lib/src/language/locales/el-GR.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Κωδικός ασφαλείας (προαιρετικό)",
     "issuerList.wallet.placeholder": "Επιλέξτε το πορτοφόλι σας",
     "privacyPolicy": "Πολιτική απορρήτου",
-    "afterPay.agreement": "Αποδέχομαι τους %@ του AfterPay",
+    "afterPay.agreement": "Αποδέχομαι τους %@ του Riverty",
     "paymentConditions": "όρους πληρωμής",
     "openApp": "Άνοιγμα της εφαρμογής",
     "voucher.readInstructions": "Διαβάστε τις οδηγίες",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Ο κωδικός στάλθηκε εκ νέου",
     "ctp.otp.title": "Πρόσβαση στις κάρτες Click to Pay σας",
     "ctp.otp.subtitle": "Εισαγάγετε τον κωδικό %@ που στάλθηκε στο %@ για να επαληθεύσετε ότι είστε εσείς.",
+    "ctp.otp.saveCookiesCheckbox.label": "Παράβλεψη επαλήθευσης την επόμενη φορά",
+    "ctp.otp.saveCookiesCheckbox.information": "Επιλέξτε να απομνημονεύεται στη συσκευή και στο πρόγραμμα περιήγησής σας στα συμμετέχοντα καταστήματα για ταχύτερη ολοκλήρωση της πληρωμής. Δεν συνιστάται για κοινόχρηστες συσκευές.",
     "ctp.emptyProfile.message": "Δεν υπάρχουν καταχωρισμένες κάρτες σε αυτό το προφίλ Click to Pay",
     "ctp.separatorText": "ή χρησιμοποιήστε το",
     "ctp.cards.title": "Ολοκληρώστε την πληρωμή με το Click to Pay",
diff --git a/packages/lib/src/language/locales/en-US.json b/packages/lib/src/language/locales/en-US.json
index b2b2a89ddf..e2b655c912 100644
--- a/packages/lib/src/language/locales/en-US.json
+++ b/packages/lib/src/language/locales/en-US.json
@@ -4,7 +4,6 @@
     "payButton.with": "Pay %{value} with %{maskedData}",
     "close": "Close",
     "storeDetails": "Save for my next payment",
-    "readMore": "Read more",
     "creditCard.holderName": "Name on card",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Enter name as shown on card",
@@ -90,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Security code (optional)",
     "issuerList.wallet.placeholder": "Select your wallet",
     "privacyPolicy": "Privacy policy",
-    "afterPay.agreement": "I agree with the %@ of AfterPay",
+    "afterPay.agreement": "I agree with the %@ of Riverty",
     "paymentConditions": "payment conditions",
     "openApp": "Open the app",
     "voucher.readInstructions": "Read instructions",
@@ -262,7 +261,6 @@
     "ctp.otp.subtitle": "Enter the code %@ sent to %@ to verify it‘s you.",
     "ctp.otp.saveCookiesCheckbox.label": "Skip verification next time",
     "ctp.otp.saveCookiesCheckbox.information": "Select to be remembered on your device and browser at participating stores for faster checkout. Not recommended for shared devices.",
-    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Select to be remembered on your device and browser",
     "ctp.emptyProfile.message": "No cards registered in this Click to Pay profile",
     "ctp.separatorText": "or use",
     "ctp.cards.title": "Complete payment with Click to Pay",
@@ -303,4 +301,4 @@
     "ancv.confirmPayment": "Use your ANCV application to confirm the payment.",
     "ancv.form.instruction": "The Cheque-Vacances application is necessary to validate this payment.",
     "ancv.beneficiaryId.invalid": "Enter a valid email address or ANCV ID"
-}
+}
\ No newline at end of file
diff --git a/packages/lib/src/language/locales/es-ES.json b/packages/lib/src/language/locales/es-ES.json
index ef51c5b4b2..1f2dcd2f11 100644
--- a/packages/lib/src/language/locales/es-ES.json
+++ b/packages/lib/src/language/locales/es-ES.json
@@ -87,7 +87,7 @@
     "creditCard.cvcField.title.optional": "Código de seguridad (opcional)",
     "issuerList.wallet.placeholder": "Seleccione su monedero electrónico",
     "privacyPolicy": "Política de privacidad",
-    "afterPay.agreement": "Sí, acepto las %@ de AfterPay",
+    "afterPay.agreement": "Sí, acepto las %@ de Riverty",
     "paymentConditions": "condiciones de pago",
     "openApp": "Abrir la aplicación",
     "voucher.readInstructions": "Leer instrucciones",
@@ -252,6 +252,8 @@
     "ctp.otp.codeResent": "Código reenviado",
     "ctp.otp.title": "Acceda a sus tarjetas Click to Pay",
     "ctp.otp.subtitle": "Introduzca el código %@ que le hemos enviado a %@ para verificar que es usted.",
+    "ctp.otp.saveCookiesCheckbox.label": "Omitir verificación la próxima vez",
+    "ctp.otp.saveCookiesCheckbox.information": "Seleccione esta opción para recordarle en su dispositivo y navegador en las tiendas participantes para agilizar el proceso de pago. No lo recomendamos para dispositivos compartidos.",
     "ctp.emptyProfile.message": "No hay tarjetas registradas en este perfil de Click to Pay",
     "ctp.separatorText": "o utilice",
     "ctp.cards.title": "Completar el pago con Click to Pay",
diff --git a/packages/lib/src/language/locales/fi-FI.json b/packages/lib/src/language/locales/fi-FI.json
index c6878df82a..1a4c602c15 100644
--- a/packages/lib/src/language/locales/fi-FI.json
+++ b/packages/lib/src/language/locales/fi-FI.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Turvakoodi (valinnainen)",
     "issuerList.wallet.placeholder": "Valitse lompakkosi",
     "privacyPolicy": "Tietosuojamenettely",
-    "afterPay.agreement": "Hyväksyn AfterPayn %@",
+    "afterPay.agreement": "Hyväksyn Rivertyn %@",
     "paymentConditions": "maksuehdot",
     "openApp": "Avaa sovellus",
     "voucher.readInstructions": "Lue ohjeet",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Koodi lähetetty uudelleen",
     "ctp.otp.title": "Hanki pääsy Click to Pay -kortteihisi",
     "ctp.otp.subtitle": "Syötä koodi, jonka %@ lähetti osoitteeseen %@ vahvistaaksesi, että kyseessä olet sinä.",
+    "ctp.otp.saveCookiesCheckbox.label": "Ohita vahvistus seuraavalla kerralla",
+    "ctp.otp.saveCookiesCheckbox.information": "Valitse, että sinut muistetaan laitteellasi ja selaimessa osallistuvissa myymälöissä, jotta voit maksaa nopeammin. Ei suositella jaetuilla laitteilla.",
     "ctp.emptyProfile.message": "Tähän Click to Pay -profiiliin ei ole rekisteröity kortteja",
     "ctp.separatorText": "tai käytä",
     "ctp.cards.title": "Suorita maksu Click to Paylla",
diff --git a/packages/lib/src/language/locales/fr-FR.json b/packages/lib/src/language/locales/fr-FR.json
index 69e5597f12..b93cce364b 100644
--- a/packages/lib/src/language/locales/fr-FR.json
+++ b/packages/lib/src/language/locales/fr-FR.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Code de sécurité (facultatif)",
     "issuerList.wallet.placeholder": "Sélectionnez votre portefeuille",
     "privacyPolicy": "Politique de confidentialité",
-    "afterPay.agreement": "J'accepte les %@ de AfterPay",
+    "afterPay.agreement": "J'accepte les %@ de Riverty",
     "paymentConditions": "conditions de paiement",
     "openApp": "Ouvrir l'application",
     "voucher.readInstructions": "Lire les instructions",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Code renvoyé",
     "ctp.otp.title": "Accédez à vos cartes Click to Pay",
     "ctp.otp.subtitle": "Saisissez le code %@ envoyé à %@ pour vérifier votre identité.",
+    "ctp.otp.saveCookiesCheckbox.label": "Ignorer la vérification la prochaine fois",
+    "ctp.otp.saveCookiesCheckbox.information": "Sélectionnez cette option pour mémoriser les informations sur votre appareil et votre navigateur afin d'accélérer le paiement dans les magasins participants. Non recommandé pour les appareils partagés.",
     "ctp.emptyProfile.message": "Aucune carte enregistrée dans ce profil Click to Pay",
     "ctp.separatorText": "ou utilisez",
     "ctp.cards.title": "Terminez le paiement avec Click to Pay",
diff --git a/packages/lib/src/language/locales/hr-HR.json b/packages/lib/src/language/locales/hr-HR.json
index 236684a7cc..e0ac43f501 100644
--- a/packages/lib/src/language/locales/hr-HR.json
+++ b/packages/lib/src/language/locales/hr-HR.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Sigurnosni kôd (neobvezno)",
     "issuerList.wallet.placeholder": "Odaberite svoju novčanik",
     "privacyPolicy": "Politika privatnosti",
-    "afterPay.agreement": "Slažem se s %@ usluge AfterPay",
+    "afterPay.agreement": "Slažem se s %@ Rivertyja",
     "paymentConditions": "uvjetima plaćanja",
     "openApp": "Otvorite aplikaciju",
     "voucher.readInstructions": "Pročitajte upute",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Kôd je ponovno poslan",
     "ctp.otp.title": "Pristupite svojim karticama za uslugu Click to Pay",
     "ctp.otp.subtitle": "Upišite kôd %@ koji smo poslali na %@ da bismo potvrdili da ste to vi.",
+    "ctp.otp.saveCookiesCheckbox.label": "Sljedeći puta preskoči provjeru",
+    "ctp.otp.saveCookiesCheckbox.information": "Odaberite kako biste bili zapamćeni na svom uređaju i pregledniku u uključenim trgovinama za bržu naplatu. Ne preporučuje se za zajedničke uređaje.",
     "ctp.emptyProfile.message": "Nema kartica registriranih u sklopu ovog profila usluge Click to Pay",
     "ctp.separatorText": "ili upotrijebite",
     "ctp.cards.title": "Dovrši plaćanje uslugom Click to Pay",
diff --git a/packages/lib/src/language/locales/hu-HU.json b/packages/lib/src/language/locales/hu-HU.json
index bc15747468..1a32d70d1e 100644
--- a/packages/lib/src/language/locales/hu-HU.json
+++ b/packages/lib/src/language/locales/hu-HU.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Biztonsági kód (nem kötelező)",
     "issuerList.wallet.placeholder": "Pénztárca kiválasztása",
     "privacyPolicy": "Adatvédelmi szabályzat",
-    "afterPay.agreement": "Elfogadom az AfterPay %@",
+    "afterPay.agreement": "Elfogadom a következőt: Riverty %@",
     "paymentConditions": "fizetési feltételeit",
     "openApp": "Alkalmazás megnyitása",
     "voucher.readInstructions": "Olvassa el az utasításokat",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Kód újraküldve",
     "ctp.otp.title": "Hozzáférés a Click to Pay-kártyáihoz",
     "ctp.otp.subtitle": "Írja be a kódot, amit a(z) %@ küldött %@ részére ellenőrzés céljából.",
+    "ctp.otp.saveCookiesCheckbox.label": "Ellenőrzés kihagyása a következő alkalommal",
+    "ctp.otp.saveCookiesCheckbox.information": "Jelölje be, hogy a résztvevő üzletek a gyorsabb fizetés érdekében emlékezzenek az eszközre és a böngészőre. Megosztott eszközök esetén nem ajánlott.",
     "ctp.emptyProfile.message": "Ebben a Click to Pay-profilban nincs regisztrált kártya",
     "ctp.separatorText": "vagy használja a következőt",
     "ctp.cards.title": "Fizetés Click to Pay használatával",
diff --git a/packages/lib/src/language/locales/it-IT.json b/packages/lib/src/language/locales/it-IT.json
index ad8e7788c3..6c605de00e 100644
--- a/packages/lib/src/language/locales/it-IT.json
+++ b/packages/lib/src/language/locales/it-IT.json
@@ -87,7 +87,7 @@
     "creditCard.cvcField.title.optional": "Codice di sicurezza (facoltativo)",
     "issuerList.wallet.placeholder": "Seleziona il tuo portafoglio",
     "privacyPolicy": "Informativa sulla privacy",
-    "afterPay.agreement": "Accetto i %@ di AfterPay",
+    "afterPay.agreement": "Accetto i %@ di Riverty",
     "paymentConditions": "termini di pagamento",
     "openApp": "Apri l'app",
     "voucher.readInstructions": "Leggi le istruzioni",
@@ -255,6 +255,8 @@
     "ctp.otp.codeResent": "Codice inviato",
     "ctp.otp.title": "Accedi alle tue carte Click to Pay",
     "ctp.otp.subtitle": "Inserisci il codice che %@ ha inviato a %@ per verificare la tua identità.",
+    "ctp.otp.saveCookiesCheckbox.label": "Salta la verifica la prossima volta",
+    "ctp.otp.saveCookiesCheckbox.information": "Scegli di essere ricordato sul dispositivo e il browser che utilizzi per velocizzare il pagamento nei negozi partecipanti. Non consigliato per dispositivi condivisi.",
     "ctp.emptyProfile.message": "Non esistono carte registrate in questo profilo Click to Pay",
     "ctp.separatorText": "o utilizza",
     "ctp.cards.title": "Completa il pagamento con Click to Pay",
diff --git a/packages/lib/src/language/locales/ja-JP.json b/packages/lib/src/language/locales/ja-JP.json
index da9975bc1b..df0f9dd89e 100644
--- a/packages/lib/src/language/locales/ja-JP.json
+++ b/packages/lib/src/language/locales/ja-JP.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "セキュリティコード（任意）",
     "issuerList.wallet.placeholder": "ウォレットを選択してください",
     "privacyPolicy": "プライバシーポリシー",
-    "afterPay.agreement": "AfterPayの%@で同意",
+    "afterPay.agreement": "Rivertyの%@で同意",
     "paymentConditions": "支払条件",
     "openApp": "アプリを開く",
     "voucher.readInstructions": "手順を参照してください",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "コードが再送信されました",
     "ctp.otp.title": "Click to Payカードにアクセスする",
     "ctp.otp.subtitle": "%@から%@に送信されたコードを入力して、ご本人であることを確認してください。",
+    "ctp.otp.saveCookiesCheckbox.label": "次回は検証をスキップする",
+    "ctp.otp.saveCookiesCheckbox.information": "対象店舗で、お使いのデバイスとブラウザで記憶させるように選択すると、より迅速なチェックアウトが可能になります。共有デバイスでは推奨されません。",
     "ctp.emptyProfile.message": "このClick to Payプロフィールに登録されているカードはありません。",
     "ctp.separatorText": "または以下を使用",
     "ctp.cards.title": "Click to Payで支払いを完了する",
diff --git a/packages/lib/src/language/locales/ko-KR.json b/packages/lib/src/language/locales/ko-KR.json
index 1d50e40384..20de9be36b 100644
--- a/packages/lib/src/language/locales/ko-KR.json
+++ b/packages/lib/src/language/locales/ko-KR.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "보안 코드(선택 사항)",
     "issuerList.wallet.placeholder": "전자 지갑 선택",
     "privacyPolicy": "개인정보 보호정책",
-    "afterPay.agreement": "AfterPay의 %@에 동의합니다.",
+    "afterPay.agreement": "Riverty의 %@에 동의합니다.",
     "paymentConditions": "결제 조건",
     "openApp": "앱 열기",
     "voucher.readInstructions": "안내 읽기",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "코드 재전송됨",
     "ctp.otp.title": "Click to Pay 카드에 접근",
     "ctp.otp.subtitle": "%@로 전송된 %@ 코드를 입력하여 본인 인증을 진행합니다.",
+    "ctp.otp.saveCookiesCheckbox.label": "다음 번에는 인증 건너뛰기",
+    "ctp.otp.saveCookiesCheckbox.information": "더 빠른 결제를 위해 사용자 기기와 참여 매장의 브라우저에서 정보를 기억하도록 선택하세요. 공유 기기에는 권장하지 않습니다.",
     "ctp.emptyProfile.message": "해당 Click to Pay 프로필에 등록된 카드가 없습니다",
     "ctp.separatorText": "또는 사용",
     "ctp.cards.title": "Click to Pay로 결제 완료",
diff --git a/packages/lib/src/language/locales/nl-NL.json b/packages/lib/src/language/locales/nl-NL.json
index d5e173d94c..b739f72a6e 100644
--- a/packages/lib/src/language/locales/nl-NL.json
+++ b/packages/lib/src/language/locales/nl-NL.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Beveiligingscode (optioneel)",
     "issuerList.wallet.placeholder": "Selecteer uw portemonnee",
     "privacyPolicy": "Privacybeleid",
-    "afterPay.agreement": "Ik ga akkoord met de %@ van AfterPay",
+    "afterPay.agreement": "Ik ga akkoord met de %@ van Riverty",
     "paymentConditions": "betalingsvoorwaarden",
     "openApp": "Open de app",
     "voucher.readInstructions": "Instructies lezen",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Code opnieuw verzonden",
     "ctp.otp.title": "Ga naar uw Click to Pay-kaarten",
     "ctp.otp.subtitle": "Voer de code %@ in die naar %@ is gestuurd, zodat we kunnen verifiëren dat u het bent.",
+    "ctp.otp.saveCookiesCheckbox.label": "Verificatie de volgende keer overslaan",
+    "ctp.otp.saveCookiesCheckbox.information": "Selecteer om te worden onthouden op uw apparaat en in uw browser bij deelnemende winkels, zodat u sneller kunt afrekenen. Niet aanbevolen voor gedeelde apparaten.",
     "ctp.emptyProfile.message": "Geen kaarten geregistreerd voor dit Click to Pay-profiel",
     "ctp.separatorText": "of gebruik",
     "ctp.cards.title": "Voltooi de betaling met Click to Pay",
diff --git a/packages/lib/src/language/locales/no-NO.json b/packages/lib/src/language/locales/no-NO.json
index 9e01eb4664..64b5b2b970 100644
--- a/packages/lib/src/language/locales/no-NO.json
+++ b/packages/lib/src/language/locales/no-NO.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Sikkerhetskode (valgfritt)",
     "issuerList.wallet.placeholder": "Velg lommebok",
     "privacyPolicy": "Retningslinjer for personvern",
-    "afterPay.agreement": "Jeg godtar AfterPays %@",
+    "afterPay.agreement": "Jeg godtar Rivertys %@",
     "paymentConditions": "betalingsbetingelser",
     "openApp": "Åpne appen",
     "voucher.readInstructions": "Les instruksjoner",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Kode er sendt på nytt",
     "ctp.otp.title": "Få tilgang til Click to Pay-kortene dine",
     "ctp.otp.subtitle": "Tast inn koden vi sendte til %@, for å verifisere at det er deg.",
+    "ctp.otp.saveCookiesCheckbox.label": "Hopp over verifisering neste gang",
+    "ctp.otp.saveCookiesCheckbox.information": "Velg for å bli husket på enheten og i nettleseren din i deltakende butikker for raskere betaling. Anbefales ikke for delte enheter.",
     "ctp.emptyProfile.message": "Ingen kort er registrert i denne Click to Pay-profilen",
     "ctp.separatorText": "eller bruk",
     "ctp.cards.title": "Fullfør betalingen med Click to Pay",
diff --git a/packages/lib/src/language/locales/pl-PL.json b/packages/lib/src/language/locales/pl-PL.json
index d2a40bde86..d32d1ead3b 100644
--- a/packages/lib/src/language/locales/pl-PL.json
+++ b/packages/lib/src/language/locales/pl-PL.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Kod zabezpieczający (opcjonalnie)",
     "issuerList.wallet.placeholder": "Wybierz swój portfel",
     "privacyPolicy": "Polityka prywatności.",
-    "afterPay.agreement": "Zgadzam się z dokumentem %@ AfterPay",
+    "afterPay.agreement": "Zgadzam się z %@ Riverty",
     "paymentConditions": "warunki płatności",
     "openApp": "Otwórz aplikację",
     "voucher.readInstructions": "Przeczytaj instrukcje",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Wysłano kod ponownie",
     "ctp.otp.title": "Przejdź do kart Click to Pay",
     "ctp.otp.subtitle": "Wprowadź kod %@ wysłany na adres %@, aby potwierdzić swoją tożsamość.",
+    "ctp.otp.saveCookiesCheckbox.label": "Następnym razem pomiń weryfikację",
+    "ctp.otp.saveCookiesCheckbox.information": "Wybierz opcję zapamiętywania na urządzeniu i w przeglądarce w sklepach uczestniczących w programie, aby przyspieszyć realizację transakcji. Niezalecane dla współużytkowanych urządzeń.",
     "ctp.emptyProfile.message": "W tym profilu Click to Pay nie zarejestrowano żadnych kart",
     "ctp.separatorText": "lub przypadków jej użycia",
     "ctp.cards.title": "Dokończ płatność za pomocą funkcji Click to Pay",
diff --git a/packages/lib/src/language/locales/pt-BR.json b/packages/lib/src/language/locales/pt-BR.json
index 374efa72d5..44ef4530ae 100644
--- a/packages/lib/src/language/locales/pt-BR.json
+++ b/packages/lib/src/language/locales/pt-BR.json
@@ -87,7 +87,7 @@
     "creditCard.cvcField.title.optional": "Código de segurança (opcional)",
     "issuerList.wallet.placeholder": "Selecione uma carteira",
     "privacyPolicy": "Política de Privacidade",
-    "afterPay.agreement": "Eu concordo com as %@ do AfterPay",
+    "afterPay.agreement": "Concordo com o %@ da Riverty",
     "paymentConditions": "condições de pagamento",
     "openApp": "Abrir o aplicativo",
     "voucher.readInstructions": "Leia as instruções",
@@ -255,6 +255,8 @@
     "ctp.otp.codeResent": "Código reenviado",
     "ctp.otp.title": "Acesse seus cartões Click to Pay",
     "ctp.otp.subtitle": "Digite o código %@ enviado para %@ para confirmar que é você.",
+    "ctp.otp.saveCookiesCheckbox.label": "Ignorar verificação da próxima vez",
+    "ctp.otp.saveCookiesCheckbox.information": "Selecione esta opção para ser lembrado no seu dispositivo e navegador, agilizando o pagamento nas lojas participantes. Não recomendado para dispositivos compartilhados.",
     "ctp.emptyProfile.message": "Não há nenhum cartão cadastrado neste perfil do Click to Pay",
     "ctp.separatorText": "ou use",
     "ctp.cards.title": "Concluir o pagamento com o Click to Pay",
diff --git a/packages/lib/src/language/locales/pt-PT.json b/packages/lib/src/language/locales/pt-PT.json
index 28ce725a0e..88f21a05e3 100644
--- a/packages/lib/src/language/locales/pt-PT.json
+++ b/packages/lib/src/language/locales/pt-PT.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Código de segurança (opcional)",
     "issuerList.wallet.placeholder": "Selecione a sua carteira",
     "privacyPolicy": "Política de Privacidade",
-    "afterPay.agreement": "Concordo com o %@ do AfterPay",
+    "afterPay.agreement": "Concordo com o %@ da Riverty",
     "paymentConditions": "condições de pagamento",
     "openApp": "Abra a aplicação",
     "voucher.readInstructions": "Ler instruções",
@@ -259,6 +259,8 @@
     "ctp.otp.codeResent": "Código reenviado",
     "ctp.otp.title": "Aceda aos seus cartões Click to Pay",
     "ctp.otp.subtitle": "Introduza o código %@ enviado para %@ para verificar se é você.",
+    "ctp.otp.saveCookiesCheckbox.label": "Saltar verificação da próxima vez",
+    "ctp.otp.saveCookiesCheckbox.information": "Selecione para ser memorizado no seu dispositivo e navegador nas lojas participantes, para uma finalização de compra mais rápida. Não recomendado para dispositivos partilhados.",
     "ctp.emptyProfile.message": "Nenhum cartão registado neste perfil Click to Pay",
     "ctp.separatorText": "ou utilize",
     "ctp.cards.title": "Pagamento completo com Click to Pay",
diff --git a/packages/lib/src/language/locales/ro-RO.json b/packages/lib/src/language/locales/ro-RO.json
index 0da5529a8d..918b1b423c 100644
--- a/packages/lib/src/language/locales/ro-RO.json
+++ b/packages/lib/src/language/locales/ro-RO.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Cod de securitate (opțional)",
     "issuerList.wallet.placeholder": "Selectați-vă portofelul",
     "privacyPolicy": "Politica de confidențialitate",
-    "afterPay.agreement": "Sunt de acord cu %@ aparținând AfterPay",
+    "afterPay.agreement": "Sunt de acord cu %@ aparținând Riverty",
     "paymentConditions": "condiții de plată",
     "openApp": "Deschideți aplicația",
     "voucher.readInstructions": "Citiți instrucțiunile",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Cod retrimis",
     "ctp.otp.title": "Accesați-vă cardurile Click to Pay",
     "ctp.otp.subtitle": "Introduceți codul %@ pe care l-am trimis la %@ pentru a confirma că sunteți dvs.",
+    "ctp.otp.saveCookiesCheckbox.label": "Omiteți verificarea data viitoare",
+    "ctp.otp.saveCookiesCheckbox.information": "Selectați pentru a fi reținut pe dispozitiv și în browserul dvs. la magazinele participante pentru o plată mai rapidă. Nerecomandat pentru dispozitivele partajate.",
     "ctp.emptyProfile.message": "Niciun card înregistrat în acest profil Click to Pay",
     "ctp.separatorText": "sau folosiți",
     "ctp.cards.title": "Finalizați plata cu Click to Pay",
diff --git a/packages/lib/src/language/locales/ru-RU.json b/packages/lib/src/language/locales/ru-RU.json
index cee3938988..d3153a02d8 100644
--- a/packages/lib/src/language/locales/ru-RU.json
+++ b/packages/lib/src/language/locales/ru-RU.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Защитный код (необязательно)",
     "issuerList.wallet.placeholder": "Выберите кошелек",
     "privacyPolicy": "Политика конфиденциальности",
-    "afterPay.agreement": "Я принимаю %@ AfterPay",
+    "afterPay.agreement": "Я принимаю %@ Riverty",
     "paymentConditions": "условия оплаты",
     "openApp": "Открыть приложение",
     "voucher.readInstructions": "Прочитайте инструкции",
@@ -254,6 +254,8 @@
     "ctp.otp.codeResent": "Код отправлен повторно",
     "ctp.otp.title": "Получите доступ к своим картам Click to Pay",
     "ctp.otp.subtitle": "Для подтверждения своей личности введите код %@, отправленный %@.",
+    "ctp.otp.saveCookiesCheckbox.label": "Пропустить подтверждение в следующий раз",
+    "ctp.otp.saveCookiesCheckbox.information": "Чтобы в соответствующих магазинах запомнили ваше устройство и браузер, выберите эту опцию. Это позволит быстрее оформлять заказы. Не рекомендуется на устройствах совместного использования.",
     "ctp.emptyProfile.message": "В данном профиле Click to Pay нет зарегистрированных карт",
     "ctp.separatorText": "или используйте",
     "ctp.cards.title": "Оформите оплату с помощью Click to Pay",
diff --git a/packages/lib/src/language/locales/sk-SK.json b/packages/lib/src/language/locales/sk-SK.json
index c1ee57d351..573beb0e7e 100644
--- a/packages/lib/src/language/locales/sk-SK.json
+++ b/packages/lib/src/language/locales/sk-SK.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Bezpečnostný kód (voliteľný)",
     "issuerList.wallet.placeholder": "Vyberte si peňaženku",
     "privacyPolicy": "Zásady ochrany osobných údajov",
-    "afterPay.agreement": "Súhlasím s %@ AfterPay",
+    "afterPay.agreement": "Súhlasím, že budem dodržiavať %@ spoločnosti Riverty",
     "paymentConditions": "podmienkami platby",
     "openApp": "Otvorte aplikáciu",
     "voucher.readInstructions": "Prečítajte si pokyny",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Kód bol znova odoslaný",
     "ctp.otp.title": "Získajte prístup k vašim kartám v službe Click to Pay",
     "ctp.otp.subtitle": "Zadajte kód %@, ktorý sme poslali na adresu %@, aby sme overili, že ste to vy.",
+    "ctp.otp.saveCookiesCheckbox.label": "Nabudúce preskočiť overovanie",
+    "ctp.otp.saveCookiesCheckbox.information": "Vyberte túto možnosť na zapamätanie v zariadení a prehliadači v zúčastnených obchodoch, čím urýchlite platbu. Neodporúča sa pre zdieľané zariadenia.",
     "ctp.emptyProfile.message": "V tomto profile Click to Pay nie sú registrované žiadne karty",
     "ctp.separatorText": "alebo použite",
     "ctp.cards.title": "Dokončite platbu v službe Click to Pay",
diff --git a/packages/lib/src/language/locales/sl-SI.json b/packages/lib/src/language/locales/sl-SI.json
index e56e4c44a1..bfd883eaef 100644
--- a/packages/lib/src/language/locales/sl-SI.json
+++ b/packages/lib/src/language/locales/sl-SI.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Varnostna koda (neobvezno)",
     "issuerList.wallet.placeholder": "Izberite svojo denarnico",
     "privacyPolicy": "Pravilnik o zasebnosti",
-    "afterPay.agreement": "Strinjam se s %@ ponudnika AfterPay",
+    "afterPay.agreement": "Strinjam se s %@ ponudnika Riverty",
     "paymentConditions": "plačilnimi pogoji",
     "openApp": "Odprite aplikacijo",
     "voucher.readInstructions": "Preberite navodila",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Koda je bila znova poslana",
     "ctp.otp.title": "Dostop do vaših kartic Click to Pay",
     "ctp.otp.subtitle": "Vnesite kodo %@, ki smo jo poslali na %@, da potrdite, da ste to res vi.",
+    "ctp.otp.saveCookiesCheckbox.label": "Naslednjič preskoči preverjanje",
+    "ctp.otp.saveCookiesCheckbox.information": "Izberite če želite, da se v vaši napravi in brskalniku v sodelujočih trgovinah vaši podatki shranijo za hitrejši zaključek zakupa. Ni priporočljivo za naprave v skupni rabi.",
     "ctp.emptyProfile.message": "V tem profilu Click to Pay ni registriranih nobenih kartic",
     "ctp.separatorText": "ali uporabite",
     "ctp.cards.title": "Dokončajte plačilo s storitvijo Click to Pay",
diff --git a/packages/lib/src/language/locales/sv-SE.json b/packages/lib/src/language/locales/sv-SE.json
index 561c34c6b9..3004465921 100644
--- a/packages/lib/src/language/locales/sv-SE.json
+++ b/packages/lib/src/language/locales/sv-SE.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "Säkerhetskod (valfritt)",
     "issuerList.wallet.placeholder": "Väj din plånbok",
     "privacyPolicy": "Sekretesspolicy",
-    "afterPay.agreement": "Jag godkänner AfterPays %@",
+    "afterPay.agreement": "Jag godkänner Rivertys %@",
     "paymentConditions": "betalvillkor",
     "openApp": "Öppna appen",
     "voucher.readInstructions": "Läs instruktionerna",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "Koden skickad igen",
     "ctp.otp.title": "Få tillgång till dina Click to Pay-kort",
     "ctp.otp.subtitle": "Ange koden som %@ skickade till %@ för att verifiera att det är du.",
+    "ctp.otp.saveCookiesCheckbox.label": "Hoppa över verifieringen nästa gång",
+    "ctp.otp.saveCookiesCheckbox.information": "Välj att bli ihågkommen på din enhet och webbläsare i deltagande butiker för snabbare utcheckning. Rekommenderas inte för delade enheter.",
     "ctp.emptyProfile.message": "Inga kort registrerade i denna Click to Pay-profil",
     "ctp.separatorText": "eller använd",
     "ctp.cards.title": "Slutför betalningen med Click to Pay",
@@ -290,6 +292,7 @@
     "companyDetails.registrationNumber.invalid": "Ange registreringsnumret",
     "consent.checkbox.invalid": "Du måste godkänna villkoren",
     "form.instruction": "Alla fält är obligatoriska om inte något annat anges.",
+    "trustly.descriptor": "Omedelbar bankbetalning",
     "ancv.input.label": "Din ANCV-identifiering",
     "ancv.confirmPayment": "Bekräfta betalningen i din ANCV-app.",
     "ancv.form.instruction": "Appen Cheque-Vacances krävs för att validera denna betalning.",
diff --git a/packages/lib/src/language/locales/zh-CN.json b/packages/lib/src/language/locales/zh-CN.json
index 6cbc91ee8a..5fe6f7a363 100644
--- a/packages/lib/src/language/locales/zh-CN.json
+++ b/packages/lib/src/language/locales/zh-CN.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "安全码（可选）",
     "issuerList.wallet.placeholder": "选择您的钱包",
     "privacyPolicy": "隐私政策",
-    "afterPay.agreement": "我同意 AfterPay 的 %@",
+    "afterPay.agreement": "我同意 Riverty 的 %@",
     "paymentConditions": "支付条件",
     "openApp": "打开应用",
     "voucher.readInstructions": "阅读说明",
@@ -256,6 +256,8 @@
     "ctp.otp.codeResent": "代码已重新发送",
     "ctp.otp.title": "访问您的 Click to Pay 卡",
     "ctp.otp.subtitle": "请输入我们发送至 %@ 的代码 (%@)，以验证是您本人。",
+    "ctp.otp.saveCookiesCheckbox.label": "下次跳过验证",
+    "ctp.otp.saveCookiesCheckbox.information": "在您的设备和浏览器上，在参与活动的店铺中选择记住该选项，以便更快地结账。不建议用于共享设备。",
     "ctp.emptyProfile.message": "此 Click to Pay 个人资料中尚未注册任何卡片",
     "ctp.separatorText": "或使用",
     "ctp.cards.title": "借助 Click to Pay 完成付款",
diff --git a/packages/lib/src/language/locales/zh-TW.json b/packages/lib/src/language/locales/zh-TW.json
index 5414e05d5f..2ea7e5ac01 100644
--- a/packages/lib/src/language/locales/zh-TW.json
+++ b/packages/lib/src/language/locales/zh-TW.json
@@ -89,7 +89,7 @@
     "creditCard.cvcField.title.optional": "安全碼（選填）",
     "issuerList.wallet.placeholder": "選取您的電子錢包",
     "privacyPolicy": "隱私權政策",
-    "afterPay.agreement": "我同意 AfterPay 的%@",
+    "afterPay.agreement": "我同意 Riverty 的%@",
     "paymentConditions": "付款細則",
     "openApp": "開啟應用程式",
     "voucher.readInstructions": "閱覽說明",
@@ -257,6 +257,8 @@
     "ctp.otp.codeResent": "已重新傳送驗證碼",
     "ctp.otp.title": "存取您的 Click to Pay 卡",
     "ctp.otp.subtitle": "請輸入我們傳送至 %@ 的驗證碼 %@，以驗證是您本人。",
+    "ctp.otp.saveCookiesCheckbox.label": "下次略過驗證",
+    "ctp.otp.saveCookiesCheckbox.information": "選擇在裝置和瀏覽器中記住參與商店的驗證資訊，以加快結帳速度。不建議在共享裝置上選取該設定。",
     "ctp.emptyProfile.message": "此 Click to Pay 個人資料中未註冊任何卡",
     "ctp.separatorText": "或使用",
     "ctp.cards.title": "使用 Click to Pay 完成付款",

From 4bc577d3d36ea0675fc6740551c6b4909ab6d4c1 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Wed, 22 Nov 2023 16:40:04 +0100
Subject: [PATCH 13/15] feat: truncating text feature back

---
 .../CtPSaveCookiesCheckbox.scss                 |  7 +++++++
 .../CtPSaveCookiesCheckbox.tsx                  | 17 ++++++++++++++---
 packages/lib/src/language/locales/ar.json       |  4 +++-
 packages/lib/src/language/locales/cs-CZ.json    |  2 ++
 packages/lib/src/language/locales/da-DK.json    |  2 ++
 packages/lib/src/language/locales/de-DE.json    |  2 ++
 packages/lib/src/language/locales/el-GR.json    |  2 ++
 packages/lib/src/language/locales/en-US.json    |  2 ++
 packages/lib/src/language/locales/es-ES.json    |  2 ++
 packages/lib/src/language/locales/fi-FI.json    |  2 ++
 packages/lib/src/language/locales/fr-FR.json    |  2 ++
 packages/lib/src/language/locales/hr-HR.json    |  2 ++
 packages/lib/src/language/locales/hu-HU.json    |  2 ++
 packages/lib/src/language/locales/it-IT.json    |  2 ++
 packages/lib/src/language/locales/ja-JP.json    |  2 ++
 packages/lib/src/language/locales/ko-KR.json    |  2 ++
 packages/lib/src/language/locales/nl-NL.json    |  2 ++
 packages/lib/src/language/locales/no-NO.json    |  2 ++
 packages/lib/src/language/locales/pl-PL.json    |  2 ++
 packages/lib/src/language/locales/pt-BR.json    |  2 ++
 packages/lib/src/language/locales/pt-PT.json    |  2 ++
 packages/lib/src/language/locales/ro-RO.json    |  2 ++
 packages/lib/src/language/locales/ru-RU.json    |  2 ++
 packages/lib/src/language/locales/sk-SK.json    |  2 ++
 packages/lib/src/language/locales/sl-SI.json    |  2 ++
 packages/lib/src/language/locales/sv-SE.json    |  2 ++
 packages/lib/src/language/locales/zh-CN.json    |  2 ++
 packages/lib/src/language/locales/zh-TW.json    |  2 ++
 packages/lib/src/utils/isScreenSmall.ts         |  3 +++
 packages/playground/src/pages/Cards/Cards.js    |  2 +-
 30 files changed, 78 insertions(+), 5 deletions(-)
 create mode 100644 packages/lib/src/utils/isScreenSmall.ts

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
index a697c6ed72..2f9c16e54e 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.scss
@@ -26,3 +26,10 @@
   font-weight: 400;
   margin: 4px 0 0;
 }
+
+.adyen-checkout-ctp__otp-readmore-button {
+  all: unset;
+  text-transform: lowercase;
+  cursor: pointer;
+  color: $color-blue;
+}
diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
index 54913dff98..7d5411e310 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPOneTimePassword/CtPSaveCookiesCheckbox/CtPSaveCookiesCheckbox.tsx
@@ -1,16 +1,18 @@
-import { h } from 'preact';
+import { h, Fragment } from 'preact';
 import classnames from 'classnames';
 import Field from '../../../../FormFields/Field';
 import Checkbox from '../../../../FormFields/Checkbox';
 import useCoreContext from '../../../../../../core/Context/useCoreContext';
 import { useState, useCallback } from 'preact/hooks';
 import useClickToPayContext from '../../../context/useClickToPayContext';
+import isScreenSmall from '../../../../../../utils/isScreenSmall';
 import './CtPSaveCookiesCheckbox.scss';
 
 function CtPSaveCookiesCheckbox() {
     const { i18n } = useCoreContext();
     const { updateStoreCookiesConsent, isStoringCookies } = useClickToPayContext();
     const [checked, setIsChecked] = useState(isStoringCookies);
+    const [isTextTruncated, setIsTextTruncated] = useState<boolean>(isScreenSmall());
 
     const handleOnChange = useCallback(() => {
         const newChecked = !checked;
@@ -34,8 +36,17 @@ function CtPSaveCookiesCheckbox() {
                 />
             </Field>
 
-            <p className="adyen-checkout-ctp__otp-checkbox-info" id="adyen-ctp-cookies-info">
-                {i18n.get('ctp.otp.saveCookiesCheckbox.information')}
+            <p className="adyen-checkout-ctp__otp-checkbox-info">
+                {isTextTruncated ? (
+                    <Fragment>
+                        <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.shorterInfo')} </span>
+                        <button className="adyen-checkout-ctp__otp-readmore-button" onClick={() => setIsTextTruncated(false)}>
+                            {i18n.get('readMore')}..
+                        </button>
+                    </Fragment>
+                ) : (
+                    <span id="adyen-ctp-cookies-info">{i18n.get('ctp.otp.saveCookiesCheckbox.information')}</span>
+                )}
             </p>
         </div>
     );
diff --git a/packages/lib/src/language/locales/ar.json b/packages/lib/src/language/locales/ar.json
index 56286473c5..ef07b1a958 100644
--- a/packages/lib/src/language/locales/ar.json
+++ b/packages/lib/src/language/locales/ar.json
@@ -4,6 +4,7 @@
     "payButton.with": "ادفع %{value} باستخدام %{maskedData}",
     "close": "إغلاق",
     "storeDetails": "حفظ لمدفوعاتي القادمة",
+    "readMore": "اقرأ المزيد",
     "creditCard.holderName": "الاسم على البطاقة",
     "creditCard.holderName.placeholder": "جميل سعيد",
     "creditCard.holderName.invalid": "أدخل الاسم كما هو موضح على البطاقة",
@@ -22,7 +23,7 @@
     "creditCard.cvcField.placeholder.3digits": "3 أرقام",
     "creditCard.taxNumber.placeholder": "يوم شهر سنة / 0123456789",
     "installments": "عدد الأقساط",
-    "installmentOption": "%{times} x %{partialValue}",
+    "installmentOption": "%{times} × %{partialValue}",
     "installmentOptionMonths": "%{times} أشهر",
     "installments.oneTime": "الدفع مرة واحدة",
     "installments.installments": "الدفع على أقساط",
@@ -260,6 +261,7 @@
     "ctp.otp.subtitle": "أدخل الرمز %@ الذي أرسلناه إلى ٪@ للتحقق من هويتك.",
     "ctp.otp.saveCookiesCheckbox.label": "تخطي التحقق في المرة القادمة",
     "ctp.otp.saveCookiesCheckbox.information": "حدد حفظ البيانات على جهازك ومتصفحك في المتاجر المشاركة لإتمام عملية الدفع بشكل أسرع. لا يوصى به للأجهزة المشتركة.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "حدد تذكرني على جهازك ومتصفحك.",
     "ctp.emptyProfile.message": "لا توجد بطاقات مسجلة في هذا الملف التعريفي على Click to Pay",
     "ctp.separatorText": "أو استخدم",
     "ctp.cards.title": "أكمل الدفع باستخدام بطاقة Click to Pay",
diff --git a/packages/lib/src/language/locales/cs-CZ.json b/packages/lib/src/language/locales/cs-CZ.json
index 81ba67bbff..be47a8ff9f 100644
--- a/packages/lib/src/language/locales/cs-CZ.json
+++ b/packages/lib/src/language/locales/cs-CZ.json
@@ -4,6 +4,7 @@
     "payButton.with": "Zaplatit %{value} pomocí %{maskedData}",
     "close": "Zavřít",
     "storeDetails": "Uložit pro příští platby",
+    "readMore": "Přečtěte si více",
     "creditCard.holderName": "Jméno na kartě",
     "creditCard.holderName.placeholder": "Jan Novák",
     "creditCard.holderName.invalid": "Zadejte jméno, jak je uvedeno na kartě",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Zadejte kód %@, který jsme vám odeslali na %@ a ověřte sami sebe.",
     "ctp.otp.saveCookiesCheckbox.label": "Příště přeskočte ověřování",
     "ctp.otp.saveCookiesCheckbox.information": "Zvolte, že si je chcete zapamatovat ve svém zařízení a prohlížeči v zúčastněných obchodech, abyste se rychleji odhlásili. Nedoporučuje se pro sdílená zařízení.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Vyberte, abyste si je zapamatovali ve svém zařízení a prohlížeči",
     "ctp.emptyProfile.message": "V tomto profilu Click to Pay nejsou zaregistrovány žádné karty",
     "ctp.separatorText": "nebo použijte",
     "ctp.cards.title": "Dokončete platbu pomocí Click to Pay",
diff --git a/packages/lib/src/language/locales/da-DK.json b/packages/lib/src/language/locales/da-DK.json
index b24f6e6c17..821a240cfc 100644
--- a/packages/lib/src/language/locales/da-DK.json
+++ b/packages/lib/src/language/locales/da-DK.json
@@ -4,6 +4,7 @@
     "payButton.with": "Betal %{value} med %{maskedData}",
     "close": "Luk",
     "storeDetails": "Gem til min næste betaling",
+    "readMore": "Læs mere",
     "creditCard.holderName": "Navn på kort",
     "creditCard.holderName.placeholder": "J. Hansen",
     "creditCard.holderName.invalid": "Indtast navn som vist på kortet",
@@ -260,6 +261,7 @@
     "ctp.otp.subtitle": "Indtast den kode, vi har sendt til %@ for at bekræfte, at det er dig.",
     "ctp.otp.saveCookiesCheckbox.label": "Spring bekræftelse over næste gang",
     "ctp.otp.saveCookiesCheckbox.information": "Vælg dette for at blive husket på din enhed og browser i deltagende butikker for hurtigere betaling. Anbefales ikke på delte enheder.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Vælg dette for at blive husket på din enhed og browser",
     "ctp.emptyProfile.message": "Ingen kort registreret i denne Click to Pay-profil",
     "ctp.separatorText": "eller brug",
     "ctp.cards.title": "Gennemfør betaling med Click to Pay",
diff --git a/packages/lib/src/language/locales/de-DE.json b/packages/lib/src/language/locales/de-DE.json
index 52249167f9..2d4d163856 100644
--- a/packages/lib/src/language/locales/de-DE.json
+++ b/packages/lib/src/language/locales/de-DE.json
@@ -4,6 +4,7 @@
     "payButton.with": "%{value} mit %{maskedData} zahlen",
     "close": "Schließen",
     "storeDetails": "Für zukünftige Zahlvorgänge speichern",
+    "readMore": "Mehr lesen",
     "creditCard.holderName": "Name auf der Karte",
     "creditCard.holderName.placeholder": "A. Müller",
     "creditCard.holderName.invalid": "Geben Sie den Namen wie auf der Karte gezeigt ein",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Geben Sie den Code ein, der von %@ an %@ gesendet wurde, um Ihre Identität zu bestätigen.",
     "ctp.otp.saveCookiesCheckbox.label": "Verifizierung beim nächsten Mal überspringen",
     "ctp.otp.saveCookiesCheckbox.information": "Wählen Sie diese Option, um bei teilnehmenden Geschäften auf Ihrem Gerät und Browser gespeichert zu werden, um den Bestellvorgang zu beschleunigen. Nicht für gemeinsam genutzte Geräte empfohlen.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Wählen Sie diese Option aus, um auf Ihrem Gerät und Browser gespeichert zu werden",
     "ctp.emptyProfile.message": "In diesem Click-to-Pay-Profil sind keine Karten registriert",
     "ctp.separatorText": "oder verwenden",
     "ctp.cards.title": "Zahlung mit Click to Pay abschließen",
diff --git a/packages/lib/src/language/locales/el-GR.json b/packages/lib/src/language/locales/el-GR.json
index 66cae5d4ea..5a976cb940 100644
--- a/packages/lib/src/language/locales/el-GR.json
+++ b/packages/lib/src/language/locales/el-GR.json
@@ -4,6 +4,7 @@
     "payButton.with": "Πληρωμή %{value} με %{maskedData}",
     "close": "Κλείσιμο",
     "storeDetails": "Αποθήκευση για την επόμενη πληρωμή μου",
+    "readMore": "Ανάγνωση περισσότερων",
     "creditCard.holderName": "Όνομα στην κάρτα",
     "creditCard.holderName.placeholder": "Γ. Παπαδάκης",
     "creditCard.holderName.invalid": "Εισαγάγετε το όνομα όπως αναγράφεται στην κάρτα",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Εισαγάγετε τον κωδικό %@ που στάλθηκε στο %@ για να επαληθεύσετε ότι είστε εσείς.",
     "ctp.otp.saveCookiesCheckbox.label": "Παράβλεψη επαλήθευσης την επόμενη φορά",
     "ctp.otp.saveCookiesCheckbox.information": "Επιλέξτε να απομνημονεύεται στη συσκευή και στο πρόγραμμα περιήγησής σας στα συμμετέχοντα καταστήματα για ταχύτερη ολοκλήρωση της πληρωμής. Δεν συνιστάται για κοινόχρηστες συσκευές.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Επιλέξτε να απομνημονεύεται στη συσκευή και στο πρόγραμμα περιήγησής σας",
     "ctp.emptyProfile.message": "Δεν υπάρχουν καταχωρισμένες κάρτες σε αυτό το προφίλ Click to Pay",
     "ctp.separatorText": "ή χρησιμοποιήστε το",
     "ctp.cards.title": "Ολοκληρώστε την πληρωμή με το Click to Pay",
diff --git a/packages/lib/src/language/locales/en-US.json b/packages/lib/src/language/locales/en-US.json
index e2b655c912..31f6f54db5 100644
--- a/packages/lib/src/language/locales/en-US.json
+++ b/packages/lib/src/language/locales/en-US.json
@@ -4,6 +4,7 @@
     "payButton.with": "Pay %{value} with %{maskedData}",
     "close": "Close",
     "storeDetails": "Save for my next payment",
+    "readMore": "Read more",
     "creditCard.holderName": "Name on card",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Enter name as shown on card",
@@ -261,6 +262,7 @@
     "ctp.otp.subtitle": "Enter the code %@ sent to %@ to verify it‘s you.",
     "ctp.otp.saveCookiesCheckbox.label": "Skip verification next time",
     "ctp.otp.saveCookiesCheckbox.information": "Select to be remembered on your device and browser at participating stores for faster checkout. Not recommended for shared devices.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Select to be remembered on your device and browser",
     "ctp.emptyProfile.message": "No cards registered in this Click to Pay profile",
     "ctp.separatorText": "or use",
     "ctp.cards.title": "Complete payment with Click to Pay",
diff --git a/packages/lib/src/language/locales/es-ES.json b/packages/lib/src/language/locales/es-ES.json
index 1f2dcd2f11..c7019fe98f 100644
--- a/packages/lib/src/language/locales/es-ES.json
+++ b/packages/lib/src/language/locales/es-ES.json
@@ -4,6 +4,7 @@
     "payButton.with": "Pague %{value} con %{maskedData}",
     "close": "Cerrar",
     "storeDetails": "Recordar para mi próximo pago",
+    "readMore": "Leer más",
     "creditCard.holderName": "Nombre en la tarjeta",
     "creditCard.holderName.placeholder": "Juan Pérez",
     "creditCard.holderName.invalid": "Introduzca el nombre como se muestra en la tarjeta",
@@ -254,6 +255,7 @@
     "ctp.otp.subtitle": "Introduzca el código %@ que le hemos enviado a %@ para verificar que es usted.",
     "ctp.otp.saveCookiesCheckbox.label": "Omitir verificación la próxima vez",
     "ctp.otp.saveCookiesCheckbox.information": "Seleccione esta opción para recordarle en su dispositivo y navegador en las tiendas participantes para agilizar el proceso de pago. No lo recomendamos para dispositivos compartidos.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Seleccione esta opción para recordarle en su dispositivo y navegador",
     "ctp.emptyProfile.message": "No hay tarjetas registradas en este perfil de Click to Pay",
     "ctp.separatorText": "o utilice",
     "ctp.cards.title": "Completar el pago con Click to Pay",
diff --git a/packages/lib/src/language/locales/fi-FI.json b/packages/lib/src/language/locales/fi-FI.json
index 1a4c602c15..16365f3b81 100644
--- a/packages/lib/src/language/locales/fi-FI.json
+++ b/packages/lib/src/language/locales/fi-FI.json
@@ -4,6 +4,7 @@
     "payButton.with": "Maksa %{value} käyttäen maksutapaa %{maskedData}",
     "close": "Sulje",
     "storeDetails": "Tallenna seuraavaa maksuani varten",
+    "readMore": "Lue lisää",
     "creditCard.holderName": "Nimi kortilla",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Syötä nimi sellaisena kuin se on kortissa",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Syötä koodi, jonka %@ lähetti osoitteeseen %@ vahvistaaksesi, että kyseessä olet sinä.",
     "ctp.otp.saveCookiesCheckbox.label": "Ohita vahvistus seuraavalla kerralla",
     "ctp.otp.saveCookiesCheckbox.information": "Valitse, että sinut muistetaan laitteellasi ja selaimessa osallistuvissa myymälöissä, jotta voit maksaa nopeammin. Ei suositella jaetuilla laitteilla.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Valitse, jotta sinut muistetaan laitteellasi ja selaimessa",
     "ctp.emptyProfile.message": "Tähän Click to Pay -profiiliin ei ole rekisteröity kortteja",
     "ctp.separatorText": "tai käytä",
     "ctp.cards.title": "Suorita maksu Click to Paylla",
diff --git a/packages/lib/src/language/locales/fr-FR.json b/packages/lib/src/language/locales/fr-FR.json
index b93cce364b..aedea6dc3f 100644
--- a/packages/lib/src/language/locales/fr-FR.json
+++ b/packages/lib/src/language/locales/fr-FR.json
@@ -4,6 +4,7 @@
     "payButton.with": "Payer %{value} avec %{maskedData}",
     "close": "Fermer",
     "storeDetails": "Sauvegarder pour mon prochain paiement",
+    "readMore": "Lire la suite",
     "creditCard.holderName": "Nom sur la carte",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Entrez le nom tel qu'il apparaît sur la carte",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Saisissez le code %@ envoyé à %@ pour vérifier votre identité.",
     "ctp.otp.saveCookiesCheckbox.label": "Ignorer la vérification la prochaine fois",
     "ctp.otp.saveCookiesCheckbox.information": "Sélectionnez cette option pour mémoriser les informations sur votre appareil et votre navigateur afin d'accélérer le paiement dans les magasins participants. Non recommandé pour les appareils partagés.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Sélectionner cette option pour mémoriser les informations sur votre appareil et votre navigateur",
     "ctp.emptyProfile.message": "Aucune carte enregistrée dans ce profil Click to Pay",
     "ctp.separatorText": "ou utilisez",
     "ctp.cards.title": "Terminez le paiement avec Click to Pay",
diff --git a/packages/lib/src/language/locales/hr-HR.json b/packages/lib/src/language/locales/hr-HR.json
index e0ac43f501..94ba6217ff 100644
--- a/packages/lib/src/language/locales/hr-HR.json
+++ b/packages/lib/src/language/locales/hr-HR.json
@@ -4,6 +4,7 @@
     "payButton.with": "Platite iznos od %{value} uporabom stavke %{maskedData}",
     "close": "Zatvori",
     "storeDetails": "Pohrani za moje sljedeće plaćanje",
+    "readMore": "Opširnije",
     "creditCard.holderName": "Ime na kartici",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Unesite ime kako je prikazano na kartici",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Upišite kôd %@ koji smo poslali na %@ da bismo potvrdili da ste to vi.",
     "ctp.otp.saveCookiesCheckbox.label": "Sljedeći puta preskoči provjeru",
     "ctp.otp.saveCookiesCheckbox.information": "Odaberite kako biste bili zapamćeni na svom uređaju i pregledniku u uključenim trgovinama za bržu naplatu. Ne preporučuje se za zajedničke uređaje.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Odaberite ako želite da vas se zapamti na vašem uređaju i pregledniku",
     "ctp.emptyProfile.message": "Nema kartica registriranih u sklopu ovog profila usluge Click to Pay",
     "ctp.separatorText": "ili upotrijebite",
     "ctp.cards.title": "Dovrši plaćanje uslugom Click to Pay",
diff --git a/packages/lib/src/language/locales/hu-HU.json b/packages/lib/src/language/locales/hu-HU.json
index 1a32d70d1e..6faa2e05ed 100644
--- a/packages/lib/src/language/locales/hu-HU.json
+++ b/packages/lib/src/language/locales/hu-HU.json
@@ -4,6 +4,7 @@
     "payButton.with": "%{value} fizetése a következővel: %{maskedData}",
     "close": "Bezárás",
     "storeDetails": "Mentés a következő fizetéshez",
+    "readMore": "Bővebben",
     "creditCard.holderName": "A kártyán szereplő név",
     "creditCard.holderName.placeholder": "Gipsz Jakab",
     "creditCard.holderName.invalid": "Adja meg a kártyán szereplő nevet",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Írja be a kódot, amit a(z) %@ küldött %@ részére ellenőrzés céljából.",
     "ctp.otp.saveCookiesCheckbox.label": "Ellenőrzés kihagyása a következő alkalommal",
     "ctp.otp.saveCookiesCheckbox.information": "Jelölje be, hogy a résztvevő üzletek a gyorsabb fizetés érdekében emlékezzenek az eszközre és a böngészőre. Megosztott eszközök esetén nem ajánlott.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Jelölje be, hogy a rendszer emlékezzen az eszközre és a böngészőre",
     "ctp.emptyProfile.message": "Ebben a Click to Pay-profilban nincs regisztrált kártya",
     "ctp.separatorText": "vagy használja a következőt",
     "ctp.cards.title": "Fizetés Click to Pay használatával",
diff --git a/packages/lib/src/language/locales/it-IT.json b/packages/lib/src/language/locales/it-IT.json
index 6c605de00e..ef52d816e4 100644
--- a/packages/lib/src/language/locales/it-IT.json
+++ b/packages/lib/src/language/locales/it-IT.json
@@ -4,6 +4,7 @@
     "payButton.with": "Paga %{value} con %{maskedData}",
     "close": "Chiudi",
     "storeDetails": "Salva per il prossimo pagamento",
+    "readMore": "Leggi di più",
     "creditCard.holderName": "Titolare carta",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Immetti il nome riportato sulla carta",
@@ -257,6 +258,7 @@
     "ctp.otp.subtitle": "Inserisci il codice che %@ ha inviato a %@ per verificare la tua identità.",
     "ctp.otp.saveCookiesCheckbox.label": "Salta la verifica la prossima volta",
     "ctp.otp.saveCookiesCheckbox.information": "Scegli di essere ricordato sul dispositivo e il browser che utilizzi per velocizzare il pagamento nei negozi partecipanti. Non consigliato per dispositivi condivisi.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Seleziona per essere ricordato sul tuo dispositivo e sul browser",
     "ctp.emptyProfile.message": "Non esistono carte registrate in questo profilo Click to Pay",
     "ctp.separatorText": "o utilizza",
     "ctp.cards.title": "Completa il pagamento con Click to Pay",
diff --git a/packages/lib/src/language/locales/ja-JP.json b/packages/lib/src/language/locales/ja-JP.json
index df0f9dd89e..d3e73928ed 100644
--- a/packages/lib/src/language/locales/ja-JP.json
+++ b/packages/lib/src/language/locales/ja-JP.json
@@ -4,6 +4,7 @@
     "payButton.with": "%{value}を%{maskedData}で支払う",
     "close": "終了",
     "storeDetails": "次回のお支払いのため詳細を保存",
+    "readMore": "詳細を確認",
     "creditCard.holderName": "カード上の名前",
     "creditCard.holderName.placeholder": "Taro Yamada",
     "creditCard.holderName.invalid": "カードに記載されている名前を入力してください",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "%@から%@に送信されたコードを入力して、ご本人であることを確認してください。",
     "ctp.otp.saveCookiesCheckbox.label": "次回は検証をスキップする",
     "ctp.otp.saveCookiesCheckbox.information": "対象店舗で、お使いのデバイスとブラウザで記憶させるように選択すると、より迅速なチェックアウトが可能になります。共有デバイスでは推奨されません。",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "選択すると、お使いのデバイスとブラウザに記憶されます",
     "ctp.emptyProfile.message": "このClick to Payプロフィールに登録されているカードはありません。",
     "ctp.separatorText": "または以下を使用",
     "ctp.cards.title": "Click to Payで支払いを完了する",
diff --git a/packages/lib/src/language/locales/ko-KR.json b/packages/lib/src/language/locales/ko-KR.json
index 20de9be36b..2cbd21438c 100644
--- a/packages/lib/src/language/locales/ko-KR.json
+++ b/packages/lib/src/language/locales/ko-KR.json
@@ -4,6 +4,7 @@
     "payButton.with": "%{maskedData}(으)로 %{value} 결제",
     "close": "닫기",
     "storeDetails": "다음 결제를 위해 이 수단 저장",
+    "readMore": "자세히 보기",
     "creditCard.holderName": "카드상의 이름",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "카드에 표시된 대로 이름을 입력합니다.",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "%@로 전송된 %@ 코드를 입력하여 본인 인증을 진행합니다.",
     "ctp.otp.saveCookiesCheckbox.label": "다음 번에는 인증 건너뛰기",
     "ctp.otp.saveCookiesCheckbox.information": "더 빠른 결제를 위해 사용자 기기와 참여 매장의 브라우저에서 정보를 기억하도록 선택하세요. 공유 기기에는 권장하지 않습니다.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "장치와 브라우저에서 기억되도록 선택하기",
     "ctp.emptyProfile.message": "해당 Click to Pay 프로필에 등록된 카드가 없습니다",
     "ctp.separatorText": "또는 사용",
     "ctp.cards.title": "Click to Pay로 결제 완료",
diff --git a/packages/lib/src/language/locales/nl-NL.json b/packages/lib/src/language/locales/nl-NL.json
index b739f72a6e..394ccf35df 100644
--- a/packages/lib/src/language/locales/nl-NL.json
+++ b/packages/lib/src/language/locales/nl-NL.json
@@ -4,6 +4,7 @@
     "payButton.with": "Betaal %{value} met %{maskedData}",
     "close": "Sluiten",
     "storeDetails": "Bewaar voor mijn volgende betaling",
+    "readMore": "Verder lezen",
     "creditCard.holderName": "Naam op kaart",
     "creditCard.holderName.placeholder": "J. Janssen",
     "creditCard.holderName.invalid": "Voer naam in zoals weergegeven op kaart",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Voer de code %@ in die naar %@ is gestuurd, zodat we kunnen verifiëren dat u het bent.",
     "ctp.otp.saveCookiesCheckbox.label": "Verificatie de volgende keer overslaan",
     "ctp.otp.saveCookiesCheckbox.information": "Selecteer om te worden onthouden op uw apparaat en in uw browser bij deelnemende winkels, zodat u sneller kunt afrekenen. Niet aanbevolen voor gedeelde apparaten.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Selecteer om onthouden te worden op uw apparaat en browser",
     "ctp.emptyProfile.message": "Geen kaarten geregistreerd voor dit Click to Pay-profiel",
     "ctp.separatorText": "of gebruik",
     "ctp.cards.title": "Voltooi de betaling met Click to Pay",
diff --git a/packages/lib/src/language/locales/no-NO.json b/packages/lib/src/language/locales/no-NO.json
index 64b5b2b970..e6845346a6 100644
--- a/packages/lib/src/language/locales/no-NO.json
+++ b/packages/lib/src/language/locales/no-NO.json
@@ -4,6 +4,7 @@
     "payButton.with": "Betal %{value} med %{maskedData}",
     "close": "Lukk",
     "storeDetails": "Lagre til min neste betaling",
+    "readMore": "Les mer",
     "creditCard.holderName": "Navn på kortet",
     "creditCard.holderName.placeholder": "O. Nordmann",
     "creditCard.holderName.invalid": "Skriv inn navnet som vist på kortet",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Tast inn koden vi sendte til %@, for å verifisere at det er deg.",
     "ctp.otp.saveCookiesCheckbox.label": "Hopp over verifisering neste gang",
     "ctp.otp.saveCookiesCheckbox.information": "Velg for å bli husket på enheten og i nettleseren din i deltakende butikker for raskere betaling. Anbefales ikke for delte enheter.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Velg for å bli husket på enheten og i nettleseren din",
     "ctp.emptyProfile.message": "Ingen kort er registrert i denne Click to Pay-profilen",
     "ctp.separatorText": "eller bruk",
     "ctp.cards.title": "Fullfør betalingen med Click to Pay",
diff --git a/packages/lib/src/language/locales/pl-PL.json b/packages/lib/src/language/locales/pl-PL.json
index d32d1ead3b..48d7971118 100644
--- a/packages/lib/src/language/locales/pl-PL.json
+++ b/packages/lib/src/language/locales/pl-PL.json
@@ -4,6 +4,7 @@
     "payButton.with": "Zapłać %{value} za pomocą %{maskedData}",
     "close": "Zamknij",
     "storeDetails": "Zapisz na potrzeby następnej płatności",
+    "readMore": "Czytaj więcej",
     "creditCard.holderName": "Imię i nazwisko na karcie",
     "creditCard.holderName.placeholder": "J. Kowalski",
     "creditCard.holderName.invalid": "Wpisz imię i nazwisko w takim formacie, jak na karcie",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Wprowadź kod %@ wysłany na adres %@, aby potwierdzić swoją tożsamość.",
     "ctp.otp.saveCookiesCheckbox.label": "Następnym razem pomiń weryfikację",
     "ctp.otp.saveCookiesCheckbox.information": "Wybierz opcję zapamiętywania na urządzeniu i w przeglądarce w sklepach uczestniczących w programie, aby przyspieszyć realizację transakcji. Niezalecane dla współużytkowanych urządzeń.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Wybierz, aby zapamiętać dane logowania na Twoim urządzeniu i przeglądarce",
     "ctp.emptyProfile.message": "W tym profilu Click to Pay nie zarejestrowano żadnych kart",
     "ctp.separatorText": "lub przypadków jej użycia",
     "ctp.cards.title": "Dokończ płatność za pomocą funkcji Click to Pay",
diff --git a/packages/lib/src/language/locales/pt-BR.json b/packages/lib/src/language/locales/pt-BR.json
index 44ef4530ae..9ea0d220da 100644
--- a/packages/lib/src/language/locales/pt-BR.json
+++ b/packages/lib/src/language/locales/pt-BR.json
@@ -4,6 +4,7 @@
     "payButton.with": "Pague %{value} com %{maskedData}",
     "close": "Fechar",
     "storeDetails": "Salvar para meu próximo pagamento",
+    "readMore": "Leia mais",
     "creditCard.holderName": "Nome no cartão",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Digite o nome conforme mostrado no cartão",
@@ -257,6 +258,7 @@
     "ctp.otp.subtitle": "Digite o código %@ enviado para %@ para confirmar que é você.",
     "ctp.otp.saveCookiesCheckbox.label": "Ignorar verificação da próxima vez",
     "ctp.otp.saveCookiesCheckbox.information": "Selecione esta opção para ser lembrado no seu dispositivo e navegador, agilizando o pagamento nas lojas participantes. Não recomendado para dispositivos compartilhados.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Selecione para ser lembrado em seu dispositivo e navegador",
     "ctp.emptyProfile.message": "Não há nenhum cartão cadastrado neste perfil do Click to Pay",
     "ctp.separatorText": "ou use",
     "ctp.cards.title": "Concluir o pagamento com o Click to Pay",
diff --git a/packages/lib/src/language/locales/pt-PT.json b/packages/lib/src/language/locales/pt-PT.json
index 88f21a05e3..3d0431540d 100644
--- a/packages/lib/src/language/locales/pt-PT.json
+++ b/packages/lib/src/language/locales/pt-PT.json
@@ -4,6 +4,7 @@
     "payButton.with": "Pagar %{value} com %{maskedData}",
     "close": "Fechar",
     "storeDetails": "Guardar para o meu próximo pagamento",
+    "readMore": "Ler mais",
     "creditCard.holderName": "Nome no cartão",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Introduzir o nome como mostrado no cartão",
@@ -261,6 +262,7 @@
     "ctp.otp.subtitle": "Introduza o código %@ enviado para %@ para verificar se é você.",
     "ctp.otp.saveCookiesCheckbox.label": "Saltar verificação da próxima vez",
     "ctp.otp.saveCookiesCheckbox.information": "Selecione para ser memorizado no seu dispositivo e navegador nas lojas participantes, para uma finalização de compra mais rápida. Não recomendado para dispositivos partilhados.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Selecione para ser memorizado no seu dispositivo e navegador",
     "ctp.emptyProfile.message": "Nenhum cartão registado neste perfil Click to Pay",
     "ctp.separatorText": "ou utilize",
     "ctp.cards.title": "Pagamento completo com Click to Pay",
diff --git a/packages/lib/src/language/locales/ro-RO.json b/packages/lib/src/language/locales/ro-RO.json
index 918b1b423c..9d80fcc2ec 100644
--- a/packages/lib/src/language/locales/ro-RO.json
+++ b/packages/lib/src/language/locales/ro-RO.json
@@ -4,6 +4,7 @@
     "payButton.with": "Plătiți %{value} cu %{maskedData}",
     "close": "Închidere",
     "storeDetails": "Salvează pentru următoarea mea plată",
+    "readMore": "Citiți mai mult",
     "creditCard.holderName": "Numele de pe card",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "Completați numele după cum figurează pe card",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Introduceți codul %@ pe care l-am trimis la %@ pentru a confirma că sunteți dvs.",
     "ctp.otp.saveCookiesCheckbox.label": "Omiteți verificarea data viitoare",
     "ctp.otp.saveCookiesCheckbox.information": "Selectați pentru a fi reținut pe dispozitiv și în browserul dvs. la magazinele participante pentru o plată mai rapidă. Nerecomandat pentru dispozitivele partajate.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Selectați pentru a fi memorat pe dispozitiv și browser",
     "ctp.emptyProfile.message": "Niciun card înregistrat în acest profil Click to Pay",
     "ctp.separatorText": "sau folosiți",
     "ctp.cards.title": "Finalizați plata cu Click to Pay",
diff --git a/packages/lib/src/language/locales/ru-RU.json b/packages/lib/src/language/locales/ru-RU.json
index d3153a02d8..8ef7b35dfa 100644
--- a/packages/lib/src/language/locales/ru-RU.json
+++ b/packages/lib/src/language/locales/ru-RU.json
@@ -4,6 +4,7 @@
     "payButton.with": "Оплатить %{value} %{maskedData}",
     "close": "Закрыть",
     "storeDetails": "Сохранить для следующего платежа",
+    "readMore": "Подробнее",
     "creditCard.holderName": "Имя на карте",
     "creditCard.holderName.placeholder": "И. Петров",
     "creditCard.holderName.invalid": "Введите имя, как оно указано на карте",
@@ -256,6 +257,7 @@
     "ctp.otp.subtitle": "Для подтверждения своей личности введите код %@, отправленный %@.",
     "ctp.otp.saveCookiesCheckbox.label": "Пропустить подтверждение в следующий раз",
     "ctp.otp.saveCookiesCheckbox.information": "Чтобы в соответствующих магазинах запомнили ваше устройство и браузер, выберите эту опцию. Это позволит быстрее оформлять заказы. Не рекомендуется на устройствах совместного использования.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Выберите, чтобы запомнили ваше устройство и браузер",
     "ctp.emptyProfile.message": "В данном профиле Click to Pay нет зарегистрированных карт",
     "ctp.separatorText": "или используйте",
     "ctp.cards.title": "Оформите оплату с помощью Click to Pay",
diff --git a/packages/lib/src/language/locales/sk-SK.json b/packages/lib/src/language/locales/sk-SK.json
index 573beb0e7e..a8c6b08c22 100644
--- a/packages/lib/src/language/locales/sk-SK.json
+++ b/packages/lib/src/language/locales/sk-SK.json
@@ -4,6 +4,7 @@
     "payButton.with": "Zaplatiť %{value} pomocou %{maskedData}",
     "close": "Zavrieť",
     "storeDetails": "Uložiť pre moju ďalšiu platbu",
+    "readMore": "Prečítajte si viac",
     "creditCard.holderName": "Meno na karte",
     "creditCard.holderName.placeholder": "J. Novák",
     "creditCard.holderName.invalid": "Zadajte meno tak, ako je uvedené na karte",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Zadajte kód %@, ktorý sme poslali na adresu %@, aby sme overili, že ste to vy.",
     "ctp.otp.saveCookiesCheckbox.label": "Nabudúce preskočiť overovanie",
     "ctp.otp.saveCookiesCheckbox.information": "Vyberte túto možnosť na zapamätanie v zariadení a prehliadači v zúčastnených obchodoch, čím urýchlite platbu. Neodporúča sa pre zdieľané zariadenia.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Vyberte túto možnosť na zapamätanie v zariadení a prehliadači",
     "ctp.emptyProfile.message": "V tomto profile Click to Pay nie sú registrované žiadne karty",
     "ctp.separatorText": "alebo použite",
     "ctp.cards.title": "Dokončite platbu v službe Click to Pay",
diff --git a/packages/lib/src/language/locales/sl-SI.json b/packages/lib/src/language/locales/sl-SI.json
index bfd883eaef..4e7d9c3edd 100644
--- a/packages/lib/src/language/locales/sl-SI.json
+++ b/packages/lib/src/language/locales/sl-SI.json
@@ -4,6 +4,7 @@
     "payButton.with": "Plačajte %{value} z %{maskedData}",
     "close": "Zapri",
     "storeDetails": "Shrani za moje naslednje plačilo",
+    "readMore": "Preberi več",
     "creditCard.holderName": "Ime na kartici",
     "creditCard.holderName.placeholder": "J. Novak",
     "creditCard.holderName.invalid": "Vnesite ime, kot je prikazano na kartici",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Vnesite kodo %@, ki smo jo poslali na %@, da potrdite, da ste to res vi.",
     "ctp.otp.saveCookiesCheckbox.label": "Naslednjič preskoči preverjanje",
     "ctp.otp.saveCookiesCheckbox.information": "Izberite če želite, da se v vaši napravi in brskalniku v sodelujočih trgovinah vaši podatki shranijo za hitrejši zaključek zakupa. Ni priporočljivo za naprave v skupni rabi.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Izberite, če želite, da se v vaši napravi in brskalniku shranijo vaši podatki",
     "ctp.emptyProfile.message": "V tem profilu Click to Pay ni registriranih nobenih kartic",
     "ctp.separatorText": "ali uporabite",
     "ctp.cards.title": "Dokončajte plačilo s storitvijo Click to Pay",
diff --git a/packages/lib/src/language/locales/sv-SE.json b/packages/lib/src/language/locales/sv-SE.json
index 3004465921..039398b4ee 100644
--- a/packages/lib/src/language/locales/sv-SE.json
+++ b/packages/lib/src/language/locales/sv-SE.json
@@ -4,6 +4,7 @@
     "payButton.with": "Betala %{value} med %{maskedData}",
     "close": "Stäng",
     "storeDetails": "Spara till min nästa betalning",
+    "readMore": "Läs mer",
     "creditCard.holderName": "Namn på kort",
     "creditCard.holderName.placeholder": "A. Andersson",
     "creditCard.holderName.invalid": "Ange namnet som det står på kortet",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "Ange koden som %@ skickade till %@ för att verifiera att det är du.",
     "ctp.otp.saveCookiesCheckbox.label": "Hoppa över verifieringen nästa gång",
     "ctp.otp.saveCookiesCheckbox.information": "Välj att bli ihågkommen på din enhet och webbläsare i deltagande butiker för snabbare utcheckning. Rekommenderas inte för delade enheter.",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "Välj att bli ihågkommen på din enhet och i din webbläsare",
     "ctp.emptyProfile.message": "Inga kort registrerade i denna Click to Pay-profil",
     "ctp.separatorText": "eller använd",
     "ctp.cards.title": "Slutför betalningen med Click to Pay",
diff --git a/packages/lib/src/language/locales/zh-CN.json b/packages/lib/src/language/locales/zh-CN.json
index 5fe6f7a363..8b17eb461d 100644
--- a/packages/lib/src/language/locales/zh-CN.json
+++ b/packages/lib/src/language/locales/zh-CN.json
@@ -4,6 +4,7 @@
     "payButton.with": "使用 %{maskedData} 支付 %{value}",
     "close": "关闭",
     "storeDetails": "保存以便下次支付使用",
+    "readMore": "阅读更多",
     "creditCard.holderName": "卡片上的姓名",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "输入卡片上显示的姓名",
@@ -258,6 +259,7 @@
     "ctp.otp.subtitle": "请输入我们发送至 %@ 的代码 (%@)，以验证是您本人。",
     "ctp.otp.saveCookiesCheckbox.label": "下次跳过验证",
     "ctp.otp.saveCookiesCheckbox.information": "在您的设备和浏览器上，在参与活动的店铺中选择记住该选项，以便更快地结账。不建议用于共享设备。",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "选择在您的设备和浏览器上记住",
     "ctp.emptyProfile.message": "此 Click to Pay 个人资料中尚未注册任何卡片",
     "ctp.separatorText": "或使用",
     "ctp.cards.title": "借助 Click to Pay 完成付款",
diff --git a/packages/lib/src/language/locales/zh-TW.json b/packages/lib/src/language/locales/zh-TW.json
index 2ea7e5ac01..c9092025c9 100644
--- a/packages/lib/src/language/locales/zh-TW.json
+++ b/packages/lib/src/language/locales/zh-TW.json
@@ -4,6 +4,7 @@
     "payButton.with": "用 %{maskedData} 支付 %{value}",
     "close": "關閉",
     "storeDetails": "儲存以供下次付款使用",
+    "readMore": "閱讀全文",
     "creditCard.holderName": "信用卡上的姓名",
     "creditCard.holderName.placeholder": "J. Smith",
     "creditCard.holderName.invalid": "輸入卡上所示的姓名",
@@ -259,6 +260,7 @@
     "ctp.otp.subtitle": "請輸入我們傳送至 %@ 的驗證碼 %@，以驗證是您本人。",
     "ctp.otp.saveCookiesCheckbox.label": "下次略過驗證",
     "ctp.otp.saveCookiesCheckbox.information": "選擇在裝置和瀏覽器中記住參與商店的驗證資訊，以加快結帳速度。不建議在共享裝置上選取該設定。",
+    "ctp.otp.saveCookiesCheckbox.shorterInfo": "選擇在裝置和瀏覽器中記住",
     "ctp.emptyProfile.message": "此 Click to Pay 個人資料中未註冊任何卡",
     "ctp.separatorText": "或使用",
     "ctp.cards.title": "使用 Click to Pay 完成付款",
diff --git a/packages/lib/src/utils/isScreenSmall.ts b/packages/lib/src/utils/isScreenSmall.ts
new file mode 100644
index 0000000000..3dd210b0ab
--- /dev/null
+++ b/packages/lib/src/utils/isScreenSmall.ts
@@ -0,0 +1,3 @@
+const isScreenSmall = (): boolean => window.matchMedia('(max-width: 480px)').matches;
+
+export default isScreenSmall;
diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index 28aaea7026..fee2de3722 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -188,7 +188,7 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'shopper@adyen.com',
+                    shopperEmail: 'gui.ctp@adyen.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From b730cac84831c8af7537a944d64a2f754f5221f3 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Wed, 22 Nov 2023 16:46:04 +0100
Subject: [PATCH 14/15] feat: email

---
 packages/playground/src/pages/Cards/Cards.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/playground/src/pages/Cards/Cards.js b/packages/playground/src/pages/Cards/Cards.js
index fee2de3722..28aaea7026 100644
--- a/packages/playground/src/pages/Cards/Cards.js
+++ b/packages/playground/src/pages/Cards/Cards.js
@@ -188,7 +188,7 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse =
                     mcSrcClientId: '6d41d4d6-45b1-42c3-a5d0-a28c0e69d4b1'
                 },
                 clickToPayConfiguration: {
-                    shopperEmail: 'gui.ctp@adyen.com',
+                    shopperEmail: 'shopper@adyen.com',
                     merchantDisplayName: 'Adyen Merchant Name',
                     onReady: () => {
                         console.log('Component is ready to be used');

From da84526553ab8a76933bb5d690ddfad80005eb23 Mon Sep 17 00:00:00 2001
From: guilhermer <guilherme.ribeiro@adyen.com>
Date: Thu, 23 Nov 2023 14:39:00 +0100
Subject: [PATCH 15/15] fix: update drop shadow

---
 .../internal/ClickToPay/components/CtPSection/CtPSection.scss   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
index 1f6c8cd586..89d0f72884 100644
--- a/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
+++ b/packages/lib/src/components/internal/ClickToPay/components/CtPSection/CtPSection.scss
@@ -3,7 +3,7 @@
 .adyen-checkout-ctp__section {
     position: relative;
     background-color: white;
-    box-shadow: 0 8px 24px rgb(0 0 0 / 15%);
+    box-shadow: 0 6px 12px rgb(0 17 44 / 8%), 0 2px 4px rgb(0 17 44 / 4%);
     border-radius: 12px;
     padding: 16px;