Struggling with load function and cache revaliation

[patent arrow]

Hey All,
I'm new to solid and am struggling with getting cache revalidation to work with a load function. I've tried to follow the docs as closely as I can, but my load function (and subsequent network request) never seems to get called again.

I'm trying to build a basic component that will refetch data filtered based on a selection the user makes:

function Dashboard(props) {
  const data = createAsync(() => props.data);

  return (
        <select
          onChange={(event) => {
            const queryParams = new URLSearchParams(window.location.search);
            queryParams.set("user", event.target.value);
            history.replaceState(null, "", "?" + queryParams.toString());
            revalidate(); // revalidate(getOverviewData.key) also didn't seem to work
            revalidate();
          }}
        >
          <For each={data()?.users ?? []}>
            {(user) => {
              return <option value={user.id}>{user.name}</option>;
            }}
          </For>
        </select>
  );
}

props.data comes from the load function for the component, which looks like this:

const getOverviewData = cache(async (userId) => {
  let url = `http://127.0.0.1:8000/overview/user=${userId}`;
  const response = await fetch(url);
  const data = await response.json();
  return data;
}, "dashboard");

function loadOverview(input) {
  const params = new URLSearchParams(input.location.search);
  return getOverviewData(params.get("user") ?? "");
}

// and is then used here in the route for the component
<Route path="/dashboard" component={Dashboard} load={loadOverview} />

Any ideas on where I'm going wrong would be greatly appreciated ❤️

[deep gate]

The load function is just there to load the data you need into the cache.
In your component you just use createAsync and call the cached getOverviewData.
You can use the useUrlSearchParams before createAsync to get the userId.
It will then load the data automatically from the cache.
Here‘s the example from the docs https://docs.solidjs.com/solid-router/reference/data-apis/cache

[patent arrow]

So you're saying I shouldn't use the load function?

Ah I think I get it now. So there's not really a built in way to re-run the load function for a route, I just need to call the function returned from cache again manually...I think?

[deep gate]

Use the load function as you did. And in the Dashboard component

const [search, setSearch] = useSearchParams();

const data = createAsync(()=>getOverviewData(search.user);

[patent arrow]

Ahhh I see

So no need to use props.data bascially

And just use use the fn directly

Got it, I'll try this. Thank you!!