Как сделать html шаблон с переменными внутри из в реагировать?

Question

Я получаю html шаблон с сервера. Этот шаблон также содержит данные объекта внутри. Я хочу показать этот шаблон в компоненте реакции. Мне удается показать все элементы html с помощью плагина html -react-parser, но мои переменные отображаются как строка {data.title}.

const Template = ({templateData}) => {

    const [data, setData] = useState({
        title: 'Some title',
        description: 'Some description'                    
    })

    return(
        <Fragment>
            {HtmlParser(templateData)}
        </Fragment>
    )
};

Компилируется в:

<div>
    <div class="title">{data.title}</div>
    <div class="description">{data.description}</div>
</div>

Требуемый результат:

<div>
    <div class="title">'Some title'</div>
    <div class="description">'Some description'</div>
</div>

РЕДАКТИРОВАТЬ: найдено решение, но оно не выглядит хорошим :) Я заменил строки переменной.

   HtmlParser(templateData
                 .replace(/{data.title}/g, data.title)
                 .replace(/{data.description}/g, data.description))