- Make sure namespaced Open Graph and
fb:app_id
meta data renders the correct attributes on<meta>
tags (#4445)
- Ignore pathless layout routes in action matches (#4376)
- You can now infer the type of the
.data
property ofuseFetcher
from the return type of yourloader
andaction
functions (#4392) - Fixed a bug in
<Form>
that prevented the correct method from being called with non-POST
submissions (b52507861
)
- Ensure that
<Form />
respects theformMethod
attribute set on the submitter element (#4053)
- Remove unused
type-fest
dependency (#4246) - Preserve
?index
for fetcher get submissions to index routes (#4238)
- Properly locked the dependency on
react-router-dom
to version 6.3.0 (#4203) - Fixed a bug with
GET
form submissions to ensure they replace the current search params, which tracks with the browser's behavior (#4046)
- We've added a new type:
SerializeFrom
. This is used to infer the (#4013) JSON-serialized return type of loaders and actions.
- Unblock hydration via async module scripts. (#3918)
- Previously, if an
action
was omitted from<Form>
oruseFormAction
, the action value would default to"."
. This is incorrect, as"."
should resolve based on the current path, but an empty action resolves relative to the current URL (including the search and hash values). We've fixed this to differentiate between the two, meaning that the resolved action will preserve the full URL. (#3697) - Enhanced some types to work more seamlessly with React 18 (#3917)
- Added a subscribe method to the transition manager, which allows subscribing and unsubscribing for React 18 strict mode compliance (#3964)
- Fix inferred types for
useLoaderData
anduseActionData
to preservenull
value types (#3879)
- Allow the
ReadonlyArray
type inSerializeType
for action and loader data (#3774) - Support undefined unions as optional keys in types returned from
useLoaderData
anduseActionData
(#3766)
-
We enhanced the type signatures of
loader
/action
anduseLoaderData
/useActionData
to make it possible to infer the data type from return type of its related server function.To enable this feature, you will need to use the
LoaderArgs
type from your Remix runtime package instead of typing the function directly:- import type { LoaderFunction } from "@remix-run/[runtime]"; + import type { LoaderArgs } from "@remix-run/[runtime]"; - export const loader: LoaderFunction = async (args) => { - return json<LoaderData>(data); - } + export async function loader(args: LoaderArgs) { + return json(data); + }
Then you can infer the loader data by using
typeof loader
as the type variable inuseLoaderData
:- let data = useLoaderData() as LoaderData; + let data = useLoaderData<typeof loader>();
The API above is exactly the same for your route
action
anduseActionData
via theActionArgs
type.With this change you no longer need to manually define a
LoaderData
type (huge time and typo saver!), and we serialize all values so thatuseLoaderData
can't return types that are impossible over the network, such asDate
objects or functions. -
Add
WebSocket
reconnect toLiveReload