Cant use React Icons component as an object value typescript

I am developing a personal website using typescript and react, and for my footer, I am mapping through an array of objects which each have a url property, as well as an icon property. The Icon property is supposed to have multiple different React Icons as the value, so that through each iteration, I can display a different Icon. When I originally implemented this in javascript, my code worked just fine, but after switching my codebase over to typescript, I am presented with this error:

"Parsing error: '>' expected.eslint 'FaGithub' refers to a value, but is being used as a type here. Did you mean 'typeof FaGithub'?ts(2749)"

This is the typescript implementation that I have so far. I have tried removing the angled brackets, and that eliminates the error, but I am unable to actually display the icon when mapping through the array. I would really appreciate any advice.

const socialIcons: { icon: IconType, url: string }[] = [
    {
        icon: <FaGithub />,
        url: "./"
    },
    {
        icon: <FaLinkedin />,
        url: "./"
    },
    {
        icon: <FaTwitter />,
        url: "./"
    },
    {
        icon: <FaInstagram />,
        url: "./"
    },
    {
        icon: <FaFacebook />,
        url: "./"
    },
]

{socialIcons.map((icons, index) => {
                    const {icon, url} = icons;
                    return (
                        <a href={url} key={index} target="_blank" rel="noopener noreferrer">
                            {icon}
                        </a>
                    );
                })}

This is how the socialIcons array originally looked in regular javascript.

const socialIcons = [
    {
        icon: <FaGithub />,
        url: "./"
    },
    {
        icon: <FaLinkedin />,
        url: "./"
    },
    {
        icon: <FaTwitter />,
        url: "./"
    },
    {
        icon: <FaInstagram />,
        url: "./"
    },
    {
        icon: <FaFacebook />,
        url: "./"
    },
]

I figured out a solution, all I needed to do was change the file extension from .ts to .tsx, and make the type of the value a JSX.Element to input react components as values within objects without a typescript compiler error.