En un componente funcional, quiero acceder a los accesorios heredados del componente funcional principal. Para tener una idea de lo que quiero decir, tengo el siguiente fragmento:

 function MainApp(props) { const { classes } = props; const [content, setContent] = useState(""); return ( <div className={classes.root}> <AppBar position="fixed" className={classes.appBar}> <Toolbar className={classes.toolbar}> <Typography variant="title" color="inherit" fontWeight="bold"> CashCo </Typography> <ToolbarActions className={classes.toolbarActions} /> </Toolbar> </AppBar> <main className={classes.appContent}> <PageContent content={content} /> </main> </div> ); } function App(props) { return ( <BrowserRouter> <Routes> <Route path="/" element={<MainApp />}></Route> </Routes> </BrowserRouter> ); }

Quiero pasar el argumento props en la función App() a MainApp(), de modo que no tenga que acceder a propiedades como props.props.some_property . ¿Cómo puedo hacer eso correctamente? Porque pasar accesorios como este <MainApp props={props} /> significa que tengo que acceder a propiedades como props.props.some_property en MainApp(), eso no es lo que quiero. Quiero acceder a los accesorios como props.some_property en MainApp().