Xtykutl

I have a string which has a link inside. However, I cannot brake the string for translation purposes so I thought that by using 'FormattedMessage' I could pass some JSX into it like so:

    <FormattedMessage

        id= "CreateIdentity.error.generalError"

        values={link}

    />

where link is:

const link = 

    <Link target="_blank" to={`${config.help}`}>

        {formatMessage({id: "CreateIdentity.error.linkHelpPages"})}

    </Link>;

where my translation string is:

  "CreateIdentity.error.generalError": "You can try again, or {link} for more information";

Full component:

import React, {Fragment} from 'react';

import Link from 'react-router';

import PropTypes from 'prop-types';

import FormattedMessage from 'react-intl';



import {Alert} from '../Icons/Icons';



import {getFullConfig} from '../../../utils/getFullConfig';



const config = getFullConfig();



const GenericError = (props) => {

    const {formatMessage, statusCode} = props;

    const link = 

        <Link target="_blank" to={`${config.help}`}>

            {formatMessage({id: "CreateIdentity.error.linkHelpPages"})}

        </Link>;





    return (

        <Fragment>

            <header>

                {formatMessage({id: "CreateIdentity.error.generalErrorTitle"})}

            </header>

            <Alert className="alert" />

            {/* {formatMessage({id: "CreateIdentity.error.generalError"}, {link})} */}





            <FormattedMessage

                id= "CreateIdentity.error.generalError"

                values={{link}}

            />

            <p>

                {formatMessage({id: "CreateIdentity.error"})}

                {statusCode}

            </p>

        </Fragment>

    );

};





GenericError.propTypes = {

    formatMessage: PropTypes.func.isRequired,

    statusCode: PropTypes.number.isRequired

};



export default GenericError;

however the application the breaks:

index.js?92df:697 [React Intl] Error formatting message:
"CreateIdentity.error.generalError" for locale: "en" Error: The intl
string context variable 'link' was not provided to the string 'You can
try again, or {link} for more information'