Skip to content

Commit fcf839c

Browse files
i18n(fr): update integrations-guide/react.mdx
See #12413
1 parent 90813fa commit fcf839c

File tree

1 file changed

+13
-13
lines changed
  • src/content/docs/fr/guides/integrations-guide

1 file changed

+13
-13
lines changed

src/content/docs/fr/guides/integrations-guide/react.mdx

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -115,30 +115,30 @@ Pour utiliser votre premier composant React dans Astro, dirigez-vous vers notre
115115
* 💧 les options d'hydratation côté client, et
116116
* 🤝 les possibilités de mélanger et d'imbriquer les frameworks.
117117

118-
## Intégrer des actions avec `useActionState()` (expérimental)
118+
## Intégrer des actions avec `useActionState()`
119119

120-
L'intégration `@astrojs/react` fournit deux fonctions expérimentales à utiliser avec les [actions d'Astro][astro-actions] : `experimental_withState()` et `experimental_getActionState()`.
120+
L'intégration `@astrojs/react` fournit deux fonctions à utiliser avec les [actions d'Astro][astro-actions] : `withState()` et `getActionState()`.
121121

122122
Celles-ci sont utilisées avec le [hook useActionState() de React](https://fr.react.dev/reference/react/useActionState) afin de lire et de mettre à jour l'état côté client lorsque des actions sont déclenchées au moment de la soumission du formulaire.
123123

124-
### `experimental_withState()`
124+
### `withState()`
125125

126126
<p>
127127

128128
**Type :** `(action: FormFn<T>) => (state: T, formData: FormData) => FormFn<T>`<br />
129-
<Since v="4.3.2" />
129+
<Since v="4.4.0" pkg="@astrojs/react" />
130130
</p>
131131

132-
Vous pouvez transmettre `experimental_withState()` et l'action que vous souhaitez déclencher au hook `useActionState()` de React en tant que fonction d'action du formulaire. L'exemple ci-dessous transmet une action `like` pour augmenter un compteur, avec un état initial de `0` mention « J'aime ».
132+
Vous pouvez transmettre `withState()` et l'action que vous souhaitez déclencher au hook `useActionState()` de React en tant que fonction d'action du formulaire. L'exemple ci-dessous transmet une action `like` pour augmenter un compteur, avec un état initial de `0` mention « J'aime ».
133133

134134
```jsx title="Like.tsx" ins={2,7} "useActionState"
135135
import { actions } from 'astro:actions';
136-
import { experimental_withState } from '@astrojs/react/actions';
136+
import { withState } from '@astrojs/react/actions';
137137
import { useActionState } from "react";
138138

139139
export function Like({ postId }: { postId: string }) {
140140
const [state, action, pending] = useActionState(
141-
experimental_withState(actions.like),
141+
withState(actions.like),
142142
{ data: 0, error: undefined }, // mentions « J'aime » et erreurs initiales
143143
);
144144

@@ -151,32 +151,32 @@ export function Like({ postId }: { postId: string }) {
151151
}
152152
```
153153

154-
La fonction `experimental_withState()` fera correspondre les types d'actions avec les attentes de React et préservera les métadonnées utilisées pour l'amélioration progressive, lui permettant de fonctionner même lorsque JavaScript est désactivé sur l'appareil de l'utilisateur.
154+
La fonction `withState()` fera correspondre les types d'actions avec les attentes de React et préservera les métadonnées utilisées pour l'amélioration progressive, lui permettant de fonctionner même lorsque JavaScript est désactivé sur l'appareil de l'utilisateur.
155155

156-
### `experimental_getActionState()`
156+
### `getActionState()`
157157

158158
<p>
159159

160160
**Type :** `(context: ActionAPIContext) => Promise<T>`<br />
161-
<Since v="4.3.2" />
161+
<Since v="4.4.0" pkg="@astrojs/react" />
162162
</p>
163163

164-
Vous pouvez accéder à l'état enregistré par `useActionState()` sur le serveur dans votre gestionnaire d'actions (`handler`) à l'aide de `experimental_getActionState()`. Cette méthode accepte le [contexte de l'API d'Astro](/fr/reference/api-reference/#lobjet-de-contexte), et éventuellement, vous pouvez appliquer un type au résultat.
164+
Vous pouvez accéder à l'état enregistré par `useActionState()` sur le serveur dans votre gestionnaire d'actions (`handler`) à l'aide de `getActionState()`. Cette méthode accepte le [contexte de l'API d'Astro](/fr/reference/api-reference/#lobjet-de-contexte), et éventuellement, vous pouvez appliquer un type au résultat.
165165

166166
L'exemple ci-dessous récupère la valeur actuelle des mentions « J'aime » à partir d'un compteur, typée en tant que nombre, afin de créer une action `like` incrémentielle :
167167

168168
```ts title="actions.ts" ins={3,11}
169169
import { defineAction, type SafeResult } from 'astro:actions';
170170
import { z } from 'astro:schema';
171-
import { experimental_getActionState } from '@astrojs/react/actions';
171+
import { getActionState } from '@astrojs/react/actions';
172172

173173
export const server = {
174174
like: defineAction({
175175
input: z.object({
176176
postId: z.string(),
177177
}),
178178
handler: async ({ postId }, ctx) => {
179-
const { data: currentLikes = 0, error } = await experimental_getActionState<SafeResult<any, number>>(ctx);
179+
const { data: currentLikes = 0, error } = await getActionState<SafeResult<any, number>>(ctx);
180180

181181
// gérer les erreurs
182182
if (error) throw error;

0 commit comments

Comments
 (0)