I intend to transfer this code that I found in a version prior to 6 in which Switch was still used to another with version 6.3.0 that I expose below and it returns me the following error:

!! Matched leaf route at location "/admin" does not have an element. This means it will render an with a null value by default resulting in an "empty" page.

and I can't render the component, I would appreciate a hand, thank you very much

import { BrowserRouter as Router, Routes, Route } from "react-router-dom";

const routes = [
  {
    path: "/admin",
    element: <LayoutAdmin/>,
    routes: [
      {
        path: "/admin",
        element: <AdminHome/>,
      },
      {
        path: "/admin/login",
        element: <AdminSignIn/>,
      },
    ],
  },
];

function App() {
  return (
    <Router>
      <Routes>
        {routes.map((route, index) => (
          <RouteWithSubRoutes key={index} {...route} />
        ))}
      </Routes>
    </Router>
  );
}

function RouteWithSubRoutes(route) {
  console.log(route);
  return (
<Routes>
<Route path={route.path} render={(props) => <route.element routes={route.routes} {...props} />} />
</Routes>
  )
}

export default App;