Esta es mi app.js donde están todas las rutas

 <Layout> <Router> <Routes> <Route exact path="/" element={<Home />} /> <Route element={<PrivateRoute />}> <Route exact path="/dashboard" element={<Dashboard />} /> <Route exact path="/video" element={<Video />} />] </Route> <Route exact path="/login" element={<Login />} /> </Routes> </Router> </Layout>

Este es mi componente de diseño

 export default class Layout extends Component { render() { return ( <div> <Router> <Header /> </Router> {this.props.children} </div> ); } }

entonces tengo dos preguntas

1. Pude usar useNavigate en Header ya que no estaba rodeado por el <Router> pero después de usarlo funciona. Entonces, ¿hay alguna manera mejor de hacer esto?
2. Necesito renderizar condicionalmente porque no quiero que esté en la página de inicio de sesión.

¡Ayuda por favor!