SL-350 Settings copy & link fixes (SL-365/368/369/372/373)

[justelis22]

Part of SL-350 settings redesign. Phase 1 — copy & link changes (no logic).

Tickets

• SL-368 — deep-link the Saferpay Fields library docs anchor.
• SL-369 — reword the 3DS liability-shift setting labels.
• SL-373 — clarify Email Sending toggle descriptions (fixes fixed issue with paypal beeins used as transacion method #3 duplicating Readme #1); merchant-email pointer folded into the section description.
• SL-372 — correct the misleading "Hosted field style" info box.
• SL-365 — credentials hint with an environment-based Saferpay Backoffice link + JSON API Basic auth docs link.

Notes

• Strings stay translatable ($this->module->l(...) / t()); links use target="_blank" rel="noopener noreferrer".
• Copy quoting keeps its html_entity_decode(..., ENT_QUOTES, 'UTF-8') wrapper.
• .tsx changes (SL-368, SL-365): the compiled bundle (views/js/admin/dist) is gitignored and built in CI.

Verification

php -l clean; settings-app tsc && vite build passes.

[gemini-code-assist]

Code Review

This pull request introduces a credentials generation hint in the UI and updates several translation strings for improved clarity regarding payment behavior and email notifications. The review suggests refactoring the internationalization approach by using placeholders instead of splitting sentences into multiple keys to better support localization. Additionally, it recommends updating the terminology for the 'API Credentials' tab to ensure consistency and avoid user confusion.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

Splitting a sentence into multiple translation keys (credentialsHintPrefix, credentialsHintMiddle, etc.) is an internationalization (i18n) anti-pattern. Different languages have different word orders and grammatical structures. Translators will not be able to translate these fragmented strings accurately or naturally.

Instead, define a single translation string with placeholders for the links, and then parse/split the string in the React component to render the links.

            'credentialsHint' => html_entity_decode($this->module->l('You can generate your API credentials inside the [backoffice_link] under Settings > JSON API Basic authentication. [more_info_link]', self::FILE_NAME), ENT_QUOTES, 'UTF-8'),
            'credentialsBackofficeLinkText' => $this->module->l('Saferpay Backoffice', self::FILE_NAME),
            'credentialsMoreInfoLinkText' => $this->module->l('More information', self::FILE_NAME),

[gemini-code-assist]

To support the single translation string pattern and avoid sentence splitting, split the translated string by the placeholders and map them to the corresponding React link elements.

              <p className="sp-mb-0">
                {t('credentialsHint').split(/(\[backoffice_link\]|\[more_info_link\])/).map((part, index) => {
                  if (part === '[backoffice_link]') {
                    return (
                      <a key={index} href={backofficeUrl} target="_blank" rel="noopener noreferrer" className="sp-text-[#294e57] sp-underline hover:sp-no-underline">
                        {t('credentialsBackofficeLinkText')}
                      </a>
                    )
                  }
                  if (part === '[more_info_link]') {
                    return (
                      <a key={index} href={jsonApiBasicAuthDocsUrl} target="_blank" rel="noopener noreferrer" className="sp-text-[#294e57] sp-underline hover:sp-no-underline">
                        {t('credentialsMoreInfoLinkText')}
                      </a>
                    )
                  }
                  return part
                })}
              </p>

[gemini-code-assist]

The description refers to the 'Credentials tab', but the actual tab name is 'API Credentials' (defined as tabApiCredentials). To avoid merchant confusion, it is better to refer to it as the 'API Credentials' tab.

            'emailSendingDescription' => $this->module->l('Configure which emails are sent during the payment process. Merchant notifications sent by Saferpay use the Merchant Email(s) field on the API Credentials tab.', self::FILE_NAME),