Hi, useSWR basic key and passing data to fetcher

[3pleFly]

Currently using composite key and this is the resulting cache when run with different query parameters:

I am using a composite key:
const { data, mutate } = useSWRImmutable<IPosition[]>([NEW_SITE_API.POSITIONS, queryString]);

Maybe I don't understand but this seems like a huge memory problem in the long term, since the cache will also live forever.

So how do you pass query params to the fetcher? I have tried:

1. Pass the query params from outside the fetcher function:

let cachedQueryString = '';
export const usePositions = (queryString: string) => {
const { data, mutate } = useSWRImmutable<IPosition[]>(NEW_SITE_API.POSITIONS,
{
fetcher: (url) => getPositions(url + queryString),
errorRetryCount: 0,
}
);

if(queryString !== cachedQueryString) mutate();

return { data, mutate };
};

You can't do this because once the hook won't pass new instances of queryString to the fetcher, basically the same fetcher function with the same parameters will always run

[3pleFly]

No solution yet,
Since my requirement is for query string, the fetcher function just grabs it directly from the url, instead of receiving it as a parameter. The obvious downside here is that I have to manually call mutate() to trigger an update, instead of telling SWR my dependencies ( a string in this case) and it revalidating for me.

(but again then SWR generates more cache entries using different queries as keys)
Waiting for more help :)