Puede renderizar conditionally su componente.

Ejemplo :

EmployeeManagement.js

 const EmployeeManagement = () => { .... return ( <div> EmployeeManagement </div> ); }

Gestión de usuarios.js

 const UserManagement = () => { const [hasRender, setRender] = useState(false); const onShow = React.useCallback(() => setRender(true), []); return ( <> <button onClick={onShow}>Show Employee Management</button> {hasRender && <EmployeeManagement />} </> ) }

use un estado visible y actívelo onClick:

 const [visible, setVisible] = useState(false) onClick = () => {setVisible(true)}

luego renderízalo así:

 {visible && <EmployeeManagement onClick={onClick} />}

Una forma de hacer esto sería agregar un estado local en UserManagement ,
que contiene una indicación de valor boolean si el componente debe ocultarse o mostrarse.

Entonces tendrás algo como:

 function UserManagement() { const [compIsShown, setCompIsShown] = useState(false); return ( // Whatever else you're rendering. <button onClick={() => setCompIsShown(true)}>...</button> {compIsShown && <OtherComp />} ) }

Lo que sucederá es que compIsShown se inicializará como falso,
por lo que esta condición compIsShown && <OtherComp /> evitará que se represente.
Luego, cuando haga clic en el botón, el estado se establecerá, provocando una nueva representación, excepto que ahora la condición será verdadera, por lo que se representará <OtherComp> .

Hay otras maneras de hacer esto.
Depende principalmente del caso de uso.