Patch Changes
-
#11571
1c3265a
Thanks @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.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
- Remove
-
#11570
84189b6
Thanks @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 usinggetActionProps().
This will submit a form to the server in zero-JS scenarios using a search parameter:--- 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:--- 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 thegetActionProps()
input from your form and pass your action function to the formaction
attribute:--- import { actions, - getActionProps, } from 'astro:actions'; --- + <form method="POST" action={actions.logOut}> - <form method="POST"> - <input {...getActionProps(actions.logOut)} /> <button>Log Out</button> </form>