Apollo client fetchPolicy issues - query called twice

Viewed 3325

I'm using @apollo/client 3.2.0 with react. I have a component that retrieves the data using the useQuery hook. The query looks similar to this one:

query getChartData($year: Int!, $type: String!) {
  first_series_data(kpi: "SOME_KPI", year: $year, orderBy: "week", type: $type) {
    edges {
      node {
        value
        week
      }
    }
  }
  second_series_data(kpi: "SOME_KPI", year: $year, type: $type) {
    edges {
      node {
        date
        value
      }
    }
  }
}

As you can see in the query, I have two variables: year and type. Both are passed as props in the component and this component is rendered twice in the same view, with a different type prop.

The problem that I have is related to the fetchPolicy option. If I'm using one of cache-and-network or network-only fetch policies, one of the queries is called twice. This doesn't happen when I use no-cache. So I think it's a cache conflict, because the queries are similar, but I'm not sure and I don't know how to fix this.

Do you have any ideas?

1 Answers
Related