How toAccess location.state in Remix loaders and actions

The History State is an object we can set when doing a client-side navigation and that the browser will give us back on the new route, it's a great tool to pass data from one route to another in Remix.

Typically you use it by setting <Link state> and then access it with useLocation().state.

But if you want to access it inside a loader function there's no way because this object is a client-side only API. However with the introduction of clientLoader and clientAction this change, we could now access it inside our client and server loaders.

export async function clientLoader(args: ClientLoaderFunctionArgs) {
  let state = window.history.state;
  // do something with state here
}

And the same thing happens with clientAction.

export async function clientAction(args: ClientActionsFunctionArgs) {
  let state = window.history.state;
  // do something with state here
}