Rerun loader dependent on global state

[JoakimGit]

I have a zustand store with some global filters, like a selected destination. When the user navigates to '/booking' the loader function fetches bookings based on this filter.

loader: async ({ context }) => {
    const destinationId = useAppFilterStore.getState().destination?.id;    
    await context.queryClient.ensureQueryData(bookingQueries.bookings(destinationId));
  },

If the user changes the selected destination to something else, I'd like to rerun the loader, so I tried adding the loaderDeps property like this:

loaderDeps() {
    const destinationId = useAppFilterStore.getState().destination?.id;
    return { destinationId }
}

loader: async ({ context, deps }) => {
    const destinationId = deps.destinationId; // contains the value, but gives ts error as deps is {} according to typescript
    await context.queryClient.ensureQueryData(bookingQueries.bookings(destinationId));
  },

The problem is that this doesn't rerun when a new filter value is set. What's the best way to solve this?