HTML внутри пользовательского интерфейса материала Аккордеон

Я пытаюсь отображать HTML-контент внутри аккордеона.

import {Accordion, AccordionDetails, AccordionSummary, Typography} from '@material-ui/core';
import { Badge } from 'reactstrap';

...

const buildAccordion = (f, i) => {
    return (
        <Accordion expanded = {expanded === `panel${i}`} onChange = {handleChangeEvent(`panel${i}`)}>
            <AccordionSummary aria-controls = {`panel${i}d-content`} id = {`panel${i}d-header`}>
            <Typography>{f.Question}</Typography>
            </AccordionSummary>
            <AccordionDetails>
            <Typography>
                <Badge color = "primary">Answer</Badge>
                <p>
                    {f.Answer}
                </p>
            </Typography>
            </AccordionDetails>
        </Accordion>
    );
}

Однако, когда я визуализирую, мой f.Answer показывает: Steps to log in and create your account: <br><br> 1. Go to <a href = "https://mysite/" target = "_blank">https://mysite/</a> to access the login page <br>

Почему теги html отображаются как строки?