From 68344817ae07920f44916535f4d42baef521a2da Mon Sep 17 00:00:00 2001
From: GauthierWebDev <gauthier@gauthierdaniels.fr>
Date: Sun, 13 Apr 2025 16:27:46 +0200
Subject: [PATCH] feat: Add reducer examples for React useReducer

---
 app/data/docs/react/usereducer/page.md        | 28 ++-----------------
 .../docs/react/usereducer/reducer-example.tsx | 10 +++++++
 .../reducer-why-spread-operator.jsx           | 10 +++++++
 3 files changed, 23 insertions(+), 25 deletions(-)
 create mode 100644 app/data/docs/react/usereducer/reducer-example.tsx
 create mode 100644 app/data/docs/react/usereducer/reducer-why-spread-operator.jsx

diff --git a/app/data/docs/react/usereducer/page.md b/app/data/docs/react/usereducer/page.md
index 97a61b4..0b6e710 100644
--- a/app/data/docs/react/usereducer/page.md
+++ b/app/data/docs/react/usereducer/page.md
@@ -50,24 +50,13 @@ Parlons dans un premier temps de la signature d'un reducer :
 
 {% tab value="jsx" label="JSX" %}
 
-{% snippet path="data/docs/react/usereducer/reducer-example.jsx" language="jsx" label="test" showLineNumbers=true /%}
+{% snippet path="data/docs/react/usereducer/reducer-example.jsx" language="jsx" showLineNumbers=true /%}
 
 {% /tab %}
 
 {% tab value="tsx" label="TSX" %}
 
-```tsx
-const reducer = (state: State, action: Action) => {
-  switch (action.type) {
-    case "TYPE_1":
-      return { ...state /* Nouvel état */ };
-    case "TYPE_2":
-      return { ...state /* Nouvel état */ };
-    default:
-      return state;
-  }
-};
-```
+{% snippet path="data/docs/react/usereducer/reducer-example.tsx" language="tsx" showLineNumbers=true /%}
 
 {% /tab %}
 
@@ -93,18 +82,7 @@ En déversant le contenu de l'état actuel, on s'assure de ne pas perdre ces pro
 
 Par exemple :
 
-```js
-const initialState = { count: 0, message: "Hello" };
-
-const reducer = (state, action) => {
-  switch (action.type) {
-    case "INCREMENT":
-      return { count: state.count + 1 };
-    default:
-      return state;
-  }
-};
-```
+{% snippet path="data/docs/react/usereducer/reducer-why-spread-operator.jsx" language="jsx" showLineNumbers=true /%}
 
 On perdrait ici la propriété `message` si on ne la déversait pas dans le nouvel état.
 
diff --git a/app/data/docs/react/usereducer/reducer-example.tsx b/app/data/docs/react/usereducer/reducer-example.tsx
new file mode 100644
index 0000000..4793ff7
--- /dev/null
+++ b/app/data/docs/react/usereducer/reducer-example.tsx
@@ -0,0 +1,10 @@
+const reducer = (state: State, action: Action) => {
+  switch (action.type) {
+    case "TYPE_1":
+      return { ...state /* Nouvel état */ };
+    case "TYPE_2":
+      return { ...state /* Nouvel état */ };
+    default:
+      return state;
+  }
+};
diff --git a/app/data/docs/react/usereducer/reducer-why-spread-operator.jsx b/app/data/docs/react/usereducer/reducer-why-spread-operator.jsx
new file mode 100644
index 0000000..64a9c55
--- /dev/null
+++ b/app/data/docs/react/usereducer/reducer-why-spread-operator.jsx
@@ -0,0 +1,10 @@
+const initialState = { count: 0, message: "Hello" };
+
+const reducer = (state, action) => {
+  switch (action.type) {
+    case "INCREMENT":
+      return { count: state.count + 1 };
+    default:
+      return state;
+  }
+};