diff options
Diffstat (limited to 'packages/integrations/react')
-rw-r--r-- | packages/integrations/react/CHANGELOG.md | 78 | ||||
-rw-r--r-- | packages/integrations/react/package.json | 2 |
2 files changed, 79 insertions, 1 deletions
diff --git a/packages/integrations/react/CHANGELOG.md b/packages/integrations/react/CHANGELOG.md index 2bebccb85..b8aa870f5 100644 --- a/packages/integrations/react/CHANGELOG.md +++ b/packages/integrations/react/CHANGELOG.md @@ -1,5 +1,83 @@ # @astrojs/react +## 3.6.1 + +### Patch Changes + +- [#11571](https://github.com/withastro/astro/pull/11571) [`1c3265a`](https://github.com/withastro/astro/commit/1c3265a8c9c0b1b1bd597f756b63463146bacc3a) Thanks [@bholmesdev](https://github.com/bholmesdev)! - **BREAKING CHANGE to the experimental Actions API only.** Install the latest `@astrojs/react` integration as well if you're using React 19 features. + + Make `.safe()` the default return value for actions. This means `{ data, error }` will be returned when calling an action directly. If you prefer to get the data while allowing errors to throw, chain the `.orThrow()` modifier. + + ```ts + import { actions } from 'astro:actions'; + + // Before + const { data, error } = await actions.like.safe(); + // After + const { data, error } = await actions.like(); + + // Before + const newLikes = await actions.like(); + // After + const newLikes = await actions.like.orThrow(); + ``` + + ## Migration + + To migrate your existing action calls: + + - Remove `.safe` from existing _safe_ action calls + - Add `.orThrow` to existing _unsafe_ action calls + +- [#11570](https://github.com/withastro/astro/pull/11570) [`84189b6`](https://github.com/withastro/astro/commit/84189b6511dc2a14bcfe608696f56a64c2046f39) Thanks [@bholmesdev](https://github.com/bholmesdev)! - **BREAKING CHANGE to the experimental Actions API only.** Install the latest `@astrojs/react` integration as well if you're using React 19 features. + + Updates the Astro Actions fallback to support `action={actions.name}` instead of using `getActionProps().` This will submit a form to the server in zero-JS scenarios using a search parameter: + + ```astro + --- + import { actions } from 'astro:actions'; + --- + + <form action={actions.logOut}> + <!--output: action="?_astroAction=logOut"--> + <button>Log Out</button> + </form> + ``` + + You may also construct form action URLs using string concatenation, or by using the `URL()` constructor, with the an action's `.queryString` property: + + ```astro + --- + import { actions } from 'astro:actions'; + + const confirmationUrl = new URL('/confirmation', Astro.url); + confirmationUrl.search = actions.queryString; + --- + + <form method="POST" action={confirmationUrl.pathname}> + <button>Submit</button> + </form> + ``` + + ## Migration + + `getActionProps()` is now deprecated. To use the new fallback pattern, remove the `getActionProps()` input from your form and pass your action function to the form `action` attribute: + + ```diff + --- + import { + actions, + - getActionProps, + } from 'astro:actions'; + --- + + + <form method="POST" action={actions.logOut}> + - <form method="POST"> + - <input {...getActionProps(actions.logOut)} /> + <button>Log Out</button> + </form> + ``` + ## 3.6.0 ### Minor Changes diff --git a/packages/integrations/react/package.json b/packages/integrations/react/package.json index 16ae0b279..114628edb 100644 --- a/packages/integrations/react/package.json +++ b/packages/integrations/react/package.json @@ -1,7 +1,7 @@ { "name": "@astrojs/react", "description": "Use React components within Astro", - "version": "3.6.0", + "version": "3.6.1", "type": "module", "types": "./dist/index.d.ts", "author": "withastro", |