I want to check if my button takes the user to the home page, but I’m having trouble mocking the useNavigate function from “react-router”

This is what I am using to mock the funcion:

const mockNavigate = vi.fn();
vi.mock("react-router", async () => {
    const actual = await vi.importOriginal();

    return {
        ...actual,
        useNavigate: mockNavigate
    }
})

The test:

    it("should take the user to the home page", async () => {
        renderElement();

        const homeBtn = screen.getByRole("link");
        await userEvent.click(homeBtn)
        expect(mockNavigate).toHaveBeenCalledWith("/")
    })

This returns the error: Assertion error: expected "spy" to be called with arguments: [ '/' ]

I tried swapping the last function toHaveBeenCalledWith("/") with toHaveBeenCalledOnce(), but I get the error AssertionError: expected "spy" to be called once, but got 0 times