{ Apollo-client, React, Grapgql } What Is Good Way Handle Multiple Loadings?

i am using react and apollo-client with graphql on Node.js
i have component which call three Query

so i have three loading like this

function MyComponent({
  IsLoggedIn: { auth: { isLoggedIn } = {}, loading } = {},
  GetUserInfo: { GetMyProfile: { user } = {}, loading: loading2 } = {},
  lastSelectedHouse: { auth: { lastSelectedHouse } = {}, loading: loading3 } = {},
}) (
{ (!loading && !loading2 && !loading3) ? <MyComponent {...props} > : "loading"  }
)

export default compose(
  graphql(SELECTED_HOUSE, { name: 'lastSelectedHouse' }),
  graphql(IS_LOGGED_IN, { name: 'IsLoggedIn' }),
  graphql(GET_USER_INFO, {name: 'GetUserInfo'})
)(JDmiddleServer);

i don't wan't handle three loading how can i combine theme?

here is my Queries

export const IS_LOGGED_IN = gql`
  {
    auth {
      isLoggedIn @client
    }
  }
`;
export const SELECTED_HOUSE = gql`
  {
    auth {
      lastSelectedHouse @client {
        label
        value
      }
    }
  }
`;

export const GET_USER_INFO = gql`
  query {
    GetMyProfile {
      user {
        _id
        name
        phoneNumber
        password
        email
        isPhoneVerified
        checkPrivacyPolicy
    }
  }
`;

Yes. two Query is for @client and one is for @server is it possible merge these Queries?

Yes, it's possible to combine the queries even though one is for the server and two for the client.

Something like this should work:

export const GET_USER_INFO = gql`
  {
    auth {
      isLoggedIn @client
      lastSelectedHouse @client {
        label
        value
      }
    }
  }
  query {
    GetMyProfile {
      user {
        _id
        name
        phoneNumber
        password
        email
        isPhoneVerified
        checkPrivacyPolicy
    }
  }
`;

Depending on your schema and resolvers you should be able to design something like below which would be better.

Check the docs for combining queries: https://www.apollographql.com/docs/link/links/state.html#combine

export const GET_USER_INFO = gql`
  query {
    GetMyProfile {
      user {
        isLoggedIn @client
        lastSelectedHouse @client {
            label
            value
        }
        _id
        name
        phoneNumber
        password
        email
        isPhoneVerified
        checkPrivacyPolicy
    }
  }
`;