translate link componte inside Trans Component in react-i18next

0
votes

I want interpolate one react node with link component as below. However, I can not render the icon in the Link component.

   import { Trans } from 'react-i18next';
   import FolderAdd16 from '@carbon/icons-react/lib/folder--add/16';

   <Trans 
       i18nKey="mykey" 
       defaults="Copy this reference ID for your support ticket. <1>Contact support</1>"
    >
        Copy this reference ID for your support ticket.
        <a
          analytics-name="notification-create-support-ticket"
          href="/supportcenter"
          target="_blank"
          rel="noopener noreferrer"
        >
          Contact support
          <FolderAdd16 />
        </a>
      </Trans>
1
react-i18next

1 Answers

0
votes

You can use another localization string

defaults="Copy this reference ID for your support ticket. <1>Contact support <0 /></1>"