Recursive Forever Menu!

Hi I am currently trying to create a recursive forever menu, I need to read through the menu in such away that no matter the depth of a object, eg. object.link > object.links > object.link it can read into.

My final result is to create a drop down side menu.

const [menu, setMenu] = useState([
        {
            name: "Customers",
            desc: "A description of the side bar.",
            src: "icons8-collect-64.png",
            open: false,
            links: [
                {
                    name: 'Students',
                    url: 'www.google.com',
					links: [
{
						name: 'create',
						url: 'some url',
}
]
                },
                {
                    name: 'Parents',
                    url: 'www.google.com',
                },
            ]
        },
        {
            name: "Creativity",
            desc: "A description of the side bar.",
            src: "icons8-collect-64.png",
            open: false,
            links: [
                {
                    name: 'Projects',
                    url: '/projects',
                    open: false,
                    links: [
                        {
                            name: 'Project 1',
                            url: '',
                        },
                        {
                            name: 'Project 2',
                            url: '',
                        },
                        {
                            name: 'Project 3',
                            url: '',
                        },
                    ],
                },
                {
                    name: 'Pictures',
                    url: '/pictures',
                },
                {
                    name: 'Poems',
                    url: '/poems',
                },
                {
                    name: 'Stories',
                    url: '/stories',
                },
            ]
        },
    ]);