React Query is not making any requests

React query is not making any requests, neither useQuery or UseMutation.

Made a single component to test why I couldn’t send requests to a server, I’m following the documentation and yet nothing seems to work. I must emphasize that axios by itself is sending requests and the server is responding as expected, it is React Query in particular that is giving me trouble.

Testing code I made:

import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { useMutation } from "@tanstack/react-query";
import axios from "axios";
import { useEffect } from "react";

function App() {
  const queryClient = new QueryClient();

  const Test = () => {
    const msg = "ok";
    const mutation = useMutation({
      mutationFn: () => {
        axios.post("/api/test", msg);
      },
    });

    useEffect(() => {
      mutation.mutate();
    }, []);

    return (
      <div>
        <h1>This is a test</h1>
      </div>
    );
  };

  return (
    <div>
      <QueryClientProvider client={queryClient}>
        <Test />
      </QueryClientProvider>
    </div>
  );
}

export default App;