Rename all french to english

src/components/VolunteerList/__tests__/VolunteerList.tsx

@@ -0,0 +1,38 @@
+/**
+ * @jest-environment jsdom
+ */
+import { render } from "@testing-library/react"
+import { MemoryRouter } from "react-router-dom"
+
+import VolunteerList from "../index"
+
+describe("<VolunteerList />", () => {
+    it("renders", () => {
+        const tree = render(
+            <MemoryRouter>
+                <VolunteerList
+                    items={[
+                        {
+                            id: 1,
+                            firstname: "Aupeix",
+                            lastname: "Amélie",
+                            email: "pakouille.lakouille@yahoo.fr",
+                            mobile: "0675650392",
+                            photo: "images/volunteers/$taille/amélie_aupeix.jpg",
+                            food: "Végétarien",
+                            adult: 1,
+                            privileges: 0,
+                            active: 0,
+                            comment: "",
+                            timestamp: "0000-00-00",
+                            password:
+                                "$2y$10$fSxY9AIuxSiEjwF.J3eXGubIxUPkdq9d5fqpbl8ASimSjNj4SR.9O",
+                        },
+                    ]}
+                />
+            </MemoryRouter>
+        ).container.firstChild
+
+        expect(tree).toMatchSnapshot()
+    })
+})

src/components/VolunteerList/__tests__/__snapshots__/VolunteerList.tsx.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<VolunteerList /> renders 1`] = `
+<div
+  class="user-list"
+>
+  <h4>
+    Volunteer List
+  </h4>
+  <ul>
+    <li>
+      <a
+        href="/Volunteer/1"
+      >
+        <b>
+          Aupeix
+        </b>
+         
+        Amélie
+      </a>
+    </li>
+  </ul>
+</div>
+`;

src/components/VolunteerList/index.tsx

@@ -0,0 +1,26 @@
+import { memo } from "react"
+import { Link } from "react-router-dom"
+
+import { Volunteer } from "../../services/volunteers"
+import styles from "./styles.module.scss"
+
+interface Props {
+    items: Volunteer[]
+}
+
+const VolunteerList = ({ items }: Props) => (
+    <div className={styles["user-list"]}>
+        <h4>Volunteer List</h4>
+        <ul>
+            {items.map(({ id, lastname, firstname }) => (
+                <li key={id}>
+                    <Link to={`/Volunteer/${id}`}>
+                        <b>{firstname}</b> {lastname}
+                    </Link>
+                </li>
+            ))}
+        </ul>
+    </div>
+)
+
+export default memo(VolunteerList)

src/components/VolunteerList/styles.module.scss

@@ -0,0 +1,17 @@
+@import "../../theme/variables";
+
+.user-list {
+    color: $color-white;
+
+    ul {
+        padding-left: 17px;
+    }
+
+    li {
+        margin-bottom: 0.5em;
+    }
+
+    a {
+        color: $color-white;
+    }
+}