TanStackT
TanStack•15mo ago•
45 replies
brilliant-lime

setQueriesData doesn't match query

Hello people,

So uh I wanted to have multi-sorting in a table and the order of the sorting keys is important for my api so I pretty much stole your function and did something like this:

export const hashKey = (queryKey: QueryKey | MutationKey): string => {
  return JSON.stringify(queryKey, (keyName, val) => {
    if (_isPlainObject(val)) {
      if (keyName === 'sorting') {
        return Object.keys(val).reduce((result, key) => {
          result[key] = val[key];
          return result;
        }, {} as any);
      } else {
        return Object.keys(val)
          .sort()
          .reduce((result, key) => {
            result[key] = val[key];
            return result;
          }, {} as any);
      }
    } else {
      return val;
    }
  });
};

And then used it as a queryKeyHashFn.

The problem is that when I try to do queryClient.setQueriesData it doesn't match it when sorting keys order differs.

I checked a lil bit the source code and seems like it uses this function 
export function matchQuery(
  filters: QueryFilters,
  query: Query<any, any, any, any>,
): boolean { ... }


queryClient.setQueriesData(
        { queryKey: [TABLE_QUERY_KEY, CREW_SEAMEN_TABLE_KEY], exact: false },
        (cachedData: { data: CrewSeaman[] } | undefined) => {
          console.log('cachedData', cachedData);
          console.log('updatedSeaman', updatedSeaman);
          if (!cachedData || !cachedData.data.length) return cachedData;

          return {
            ...cachedData,
            data: cachedData.data.map(seaman =>
              seaman.id === updatedSeaman.id ? { ...updatedSeaman, active: !seaman.active } : seaman
            )
          };

Here is and how I call it.

I suppose the only difference is the isPlainObject where I used the lodash's one. Idk if that's the problem
Was this page helpful?