Commits on Sep 13, 2023

1. useFormState: Reuse state from previous form submission …

   If a Server Action is passed to useFormState, the action may be submitted
   before it has hydrated. This will trigger a full page (MPA-style) navigation.
   We can transfer the form state to the next page by comparing the key path
   of the hook instance.
   
   `ReactServerDOMServer.decodeFormState` is used by the server to extract the form
   state from the submitted action. This value can then be passed as an option
   when rendering the new page. It must be passed during both SSR and hydration.
   
   ```js
   const boundAction = await decodeAction(formData, serverManifest);
   const result = await boundAction();
   const formState = decodeFormState(result, formData, serverManifest);
   
   // SSR
   const response = createFromReadableStream(<App />);
   const ssrStream = await renderToReadableStream(response, { formState })
   
   // Hydration
   hydrateRoot(container, <App />, { formState });
   ```
   
   If the `formState` option is omitted, then the state won't be transferred to
   the next page. However, it must be passed in both places, or in neither;
   misconfiguring will result in a hydration mismatch.

   

   acdlite committed Sep 13, 2023
   Configuration menu

   • View commit details
   • Copy full SHA for 422ad8a
   • Browse repository at this point

   Copy the full SHA

   422ad8a View commit details

   Browse the repository at this point in the history

2. Update Flight fixture to useFormState …

   Updates the Flight fixture's Counter component to useFormState instead
   of useState.

   

   acdlite committed Sep 13, 2023
   Configuration menu

   • View commit details
   • Copy full SHA for 765ceb2
   • Browse repository at this point

   Copy the full SHA

   765ceb2 View commit details

   Browse the repository at this point in the history