Redirect после оправки формы React router 6.3.0

Не получается сделать редирект после отправки формы window.location.pathname = "/profile" не катит, как сделать без перезагрузки страницы?

import { UseNavigate } from "react-router-dom";

const ChangeAvatar = () => {

let navigate = UseNavigate()

const {
    register,
    handleSubmit,
} = useForm()

const fileReader = new FileReader();
fileReader.onloadend = () => {
    setImageURL(fileReader.result);
}

const onChange = (e) => {
    if (e.target.files && e.target.files.length) {
        const file = e.target.files[0];
        fileReader.readAsDataURL(file)
        setFile(file);
    }
}

 const onSubmit = async (data) => {
    const file = data.file[0]
    const formData = new FormData()
    formData.append('file', file || file1)
    try {
        await api.settings.changeAvaUser(formData);
        navigate('/profile')
        window.location.href = "/profile";
    } catch (e) {
        console.error(e)
    }
}