useParams возвращает undefined router v6

Вот мое приложение, которое генерирует Роуты через routesConfig

import { Route, Routes } from "react-router-dom";
import routesConfig from "@routes/routesConfig";
import Header from "@components/Header";

import styles from './App.module.css';

const App = () => {
    return (
        <> 
            <div className={styles.wrapper}>
                <Header />

                <Routes>
                    {routesConfig.map((route, index) => (
                        <Route 
                            key={index}
                            exact={route.exact}
                            element={route.element()} 
                            path={route.path}
                        />
                    ))}
                </Routes>
            </div>
        </>
    )
}

export default App;

Сам конфиг с Роутами

import HomePage from '@containers/HomePage';
import PeoplePage from '@containers/PeoplePage';
import PersonPage from '@containers/PersonPage';
import NotFoundPage from '@containers/NotFoundPage';

const routesConfig = [
   {
      path: '/',
      element: HomePage
   },
   {
      path: '/people',
      element: PeoplePage
   },
   {
      path: '/people/:id',
      element: PersonPage
   },
   {
      path: '/not-found',
      element: NotFoundPage
   },
   {
      path: '*',
      exact: false,
      element: NotFoundPage
   }
]

export default routesConfig;

На странице PersonalPage я хочу получить ID страницы, но useParams возвращает undefiend

import PropType from 'prop-types';
import { useParams } from 'react-router-dom';
import styles from './PersonPage.module.css';

const PersonPage = ( ) => {

    const {getId} = useParams();
    console.log(getId);

    return (
        <>
            <h1 className={styles.title}>Person Page - {getId} </h1>
        </>
    )
}

PersonPage.prototype = {
    // 
}

export default PersonPage;

Знакомый сказал, что это может быть из-за того что я передаю

element={MyComponent()}, 

а надо передавать

element={ <MyComponent />},

но как это реализовать в переборе Map я не знаю. С проблемой столкнулся проходя курс на YouTube, сам только учусь, потому у вас помощи