github withastro/astro @astrojs/react@3.6.1

latest releases: astro@4.16.11, astro@5.0.0-beta.7, @astrojs/svelte@6.0.0-beta.2...
3 months ago

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
  • #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 using getActionProps(). 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 the getActionProps() input from your form and pass your action function to the form action 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>

Don't miss a new astro release

NewReleases is sending notifications on new releases.