cube icon indicating copy to clipboard operation
cube copied to clipboard

Duplicate requests aren't caught with useCubeQuery when making POST requests

Open ArunrajAdlee opened this issue 2 years ago • 1 comments

Describe the bug With the useCubeQuery hook, there exists a function useDeepCompareMemoize which compares the queries to determine if the useEffect within the hook to make a request is trigged.

This works well to avoid unnecessary GET requests on component re-renders where the query doesn't change.

However, for POST requests, the following condition always evaluates to false because the reference to the cubejsApi object is modified to apply the 'Content-Type': 'application/json' header.

In hook useDeepCompareMemoize within deep-compare-memoize.js

  if (!equals(value, ref.current)) {
    ref.current = value;
  }

So when a new query comparison is made, value won't have the 'Content-Type': 'application/json' while ref.current will.

To Reproduce Steps to reproduce the behavior:

  1. Create a cube backend
  2. Create a frontend component utilizing useCubeQuery
  3. Trigger a POST request by make a request with a URL with length > 2000
  4. Re-render the component without modifying the query passed to useCubeQuery
  5. Notice that a new request is made even though the query hasn't changed

Expected behavior As with GET requests, duplicate requests are ignored after comparison in useDeepCompareMemoize. Since cubejs internally handles swapping to POST requests, it should handle duplicate requests like it does with GET requests

Screenshots When comparing two exact equivalent queries:

Screen Shot 2021-09-21 at 11 30 45 AM Screen Shot 2021-09-21 at 11 31 04 AM

Note:ref.current is set to value but even on subsequent re-renders the ref will have been modified to include the 'Content-Type': 'application/json' header.

Version: "@cubejs-client/core": "0.28.25", "@cubejs-client/react": "0.28.25",

Additional context Current workaround is to simply add the Content-Type header in the cubejsApi instantiation

   headers: {
      'Content-Type': 'application/json',
   }

ArunrajAdlee avatar Sep 21 '21 15:09 ArunrajAdlee

If you are interested in working on this issue, please leave a comment below and we will be happy to assign the issue to you. If this is the first time you are contributing a Pull Request to Cube.js, please check our contribution guidelines. You can also post any questions while contributing in the #contributors channel in the Cube.js Slack.

github-actions[bot] avatar Aug 08 '22 11:08 github-actions[bot]