← All changes
|
src/Shared/components/ProductAccountActivation/SetupPlugins.jsx
+20
-6
3.1.4
→
trunk
View file →
| @@ -4,9 +4,9 @@ | ||
| 4 | 4 | Field, |
| 5 | 5 | Input, |
| 6 | 6 | Label, |
| 7 | 7 | } from '@headlessui/react'; |
| 8 | -import { __ } from '@wordpress/i18n'; | |
| 8 | +import { __, _n } from '@wordpress/i18n'; | |
| 9 | 9 | import { check, chevronRight, external, Icon } from '@wordpress/icons'; |
| 10 | 10 | import { isEmail } from '@wordpress/url'; |
| 11 | 11 | import classNames from 'classnames'; |
| 12 | 12 | |
| @@ -21,8 +21,9 @@ | ||
| 21 | 21 | setMarketingConsent, |
| 22 | 22 | termsAgreed, |
| 23 | 23 | setTermsAgreed, |
| 24 | 24 | }) => { |
| 25 | + const offeredCount = plugins.length; | |
| 25 | 26 | const isCreateAccountsEnabled = |
| 26 | 27 | isEmail(email) && termsAgreed && plugins?.some((plugin) => plugin.selected); |
| 27 | 28 | |
| 28 | 29 | const togglePlugin = (pluginTitle) => { |
| @@ -42,10 +43,12 @@ | ||
| 42 | 43 | |
| 43 | 44 | return ( |
| 44 | 45 | <div className="py-10 px-16"> |
| 45 | 46 | <DialogTitle className="text-2xl font-semibold text-center text-gray-900 mb-10 font-sans"> |
| 46 | - {__( | |
| 47 | + {_n( | |
| 48 | + "Almost done! Let's finish setting up your plugin", | |
| 47 | 49 | "Almost done! Let's finish setting up your plugins", |
| 50 | + offeredCount, | |
| 48 | 51 | 'extendify-local', |
| 49 | 52 | )} |
| 50 | 53 | </DialogTitle> |
| 51 | 54 | |
| @@ -120,10 +123,12 @@ | ||
| 120 | 123 | placeholder="[email protected]" |
| 121 | 124 | className="text-gray-900 w-full px-4 py-3 text-sm border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-extendify-main focus:border-transparent" |
| 122 | 125 | /> |
| 123 | 126 | <Description className="mt-2 text-xss text-gray-700"> |
| 124 | - {__( | |
| 127 | + {_n( | |
| 128 | + 'This email will be used to create an account with the selected plugin provider. Form protected by reCAPTCHA.', | |
| 125 | 129 | 'This email will be used to create accounts with the selected plugin providers. Form protected by reCAPTCHA.', |
| 130 | + offeredCount, | |
| 126 | 131 | 'extendify-local', |
| 127 | 132 | )} |
| 128 | 133 | </Description> |
| 129 | 134 | </Field> |
| @@ -135,10 +140,12 @@ | ||
| 135 | 140 | onChange={(e) => setTermsAgreed(e.target.checked)} |
| 136 | 141 | className="mt-0.5 h-4 w-4 shrink-0 rounded border-gray-300 accent-extendify-main focus:ring-extendify-main" |
| 137 | 142 | /> |
| 138 | 143 | <span className="text-xs/relaxed text-gray-700"> |
| 139 | - {__( | |
| 144 | + {_n( | |
| 145 | + 'I agree to create an account with the selected provider using my email address, and to their applicable Terms of Service.', | |
| 140 | 146 | 'I agree to create accounts with the selected providers using my email address, and to their applicable Terms of Service.', |
| 147 | + offeredCount, | |
| 141 | 148 | 'extendify-local', |
| 142 | 149 | )} |
| 143 | 150 | </span> |
| 144 | 151 | </label> |
| @@ -150,10 +157,12 @@ | ||
| 150 | 157 | onChange={(e) => setMarketingConsent(e.target.checked)} |
| 151 | 158 | className="mt-0.5 h-4 w-4 shrink-0 rounded border-gray-300 accent-extendify-main focus:ring-extendify-main" |
| 152 | 159 | /> |
| 153 | 160 | <span className="text-xs/relaxed text-gray-700"> |
| 154 | - {__( | |
| 161 | + {_n( | |
| 162 | + 'I wish to receive communications about news and/or promotions from the selected provider.', | |
| 155 | 163 | 'I wish to receive communications about news and/or promotions from selected providers.', |
| 164 | + offeredCount, | |
| 156 | 165 | 'extendify-local', |
| 157 | 166 | )} |
| 158 | 167 | </span> |
| 159 | 168 | </label> |
| @@ -174,9 +183,14 @@ | ||
| 174 | 183 | 'ml-auto px-6 py-3 text-base font-medium text-white bg-extendify-main rounded-lg hover:bg-extendify-main-dark focus:outline-none focus:ring-2 focus:ring-extendify-main focus:ring-offset-2 flex items-center gap-2', |
| 175 | 184 | { 'cursor-not-allowed opacity-50': !isCreateAccountsEnabled }, |
| 176 | 185 | )} |
| 177 | 186 | > |
| 178 | - {__('Create accounts', 'extendify-local')} | |
| 187 | + {_n( | |
| 188 | + 'Create account', | |
| 189 | + 'Create accounts', | |
| 190 | + offeredCount, | |
| 191 | + 'extendify-local', | |
| 192 | + )} | |
| 179 | 193 | <Icon size={22} icon={chevronRight} className="fill-white" /> |
| 180 | 194 | </button> |
| 181 | 195 | </div> |
| 182 | 196 | </div> |