Unhandled promise rejection: Error: Invalid hook call. Hooks can only be called inside of the body of a function component

So, i have this component SidebarMenu from the drawerContent of Drawer.Navigator

    const SidebarMenu: React.FC<SidebarMenuProps> = (props) => {      return (<View style={{ flex: 1 }}><DocenteMenu /><DrawerContentScrollView {...props}><View style={styles.itemContent}><MenuItem label="Home" icon="home" pageName="Home" {...props} /><MenuItem label="Chamada eletrônica" icon="edit" pageName="CallList" {...props} /><MenuItem label="Horário aula" icon="calendar" pageName="ClassSchedule" {...props} /><MenuItem label="Diário eletrônico" icon="book-open" pageName="ClassDiary" {...props} /><MenuItem label="Agendamento prova" icon="file-plus" pageName="TestSchedule" {...props} /><MenuItem label="Relação de alunos" icon="users" pageName="StudentsList" {...props} /><MenuItem label="Holerite" icon="file-text" pageName="Payslip" {...props} /></View></DrawerContentScrollView><View style={styles.logoutContent}><MenuItem label="Sair" icon="log-out" /></View></View>      );    }    export default SidebarMenu;

and I'm trying return a view from component DocenteMenu but its in that moment who returns a error. I alredy try to transform this function into "export default function" and return same error

interface TeacherProps {  COD_FUNCIONARIO: string,  NOME_FUNC: string;  DTA_NASC: Date;  CPF: string;  FOTO: string;}const DocenteMenu = () => {  const [user, setUser] = useState<TeacherProps | null>();  useEffect(function setUserProps() {    const {docente} = useAuth();    setUser(docente);  }, []);  return(<View style={styles.teacherInfo}><Image        style={styles.avatar}        source={{ uri: user?.FOTO }}      /><Text style={styles.teacherName}>{user?.NOME_FUNC}</Text><Text style={styles.teacherCode}>{user?.COD_FUNCIONARIO }</Text></View>  );}export default DocenteMenu;