И пытаюсь вызвать ее из pushForm()
это против
правил, хуки должны жить на верхнем уровне в компонентах или же других(кастомных) хуках.
В вашем случае, как один из вариантов, логику обработки формы можно вынести в кастомный хук. Затем использовать его в LoginUser.
Приблизительная структура:
// Custom hook
export const useAuthHandler = () => {
const [token, setToken] = useState(null);
useEffect(() => {
if (token) { // чтобы не диспатчить с начальным null на первом рендере
// диспатчим экшн с полученным токеном
}
}, [token]); // будет следить за token
return () => { // возвращаем функцию-обработчик
// запрашиваем токен, в then вызываем setToken(token)
};
};
// Component
export default function LoginUser() {
const handleSubmit = useAuthHandler();
return (
<div>
<form id="auth_form">
{/* ... */}
<Button autofocus="true" onClick={handleSubmit}>Авторизоваться</Button>
</form>
</div>
);
};