Custom hook in react query for managing data logics

[rajivchaulagain]

Hey everyone I am using react-query and it is very good library.So I need an suggestion as I want to separate UI layer and data fetching , data logics.

so for that I think creating custom hook would be a great idea and I created something like this

import { useQuery } from "react-query";

import {popularProperty } from "../../services/api";

const useProperty = () => {

    const popularProperties = useQuery('popular-properties', popularProperty);

    return { popularProperties }
}

export default useProperty;

Is this right approach???

[TkDodo]

sure, creating custom hooks is a good abstraction. Just be aware that if you only need one of the two hooks, they would still both be executed. I would probably make a separate usePopularProperties and a useFeaturedProperties custom hook, then call them both here.

If they are always used together, then why is it two separate queries 😅 ?