diff --git a/changelog/chore-use-external-link-component-for-external-links-also-update-settings-to-use-external-link-from-wp-components-not-the-bundled-one b/changelog/chore-use-external-link-component-for-external-links-also-update-settings-to-use-external-link-from-wp-components-not-the-bundled-one new file mode 100644 index 00000000000..7ae5dbb9bc2 --- /dev/null +++ b/changelog/chore-use-external-link-component-for-external-links-also-update-settings-to-use-external-link-from-wp-components-not-the-bundled-one @@ -0,0 +1,4 @@ +Significance: patch +Type: update + +update: merchant-facing pages to more easily show an external link (instead of a generic link), when it opens in a new tab; ensure that the ExternalLink component from the WP installation is used, instead of the bundled one diff --git a/client/components/account-balances/balance-tooltip.tsx b/client/components/account-balances/balance-tooltip.tsx index 2bf267856f6..d3825424fa5 100644 --- a/client/components/account-balances/balance-tooltip.tsx +++ b/client/components/account-balances/balance-tooltip.tsx @@ -5,6 +5,7 @@ import React from 'react'; import HelpOutlineIcon from 'gridicons/dist/help-outline'; import interpolateComponents from '@automattic/interpolate-components'; import { __ } from '@wordpress/i18n'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -42,10 +43,7 @@ export const TotalBalanceTooltip: React.FC< TotalBalanceTooltipProps > = ( { components: { bold: , learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - = ( { ), components: { discoverWhyLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - = components: { bold: , learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - = ), components: { discoverWhyLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - { components: { strong: , learnMoreLink: ( - + ), }, } ) diff --git a/client/components/deposits-overview/deposit-notices.tsx b/client/components/deposits-overview/deposit-notices.tsx index 9ccf655b6ae..813edbb1d6c 100644 --- a/client/components/deposits-overview/deposit-notices.tsx +++ b/client/components/deposits-overview/deposit-notices.tsx @@ -5,7 +5,7 @@ import React from 'react'; import { __, sprintf } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; import { Link } from '@woocommerce/components'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { addQueryArgs } from '@wordpress/url'; /** @@ -63,13 +63,7 @@ export const NewAccountWaitingPeriodNotice: React.FC = () => ( ), components: { whyLink: ( - // Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content. - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } @@ -97,13 +91,7 @@ export const NegativeBalanceDepositsPausedNotice: React.FC = () => ( ), components: { whyLink: ( - // Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content. - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } @@ -132,13 +120,7 @@ export const DepositMinimumBalanceNotice: React.FC< { ), components: { learnMoreLink: ( - // Link content is in the format string above. - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } @@ -158,13 +140,7 @@ export const NoFundsAvailableForDepositNotice: React.FC = () => ( ), components: { whyLink: ( - // Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content. - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } diff --git a/client/components/deposits-overview/deposit-schedule.tsx b/client/components/deposits-overview/deposit-schedule.tsx index 11221606544..8a28c8896d6 100644 --- a/client/components/deposits-overview/deposit-schedule.tsx +++ b/client/components/deposits-overview/deposit-schedule.tsx @@ -6,6 +6,7 @@ import { __, sprintf } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; import moment from 'moment'; import HelpOutlineIcon from 'gridicons/dist/help-outline'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -125,10 +126,7 @@ const DepositSchedule: React.FC< DepositScheduleProps > = ( { ), components: { link: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - = ( props ) => { components: { learnMoreLink: ( // eslint-disable-next-line jsx-a11y/anchor-has-content - ), }, diff --git a/client/components/payment-activity/payment-activity-data.tsx b/client/components/payment-activity/payment-activity-data.tsx index 7731ecfb5b1..492bd4c6393 100644 --- a/client/components/payment-activity/payment-activity-data.tsx +++ b/client/components/payment-activity/payment-activity-data.tsx @@ -6,6 +6,7 @@ import moment from 'moment'; import { __ } from '@wordpress/i18n'; import HelpOutlineIcon from 'gridicons/dist/help-outline'; import interpolateComponents from '@automattic/interpolate-components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies. @@ -224,11 +225,7 @@ const PaymentActivityDataComponent: React.FC< Props > = ( { strong: , learnMoreLink: ( // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } @@ -277,12 +274,7 @@ const PaymentActivityDataComponent: React.FC< Props > = ( { components: { strong: , learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } diff --git a/client/components/payment-activity/survey/index.tsx b/client/components/payment-activity/survey/index.tsx index cb2bd8abe16..c8773a8fe7c 100644 --- a/client/components/payment-activity/survey/index.tsx +++ b/client/components/payment-activity/survey/index.tsx @@ -9,6 +9,7 @@ import { Button, CardFooter, TextareaControl } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { createInterpolateElement, useState } from '@wordpress/element'; import { Icon, closeSmall } from '@wordpress/icons'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies. @@ -157,12 +158,7 @@ const Survey: React.FC = () => { ), { a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), } ) } diff --git a/client/components/payment-activity/survey/test/__snapshots__/index.test.tsx.snap b/client/components/payment-activity/survey/test/__snapshots__/index.test.tsx.snap index 571ede8a94e..62169ebfbf9 100644 --- a/client/components/payment-activity/survey/test/__snapshots__/index.test.tsx.snap +++ b/client/components/payment-activity/survey/test/__snapshots__/index.test.tsx.snap @@ -203,11 +203,33 @@ exports[`WcPayOverviewSurveyContextProvider test survey with comments textbox 1` > Your feedback will be only be shared with WooCommerce and treated pursuant to our privacy policy + + (opens in a new tab) + + .

diff --git a/client/components/sandbox-mode-switch-to-live-notice/index.tsx b/client/components/sandbox-mode-switch-to-live-notice/index.tsx index 5070690f6e3..bcf0a85daf3 100644 --- a/client/components/sandbox-mode-switch-to-live-notice/index.tsx +++ b/client/components/sandbox-mode-switch-to-live-notice/index.tsx @@ -17,6 +17,7 @@ import { ClickTooltip } from 'wcpay/components/tooltip'; import ErrorBoundary from 'wcpay/components/error-boundary'; import SetupLivePaymentsModal from './modal'; import './style.scss'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; interface Props { from: string; @@ -82,15 +83,11 @@ const SandboxModeSwitchToLiveNotice: React.FC< Props > = ( { ), components: { learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - recordEvent( 'wcpay_overview_sandbox_mode_learn_more_clicked' diff --git a/client/components/test-mode-notice/index.tsx b/client/components/test-mode-notice/index.tsx index 7b8ac27073d..e66775f45cd 100644 --- a/client/components/test-mode-notice/index.tsx +++ b/client/components/test-mode-notice/index.tsx @@ -10,8 +10,8 @@ import { __, _n, sprintf } from '@wordpress/i18n'; import { getPaymentSettingsUrl, isInTestMode } from 'utils'; import BannerNotice from '../banner-notice'; import interpolateComponents from '@automattic/interpolate-components'; -import { Link } from '@woocommerce/components'; import { recordEvent } from 'wcpay/tracks'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; type CurrentPage = | 'overview' @@ -84,15 +84,10 @@ const getNoticeContent = ( components: { strong: , learnMoreLink: ( - // Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content. - // eslint-disable-next-line jsx-a11y/anchor-has-content - recordEvent( 'wcpay_overview_test_mode_learn_more_clicked' diff --git a/client/components/test-mode-notice/test/__snapshots__/index.tsx.snap b/client/components/test-mode-notice/test/__snapshots__/index.tsx.snap index 92877be2b29..64997d52e2f 100644 --- a/client/components/test-mode-notice/test/__snapshots__/index.tsx.snap +++ b/client/components/test-mode-notice/test/__snapshots__/index.tsx.snap @@ -107,12 +107,33 @@ exports[`Test mode notification Returns valid component for overview page 1`] = All transactions will be simulated. Learn more + + (opens in a new tab) + + diff --git a/client/components/woopay/save-user/agreement.js b/client/components/woopay/save-user/agreement.js index a40d428c0d8..bc4b66ad4b0 100644 --- a/client/components/woopay/save-user/agreement.js +++ b/client/components/woopay/save-user/agreement.js @@ -5,6 +5,7 @@ import { __ } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; import { recordUserEvent } from 'tracks'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const Agreement = () => { return ( @@ -16,10 +17,8 @@ const Agreement = () => { ), components: { termsOfService: ( - { recordUserEvent( 'checkout_save_my_info_tos_click' @@ -27,13 +26,11 @@ const Agreement = () => { } } > { __( 'Terms of Service', 'woocommerce-payments' ) } - + ), privacyPolicy: ( - { recordUserEvent( 'checkout_save_my_info_privacy_policy_click' @@ -41,7 +38,7 @@ const Agreement = () => { } } > { __( 'Privacy Policy', 'woocommerce-payments' ) } - + ), }, } ) } diff --git a/client/connect-account-page/strings.tsx b/client/connect-account-page/strings.tsx index 95c1be5a59d..81997b50809 100644 --- a/client/connect-account-page/strings.tsx +++ b/client/connect-account-page/strings.tsx @@ -6,6 +6,7 @@ import React from 'react'; import { __, sprintf } from '@wordpress/i18n'; import { createInterpolateElement } from '@wordpress/element'; import interpolateComponents from '@automattic/interpolate-components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; export default { button: { @@ -82,13 +83,7 @@ export default { ), components: { learnMoreLink: ( - // Link content is in the format string above. Consider disabling jsx-a11y/anchor-has-content. - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ), @@ -284,14 +279,7 @@ export default { 'woocommerce-payments' ), { - a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - - ), + a: , } ), error: __( @@ -311,12 +299,7 @@ export default { { b: , a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), } ), diff --git a/client/connect-account-page/test/__snapshots__/index.test.tsx.snap b/client/connect-account-page/test/__snapshots__/index.test.tsx.snap index fc2b9048af3..7fd5db9b89f 100644 --- a/client/connect-account-page/test/__snapshots__/index.test.tsx.snap +++ b/client/connect-account-page/test/__snapshots__/index.test.tsx.snap @@ -706,11 +706,33 @@ exports[`ConnectAccountPage should render correctly with an incentive 1`] = `

*See Terms and Conditions + + (opens in a new tab) + + for details.

diff --git a/client/disable-confirmation-modal/index.js b/client/disable-confirmation-modal/index.js index 954c37af2f6..bc3d409d42a 100644 --- a/client/disable-confirmation-modal/index.js +++ b/client/disable-confirmation-modal/index.js @@ -5,6 +5,7 @@ import React from 'react'; import { Button } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -153,12 +154,10 @@ const DisableConfirmationModal = ( { onClose, onConfirm } ) => { components: { strong: , wooCommercePaymentsLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), contactSupportLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } diff --git a/client/payment-details/dispute-details/dispute-resolution-footer.tsx b/client/payment-details/dispute-details/dispute-resolution-footer.tsx index 8beb389ce2b..7729a90cf35 100644 --- a/client/payment-details/dispute-details/dispute-resolution-footer.tsx +++ b/client/payment-details/dispute-details/dispute-resolution-footer.tsx @@ -8,6 +8,7 @@ import { createInterpolateElement } from '@wordpress/element'; import { Button, CardFooter, + ExternalLink, Flex, FlexItem, } from 'wcpay/components/wp-components-wrapped'; @@ -57,12 +58,7 @@ const DisputeUnderReviewFooter: React.FC< { ), { a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content -- Link content is provided by createInterpolateElement - + ), strong: , } @@ -136,11 +132,7 @@ const DisputeWonFooter: React.FC< { { a: ( // eslint-disable-next-line jsx-a11y/anchor-has-content -- Link content is provided by createInterpolateElement - + ), strong: , } @@ -265,11 +257,7 @@ const DisputeLostFooter: React.FC< { { a: ( // eslint-disable-next-line jsx-a11y/anchor-has-content -- Link content is provided by createInterpolateElement - + ), } ) } @@ -345,11 +333,7 @@ const InquiryUnderReviewFooter: React.FC< { { a: ( // eslint-disable-next-line jsx-a11y/anchor-has-content -- Link content is provided by createInterpolateElement - + ), strong: , } @@ -412,12 +396,7 @@ const InquiryClosedFooter: React.FC< { ), { a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content -- Link content is provided by createInterpolateElement - + ), } ) } diff --git a/client/payment-details/dispute-details/dispute-summary-row.tsx b/client/payment-details/dispute-details/dispute-summary-row.tsx index 95119d01f82..976226f70e9 100644 --- a/client/payment-details/dispute-details/dispute-summary-row.tsx +++ b/client/payment-details/dispute-details/dispute-summary-row.tsx @@ -6,6 +6,7 @@ import React from 'react'; import HelpOutlineIcon from 'gridicons/dist/help-outline'; import { __ } from '@wordpress/i18n'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -63,16 +64,12 @@ const DisputeSummaryRow: React.FC< Props > = ( { dispute } ) => { { disputeReasonSummary }

- + { __( 'Learn more', 'woocommerce-payments' ) } - +

} diff --git a/client/payment-details/summary/__tests__/__snapshots__/index.test.js.snap b/client/payment-details/summary/__tests__/__snapshots__/index.test.js.snap index 0395cabe488..b8b47ee90d8 100644 --- a/client/payment-details/summary/__tests__/__snapshots__/index.test.js.snap +++ b/client/payment-details/summary/__tests__/__snapshots__/index.test.js.snap @@ -3871,11 +3871,33 @@ exports[`PaymentDetailsSummary renders the information of a dispute-reversal cha
decided that you won the dispute on -. The disputed amount and the dispute fee have been credited back to your account. Learn more about preventing disputes + + (opens in a new tab) + + . diff --git a/client/settings/advanced-settings/multi-currency-toggle.js b/client/settings/advanced-settings/multi-currency-toggle.js index e5033e7e5d5..befad9265a9 100644 --- a/client/settings/advanced-settings/multi-currency-toggle.js +++ b/client/settings/advanced-settings/multi-currency-toggle.js @@ -1,7 +1,8 @@ /** * External dependencies */ -import { CheckboxControl, ExternalLink } from '@wordpress/components'; +import { CheckboxControl } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { __ } from '@wordpress/i18n'; /** diff --git a/client/settings/advanced-settings/stripe-billing-notices/migrate-automatically-notice.tsx b/client/settings/advanced-settings/stripe-billing-notices/migrate-automatically-notice.tsx index 7cdc862f6e3..2d50d6f2f08 100644 --- a/client/settings/advanced-settings/stripe-billing-notices/migrate-automatically-notice.tsx +++ b/client/settings/advanced-settings/stripe-billing-notices/migrate-automatically-notice.tsx @@ -4,7 +4,7 @@ import React, { useState, useContext, useEffect } from 'react'; import InlineNotice from 'wcpay/components/inline-notice'; import { _n, sprintf } from '@wordpress/i18n'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; /** diff --git a/client/settings/advanced-settings/stripe-billing-notices/migrate-option-notice.tsx b/client/settings/advanced-settings/stripe-billing-notices/migrate-option-notice.tsx index 34907e596ea..b98989e5a38 100644 --- a/client/settings/advanced-settings/stripe-billing-notices/migrate-option-notice.tsx +++ b/client/settings/advanced-settings/stripe-billing-notices/migrate-option-notice.tsx @@ -4,7 +4,7 @@ import React, { useContext, useState } from 'react'; import InlineNotice from 'wcpay/components/inline-notice'; import { __, _n, sprintf } from '@wordpress/i18n'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; import { useEffect } from '@wordpress/element'; diff --git a/client/settings/advanced-settings/stripe-billing-toggle.tsx b/client/settings/advanced-settings/stripe-billing-toggle.tsx index 77671a71a66..7aca7ae519b 100644 --- a/client/settings/advanced-settings/stripe-billing-toggle.tsx +++ b/client/settings/advanced-settings/stripe-billing-toggle.tsx @@ -3,7 +3,8 @@ */ import React, { useContext } from 'react'; import { __, sprintf } from '@wordpress/i18n'; -import { CheckboxControl, ExternalLink } from '@wordpress/components'; +import { CheckboxControl } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; /** diff --git a/client/settings/advanced-settings/wcpay-subscriptions-toggle.js b/client/settings/advanced-settings/wcpay-subscriptions-toggle.js index edc2339e506..b279062ae99 100644 --- a/client/settings/advanced-settings/wcpay-subscriptions-toggle.js +++ b/client/settings/advanced-settings/wcpay-subscriptions-toggle.js @@ -1,7 +1,8 @@ /** * External dependencies */ -import { CheckboxControl, ExternalLink } from '@wordpress/components'; +import { CheckboxControl } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { __, sprintf } from '@wordpress/i18n'; /** diff --git a/client/settings/buy-now-pay-later-section/index.js b/client/settings/buy-now-pay-later-section/index.js index ae47a035ec8..8abb9877c6c 100644 --- a/client/settings/buy-now-pay-later-section/index.js +++ b/client/settings/buy-now-pay-later-section/index.js @@ -3,7 +3,8 @@ * External dependencies */ import React from 'react'; -import { Card, ExternalLink } from '@wordpress/components'; +import { Card } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { __ } from '@wordpress/i18n'; /** diff --git a/client/settings/deposits/index.js b/client/settings/deposits/index.js index 19ad1956419..b0bd7710f2a 100644 --- a/client/settings/deposits/index.js +++ b/client/settings/deposits/index.js @@ -4,7 +4,8 @@ import React, { useContext } from 'react'; import { select } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; -import { Card, SelectControl, ExternalLink } from '@wordpress/components'; +import { Card, SelectControl } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; /** @@ -166,12 +167,7 @@ const DepositsSchedule = () => { ), components: { learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } @@ -189,12 +185,7 @@ const DepositsSchedule = () => { ), components: { learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + ), }, } ) } diff --git a/client/settings/express-checkout-settings/woopay-settings.js b/client/settings/express-checkout-settings/woopay-settings.js index 8edc32b0f1b..5665b6ee0e2 100644 --- a/client/settings/express-checkout-settings/woopay-settings.js +++ b/client/settings/express-checkout-settings/woopay-settings.js @@ -5,12 +5,8 @@ import React from 'react'; import clsx from 'clsx'; import { __ } from '@wordpress/i18n'; -import { - Card, - CheckboxControl, - TextareaControl, - ExternalLink, -} from '@wordpress/components'; +import { Card, CheckboxControl, TextareaControl } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; import { Link } from '@woocommerce/components'; @@ -99,32 +95,16 @@ const WooPaySettings = ( { section } ) => { ), components: { wooPayLink: ( - + ), tosLink: ( - + ), privacyLink: ( - + ), trackingLink: ( - + ), }, } ) @@ -245,10 +225,7 @@ const WooPaySettings = ( { section } ) => { ), components: { docs: ( - /* eslint-disable-next-line jsx-a11y/anchor-has-content */ - diff --git a/client/settings/express-checkout/apple-google-pay-item.tsx b/client/settings/express-checkout/apple-google-pay-item.tsx index 5cf4c6283e0..1e4f9cee9fe 100644 --- a/client/settings/express-checkout/apple-google-pay-item.tsx +++ b/client/settings/express-checkout/apple-google-pay-item.tsx @@ -5,6 +5,7 @@ import { __ } from '@wordpress/i18n'; import { Button, CheckboxControl } from '@wordpress/components'; import interpolateComponents from '@automattic/interpolate-components'; import React, { useContext } from 'react'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -82,16 +83,10 @@ const AppleGooglePayExpressCheckoutItem = (): React.ReactElement => { ), components: { stripeLink: ( - + ), appleLink: ( - @@ -137,18 +132,10 @@ const AppleGooglePayExpressCheckoutItem = (): React.ReactElement => { ), components: { stripeLink: ( - + ), googleLink: ( - + ), br:
, }, diff --git a/client/settings/express-checkout/link-item.tsx b/client/settings/express-checkout/link-item.tsx index e234bde0917..683f247956c 100644 --- a/client/settings/express-checkout/link-item.tsx +++ b/client/settings/express-checkout/link-item.tsx @@ -17,6 +17,7 @@ import { import './style.scss'; import { LinkIcon } from 'wcpay/payment-methods-icons'; import InlineNotice from 'wcpay/components/inline-notice'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const LinkExpressCheckoutItem = (): React.ReactElement | null => { const availablePaymentMethodIds = useGetAvailablePaymentMethodIds(); @@ -102,18 +103,10 @@ const LinkExpressCheckoutItem = (): React.ReactElement | null => { ), components: { stripeLinkTerms: ( -
+ ), privacyPolicy: ( - + ), }, } ) diff --git a/client/settings/express-checkout/woopay-item.tsx b/client/settings/express-checkout/woopay-item.tsx index aa71187a137..876b80b294a 100644 --- a/client/settings/express-checkout/woopay-item.tsx +++ b/client/settings/express-checkout/woopay-item.tsx @@ -8,6 +8,7 @@ import { Button, CheckboxControl } from '@wordpress/components'; import interpolateComponents from '@automattic/interpolate-components'; import { getPaymentMethodSettingsUrl } from '../../utils'; import { useContext } from '@wordpress/element'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -92,33 +93,16 @@ const WooPayExpressCheckoutItem = (): React.ReactElement | null => { ), components: { wooPayLink: ( - + ), tosLink: ( - + ), privacyLink: ( - + ), trackingLink: ( - + ), }, } ) diff --git a/client/settings/fraud-protection/advanced-settings/cards/cvc-verification.tsx b/client/settings/fraud-protection/advanced-settings/cards/cvc-verification.tsx index aae464d32f2..6660402ca46 100644 --- a/client/settings/fraud-protection/advanced-settings/cards/cvc-verification.tsx +++ b/client/settings/fraud-protection/advanced-settings/cards/cvc-verification.tsx @@ -4,7 +4,7 @@ import React from 'react'; import { __ } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; -import { Link } from '@woocommerce/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -32,9 +32,7 @@ const CVCVerificationRuleCard: React.FC = () => { ), components: { learnMoreLink: ( - diff --git a/client/settings/fraud-protection/advanced-settings/cards/international-ip-address.tsx b/client/settings/fraud-protection/advanced-settings/cards/international-ip-address.tsx index 392c5048848..50d240a78f6 100644 --- a/client/settings/fraud-protection/advanced-settings/cards/international-ip-address.tsx +++ b/client/settings/fraud-protection/advanced-settings/cards/international-ip-address.tsx @@ -3,7 +3,6 @@ */ import React from 'react'; import { __ } from '@wordpress/i18n'; -import { Link } from '@woocommerce/components'; import interpolateComponents from '@automattic/interpolate-components'; /** @@ -16,6 +15,7 @@ import FraudProtectionRuleToggle from '../rule-toggle'; import AllowedCountriesNotice from '../allow-countries-notice'; import { getAdminUrl } from 'wcpay/utils'; import { getSupportedCountriesType } from '../utils'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const InternationalIPAddressRuleCard: React.FC = () => { const supportsAllCountries = 'all' === getSupportedCountriesType(); @@ -48,11 +48,7 @@ const InternationalIPAddressRuleCard: React.FC = () => { ), components: { ipAddressLink: ( - + ), supportedCountriesLink: ( // eslint-disable-next-line jsx-a11y/anchor-has-content diff --git a/client/settings/fraud-protection/advanced-settings/cards/ip-address-mismatch.tsx b/client/settings/fraud-protection/advanced-settings/cards/ip-address-mismatch.tsx index 26879c5e1c8..c8fcd5aaef6 100644 --- a/client/settings/fraud-protection/advanced-settings/cards/ip-address-mismatch.tsx +++ b/client/settings/fraud-protection/advanced-settings/cards/ip-address-mismatch.tsx @@ -4,7 +4,6 @@ import React from 'react'; import { __ } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; -import { Link } from '@woocommerce/components'; /** * Internal dependencies @@ -12,6 +11,7 @@ import { Link } from '@woocommerce/components'; import FraudProtectionRuleCard from '../rule-card'; import FraudProtectionRuleDescription from '../rule-description'; import FraudProtectionRuleToggle from '../rule-toggle'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const IPAddressMismatchRuleCard: React.FC = () => ( ( ), components: { ipAddressLink: ( - + ), }, } ) } diff --git a/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/cvc-verification.test.tsx.snap b/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/cvc-verification.test.tsx.snap index 558e4bf21aa..9667ab843cf 100644 --- a/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/cvc-verification.test.tsx.snap +++ b/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/cvc-verification.test.tsx.snap @@ -154,11 +154,33 @@ exports[`CVC verification card renders correctly when CVC check is enabled 1`] = > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + diff --git a/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/international-ip-address.test.tsx.snap b/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/international-ip-address.test.tsx.snap index 59d0b947aa1..bddc277fe8e 100644 --- a/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/international-ip-address.test.tsx.snap +++ b/client/settings/fraud-protection/advanced-settings/cards/test/__snapshots__/international-ip-address.test.tsx.snap @@ -61,11 +61,33 @@ exports[`International IP address card renders correctly when enabled 1`] = ` > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -158,11 +180,33 @@ exports[`International billing address card renders correctly when enabled 1`] = > This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -257,11 +301,33 @@ exports[`International billing address card renders correctly when enabled and c > This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -355,11 +421,33 @@ exports[`International billing address card renders like disabled when checked, > This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. diff --git a/client/settings/fraud-protection/advanced-settings/test/__snapshots__/index.test.tsx.snap b/client/settings/fraud-protection/advanced-settings/test/__snapshots__/index.test.tsx.snap index e35f5593295..1f8b511aeb7 100644 --- a/client/settings/fraud-protection/advanced-settings/test/__snapshots__/index.test.tsx.snap +++ b/client/settings/fraud-protection/advanced-settings/test/__snapshots__/index.test.tsx.snap @@ -247,11 +247,33 @@ exports[`Advanced fraud protection settings doesn't save when there's a validati > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -863,11 +907,33 @@ exports[`Advanced fraud protection settings doesn't save when there's a validati > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -1135,11 +1201,33 @@ exports[`Advanced fraud protection settings doesn't save when there's a validati > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -1751,11 +1861,33 @@ exports[`Advanced fraud protection settings doesn't save when there's a validati > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -2087,11 +2219,33 @@ exports[`Advanced fraud protection settings renders an error message when settin > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -2574,11 +2750,33 @@ exports[`Advanced fraud protection settings renders an error message when settin > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -2829,11 +3027,33 @@ exports[`Advanced fraud protection settings renders an error message when settin > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -3316,11 +3558,33 @@ exports[`Advanced fraud protection settings renders an error message when settin > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -3629,11 +3893,33 @@ exports[`Advanced fraud protection settings renders correctly 1`] = ` > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -4116,11 +4424,33 @@ exports[`Advanced fraud protection settings renders correctly 1`] = ` > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -4346,11 +4676,33 @@ exports[`Advanced fraud protection settings renders correctly 1`] = ` > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -4833,11 +5207,33 @@ exports[`Advanced fraud protection settings renders correctly 1`] = ` > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -5153,11 +5549,33 @@ exports[`Advanced fraud protection settings saves settings when there are no val > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -5721,11 +6161,33 @@ exports[`Advanced fraud protection settings saves settings when there are no val > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + @@ -5960,11 +6422,33 @@ exports[`Advanced fraud protection settings saves settings when there are no val > This filter screens for IP addresses + + (opens in a new tab) + + outside of your This filter screens for customer's IP address + + (opens in a new tab) + + to see if it is in a different country than indicated in their billing address. When enabled the payment will be blocked. @@ -6528,11 +7034,33 @@ exports[`Advanced fraud protection settings saves settings when there are no val > For security, this filter is enabled and cannot be modified. Payments failing CVC verification will be blocked. Learn more + + (opens in a new tab) + + diff --git a/client/settings/general-settings/index.js b/client/settings/general-settings/index.js index da843f4c0cd..51980d4abd8 100644 --- a/client/settings/general-settings/index.js +++ b/client/settings/general-settings/index.js @@ -5,6 +5,7 @@ import React, { useState } from 'react'; import { __, sprintf } from '@wordpress/i18n'; import { Card, CheckboxControl } from '@wordpress/components'; import interpolateComponents from '@automattic/interpolate-components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; /** * Internal dependencies @@ -61,21 +62,12 @@ const GeneralSettings = () => { ), components: { testCardHelpLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + /* eslint-disable-next-line max-len */ + ), learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + /* eslint-disable-next-line max-len */ + ), }, } ) } @@ -121,13 +113,8 @@ const GeneralSettings = () => { components: { b: , learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - + // eslint-disable-next-line max-len + ), }, } ) } diff --git a/client/settings/general-settings/test-mode-confirm-modal.tsx b/client/settings/general-settings/test-mode-confirm-modal.tsx index 85185306c16..4b56613ee61 100644 --- a/client/settings/general-settings/test-mode-confirm-modal.tsx +++ b/client/settings/general-settings/test-mode-confirm-modal.tsx @@ -4,7 +4,8 @@ * External dependencies */ import React from 'react'; -import { Button, ExternalLink } from '@wordpress/components'; +import { Button } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { __ } from '@wordpress/i18n'; /** diff --git a/client/settings/google-pay-test-mode-compatibility-notice.tsx b/client/settings/google-pay-test-mode-compatibility-notice.tsx index e5d81824e8b..4a0914f5d43 100644 --- a/client/settings/google-pay-test-mode-compatibility-notice.tsx +++ b/client/settings/google-pay-test-mode-compatibility-notice.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import interpolateComponents from '@automattic/interpolate-components'; import React, { useContext } from 'react'; diff --git a/client/settings/index.js b/client/settings/index.js index 5f7d3d9212d..f0647fed2e8 100644 --- a/client/settings/index.js +++ b/client/settings/index.js @@ -12,6 +12,7 @@ import SettingsManager from 'settings/settings-manager'; import ExpressCheckoutSettings from './express-checkout-settings'; import WCPaySettingsContext from './wcpay-settings-context'; import ErrorBoundary from '../components/error-boundary'; +import { WordPressComponentsContext } from 'wcpay/wordpress-components-context/context'; window.addEventListener( 'load', () => { enqueueFraudScripts( wcpaySettings.fraudServices ); @@ -22,11 +23,13 @@ const settingsContainer = document.getElementById( ); if ( settingsContainer ) { ReactDOM.render( - - - - - , + + + + + + + , settingsContainer ); } @@ -38,11 +41,13 @@ if ( expressCheckoutSettingsContainer ) { const methodId = expressCheckoutSettingsContainer.dataset.methodId; ReactDOM.render( - - - - - , + + + + + + + , expressCheckoutSettingsContainer ); } diff --git a/client/settings/payment-methods-list/use-payment-method-availability.tsx b/client/settings/payment-methods-list/use-payment-method-availability.tsx index 0688fd96292..c366729d2ea 100644 --- a/client/settings/payment-methods-list/use-payment-method-availability.tsx +++ b/client/settings/payment-methods-list/use-payment-method-availability.tsx @@ -17,7 +17,7 @@ import PAYMENT_METHOD_IDS from 'wcpay/constants/payment-method'; import { getMissingCurrenciesTooltipMessage } from 'multi-currency/utils/missing-currencies-message'; import { __, sprintf } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { ChipType } from 'wcpay/components/chip'; const documentationTypeMap = { diff --git a/client/settings/settings-manager/index.js b/client/settings/settings-manager/index.js index 62925e14830..a590e14db8a 100644 --- a/client/settings/settings-manager/index.js +++ b/client/settings/settings-manager/index.js @@ -3,7 +3,7 @@ * External dependencies */ import React, { useState, useLayoutEffect, useEffect } from 'react'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { __, sprintf } from '@wordpress/i18n'; import { getQuery } from '@woocommerce/navigation'; diff --git a/client/settings/settings-warnings/incompatibility-notice.js b/client/settings/settings-warnings/incompatibility-notice.js index bd69324b11a..d80d63b391a 100644 --- a/client/settings/settings-warnings/incompatibility-notice.js +++ b/client/settings/settings-warnings/incompatibility-notice.js @@ -8,6 +8,7 @@ import interpolateComponents from '@automattic/interpolate-components'; * Internal dependencies */ import InlineNotice from 'wcpay/components/inline-notice'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const IncompatibilityNotice = ( { message, learnMoreLinkHref } ) => ( @@ -18,14 +19,7 @@ const IncompatibilityNotice = ( { message, learnMoreLinkHref } ) => ( 'woocommerce-payments' ), components: { - learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - - ), + learnMoreLink: , }, } ) } diff --git a/client/settings/transactions/manual-capture-control.tsx b/client/settings/transactions/manual-capture-control.tsx index 1436cfee566..e5c7d058dd2 100644 --- a/client/settings/transactions/manual-capture-control.tsx +++ b/client/settings/transactions/manual-capture-control.tsx @@ -4,7 +4,8 @@ */ import React from 'react'; import { __ } from '@wordpress/i18n'; -import { CheckboxControl, Button, ExternalLink } from '@wordpress/components'; +import { CheckboxControl, Button } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { useState } from '@wordpress/element'; /** * Internal dependencies diff --git a/client/subscription-product-onboarding/modal.js b/client/subscription-product-onboarding/modal.js index 07d3ae6fba6..258819ecdc5 100644 --- a/client/subscription-product-onboarding/modal.js +++ b/client/subscription-product-onboarding/modal.js @@ -3,6 +3,7 @@ */ import React from 'react'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { Button, Icon, Modal } from '@wordpress/components'; import { createInterpolateElement, @@ -85,14 +86,7 @@ const SubscriptionProductOnboardingModalContent = ( { 'woocommerce-payments' ), { - a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - - ), + a: , } ) }

diff --git a/client/subscriptions-empty-state/index.js b/client/subscriptions-empty-state/index.js index ff962bc9898..db9c09561b2 100644 --- a/client/subscriptions-empty-state/index.js +++ b/client/subscriptions-empty-state/index.js @@ -5,6 +5,7 @@ import React from 'react'; import { __, sprintf } from '@wordpress/i18n'; import { createInterpolateElement, render, useState } from '@wordpress/element'; import { Button } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { recordEvent } from '../tracks'; import UnconnectedImage from 'assets/images/subscriptions-empty-state-unconnected.svg?asset'; @@ -39,14 +40,7 @@ const TOS = () => ( 'woocommerce-payments' ), { - a: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content -
- ), + a: , } ) }

diff --git a/client/transactions/list/deposit.tsx b/client/transactions/list/deposit.tsx index e05bfa963cd..a2e3875e39d 100644 --- a/client/transactions/list/deposit.tsx +++ b/client/transactions/list/deposit.tsx @@ -6,7 +6,7 @@ import React from 'react'; import { __ } from '@wordpress/i18n'; import interpolateComponents from '@automattic/interpolate-components'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import { Link } from '@woocommerce/components'; import InfoOutlineIcon from 'gridicons/dist/info-outline'; diff --git a/client/utils/account-fees.tsx b/client/utils/account-fees.tsx index ece041912c7..8ba7dddd1c0 100644 --- a/client/utils/account-fees.tsx +++ b/client/utils/account-fees.tsx @@ -15,7 +15,7 @@ import { formatFee } from 'utils/fees'; import React from 'react'; import { BaseFee, DiscountFee, FeeStructure } from 'wcpay/types/fees'; import { createInterpolateElement } from '@wordpress/element'; -import { ExternalLink } from '@wordpress/components'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; import PAYMENT_METHOD_IDS from 'constants/payment-method'; const countryFeeStripeDocsBaseLink = diff --git a/includes/multi-currency/client/blocks/currency-switcher.js b/includes/multi-currency/client/blocks/currency-switcher.js index 1d4369d4b54..8898938dfc6 100644 --- a/includes/multi-currency/client/blocks/currency-switcher.js +++ b/includes/multi-currency/client/blocks/currency-switcher.js @@ -23,6 +23,7 @@ import { InspectorControls, useBlockProps, } from '@wordpress/block-editor'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; registerBlockType( 'woocommerce-payments/multi-currency-switcher', { apiVersion: 3, @@ -211,18 +212,16 @@ registerBlockType( 'woocommerce-payments/multi-currency-switcher', { 'woocommerce-payments' ) } > -
{ __( 'Adjust and edit your Multi-Currency settings', 'woocommerce-payments' ) } - + { const LEARN_MORE_URL = @@ -42,14 +43,7 @@ const EnabledCurrenciesSettingsDescription = () => { LEARN_MORE_URL ), { - learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - - ), + learnMoreLink: , } ) }

diff --git a/includes/multi-currency/client/settings/multi-currency/enabled-currencies-list/test/__snapshots__/index.js.snap b/includes/multi-currency/client/settings/multi-currency/enabled-currencies-list/test/__snapshots__/index.js.snap index ba1b773793e..ec0ce1721f7 100644 --- a/includes/multi-currency/client/settings/multi-currency/enabled-currencies-list/test/__snapshots__/index.js.snap +++ b/includes/multi-currency/client/settings/multi-currency/enabled-currencies-list/test/__snapshots__/index.js.snap @@ -14,11 +14,33 @@ exports[`Multi-Currency enabled currencies list Enabled currencies list renders

Accept payments in multiple currencies. Prices are converted based on exchange rates and rounding rules. Learn more + + (opens in a new tab) + +

diff --git a/includes/multi-currency/client/settings/multi-currency/store-settings/index.js b/includes/multi-currency/client/settings/multi-currency/store-settings/index.js index 18972164698..ea878d5d3e5 100644 --- a/includes/multi-currency/client/settings/multi-currency/store-settings/index.js +++ b/includes/multi-currency/client/settings/multi-currency/store-settings/index.js @@ -17,6 +17,7 @@ import { SettingsSection, } from 'multi-currency/interface/components'; import PreviewModal from 'multi-currency/components/preview-modal'; +import { ExternalLink } from 'wcpay/components/wp-components-wrapped'; const StoreSettingsDescription = () => { const LEARN_MORE_URL = @@ -37,14 +38,7 @@ const StoreSettingsDescription = () => { LEARN_MORE_URL ), { - learnMoreLink: ( - // eslint-disable-next-line jsx-a11y/anchor-has-content - - ), + learnMoreLink: , } ) }

diff --git a/includes/multi-currency/client/settings/multi-currency/store-settings/test/__snapshots__/index.test.js.snap b/includes/multi-currency/client/settings/multi-currency/store-settings/test/__snapshots__/index.test.js.snap index 84ad0c6a502..e463b9b8246 100644 --- a/includes/multi-currency/client/settings/multi-currency/store-settings/test/__snapshots__/index.test.js.snap +++ b/includes/multi-currency/client/settings/multi-currency/store-settings/test/__snapshots__/index.test.js.snap @@ -14,11 +14,33 @@ exports[`Multi-Currency store settings store settings task renders correctly: sn

Store settings allow your customers to choose which currency they would like to use when shopping at your store. Learn more + + (opens in a new tab) + +