quickest-silver

Quick question about key equality and using it with gql

This might be obvious based on the docs:

As long as the query key is serializable using JSON.stringify

Does this mean they are checked via the JSON serialised version for equality? So if I did:

  const { data, refetch } = useSuspenseQuery({
    queryKey: [CharactersDocument, { name }] as const,
    queryFn: ({ queryKey: [, { name }] }) => {
      console.log("🔄 Query function called for characters", { name });
      return graffle.gql(CharactersDocument).send({ name });
    },
  });

  const { data, refetch } = useSuspenseQuery({
    queryKey: [CharactersDocument, { name }] as const,
    queryFn: ({ queryKey: [, { name }] }) => {
      console.log("🔄 Query function called for characters", { name });
      return graffle.gql(CharactersDocument).send({ name });
    },
  });

This would be perfectly acceptable and work as expected?

6 Replies

quickest-silverOP•3mo ago

I'm trying to make a generic wrapper like so:

export function useSuspenseQueryGQL<T, A>(
  doc: TadaDocumentNode<T, A>,
  args: A,
  opts: any,
) {
  return useSuspenseQuery({
    queryKey: [doc, args] as const,
    queryFn: ({ queryKey: [doc, args] }) => graffle.gql(doc).send(args),
    ...opts,
  });
}

export function useSuspenseQueryGQL<T, A>(
  doc: TadaDocumentNode<T, A>,
  args: A,
  opts: any,
) {
  return useSuspenseQuery({
    queryKey: [doc, args] as const,
    queryFn: ({ queryKey: [doc, args] }) => graffle.gql(doc).send(args),
    ...opts,
  });
}

but its late and I am tired

national-gold•3mo ago

I believe there used as keys for a Map

national-gold•3mo ago

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#key_equality

MDN Web Docs

Map - JavaScript | MDN

The Map object holds key-value pairs and remembers the original insertion order of the keys. Any value (both objects and primitive values) may be used as either a key or a value.

national-gold•3mo ago

I think if it was me, I do some work to extract a shorter key (Probably means Id just dive into the Apollo codebase and reverse engineer that

national-gold•3mo ago

Actually uqrl is a better place to look; Apollo is normalised cache so they don't deal with keys the same way query does. Uqrl however does and they have some nice docs on how it works https://nearform.com/open-source/urql/docs/basics/document-caching/#operation-keys

urql Documentation

A highly customisable and versatile GraphQL client.

optimistic-gold•3mo ago

we hash the key with the queryKeyHashFn, and that uses JSON.stringify on the key itself. So if you have something inside the key that isn't json serializable, you have to provide your own queryKeyHashFn

Gaming

Programming

Quick question about key equality and using it with gql

Did you find this page helpful?