Как создать динамическое имя компонента в Реакте?

Question

[Nikita Shchypylov]

Всем привет
Собственно, хочу динамически создавать компоненты с иконками
Вот как это выглядит :
импорт иконки сверху:

import {Dashboard as MdDashboard}  from "react-icons/lib/md/dashboard"

вывод в map:

const content = sidebar ? (
      sidebar.map((element, index) => {
        return (
          <li key={index}>
            <div className="icon">
            //тут вывод
            </div>
            <a href="#">{element}</a>
          </li>
        );
      })
    ) : (
      <div>Loading, please, waits</div>
    );

Собственно, нужно что то вроде такого

<div className="icon">
<{element} />
</div>

Но мне отдает ошибку. Как можно тут это провернуть? {element} совпадает с алиасом в импорте

И это на сработало :(

<div className="icon">
                  {React.createElement(
                      element,
                      {size: 14}
                  )} 
                </div>