Router doesn't work

Forge Forge UI Kit and Custom UI
, ,
1

I am trying to present the user with different Globale pages to do different categories of actions.
as a test, I want to show two pages, one for /home and one for /. When I try to open any of the pages, I get a blank page, no text and the following error on the browser console :

TypeError: a is undefined
    G index.js:1182
    Nn react-reconciler.production.min.js:81
    wi react-reconciler.production.min.js:199
    Ki react-reconciler.production.min.js:189
    Gi react-reconciler.production.min.js:189
    Wi react-reconciler.production.min.js:189
    Mi react-reconciler.production.min.js:182
    Zt react-reconciler.production.min.js:41
    Ti react-reconciler.production.min.js:175
    updateContainer react-reconciler.production.min.js:231
    render reconciler.js:217
    3394 index.jsx:31

Here is my index.jsx file :

import React, { Fragment, useEffect, useState } from 'react';
import ForgeReconciler, { Text } from '@forge/react';
import { Router, Route, Routes } from "react-router";
import Home from './home.jsx'

//<Route path="/home" element={<Home />}><Home /></Route>
const App = () => {
  console.log("App has been called")

  return (
    <>
    
      <Routes>
        <Route exact path="/" element={<Fragment><Text>This is the root /</Text></Fragment>}>

        </Route>
        <Route path="/home" element={
          <Fragment>
            <Home>This is /root</Home>
          </Fragment>
        }>
        </Route>
      </Routes>
    </>
    
  );
};
ForgeReconciler.render(
  <React.StrictMode>
    <Router>
     <App />
    </Router>
  </React.StrictMode>
);

image

Any one has an idea why this happens ? Am I correctly using the router ? thank you all for your help !