Correct way of fetch with query?

import { useQuery } from "@tanstack/react-query";
import axios from "axios";

const fetchData = async (query) => {
  const response = await axios.get(`http://localhost:3000/?q=${query}`);
  return response.data;
};

export const useFetchData = (query) => {
  return useQuery(["users"], fetchData(query));
};

import { useQuery } from "@tanstack/react-query";
import axios from "axios";

const fetchData = async (query) => {
  const response = await axios.get(`http://localhost:3000/?q=${query}`);
  return response.data;
};

export const useFetchData = (query) => {
  return useQuery(["users"], fetchData(query));
};