Svelte Doc: Missing proper example for createUtils()

[Extarys]

Page: https://ap0nia.github.io/eden-query/eden-query/svelte/createUtils.html

The page talks about "Eden-Query Hooks" and show an example, but I think that example was a copy-paste error.

I expected to find an example on how to set up and use createUtils() outside components.

At the bottom of the page, in the "Helper" section:

Much like useUtils, createUtils gives you access to same set of helpers. The only difference is that you need to pass in the queryClient and client objects.

I then realized that the first argument needs an object containing queryClient a client from +layout.ts.

I would suggest to rework the examples to be a bit more precise. <3

[ap0nia]

Yes, let me take a look at that.

Technical Details

createUtils and setContext are intended to take the same arguments. Aside from thinking about better naming conventions, the logic is kinda like this:

import { setContext } from 'svelte'

function edenSetContext(props) {
  const context = edenCreateContext(props)
  setContext(context)
}

function edenCreateContext(props) {
  const { queryClient, client } = props

return {
    doSomething: () => {
      queryClient.fetchQuery({
        queryFn: () => client.query()
      })
    }
  }
}

The main idea being that eden.setContext would be used within Svelte components to "cache" helpers that utilize the given eden client and query-client.

Sometimes you need to be able to use these utilities outside of a component, so you can create these helper functions without calling svelte's setContext (this would fail outside of a component).

A good use-case for this is if you want to pre-fetch queries as the examples demonstrate.