diff --git a/mon-projet/src/App.jsx b/mon-projet/src/App.jsx
index eac4bac..9f812e7 100644
--- a/mon-projet/src/App.jsx
+++ b/mon-projet/src/App.jsx
@@ -3,6 +3,7 @@ import Header from "./components/Header";
 import Footer from "./components/Footer";
 import Carte from "./components/Carte";
 import { useState } from "react";
+import { useEffect } from "react";
 const trilogies = [
   {
     id: 1,
@@ -32,9 +33,12 @@ const trilogies = [
 ];
 
 function App() {
-  const [likes, setLikes] = useState(0);
+  const [likes, setLikes] = useState({ 1: 3, 4: 1 });
   const [recherche, setRecherche] = useState("");
   const [total, setTotal] = useState(0);
+  useEffect(() => {
+    document.title = `${trilogies.length} trilogies cultes`;
+  }, []);
   const filtrees = trilogies.filter((t) =>
     t.nom.toLowerCase().includes(recherche.toLowerCase()),
   );
@@ -57,6 +61,7 @@ function App() {
           titre={trilo.nom}
           niveaux={trilo.niveaux}
           onLike={() => setTotal((t) => t + 1)}
+          likes={likes[trilo.id] || 0}
         />
       ))}
       <Footer />
diff --git a/mon-projet/src/components/carte.jsx b/mon-projet/src/components/carte.jsx
index dcbc6e3..96ac349 100644
--- a/mon-projet/src/components/carte.jsx
+++ b/mon-projet/src/components/carte.jsx
@@ -1,6 +1,5 @@
 import { useState } from "react";
 function Carte(props) {
-  const [likes, setLikes] = useState(0);
   return (
     <div className="carte">
       <h2>{props.titre}</h2>
@@ -11,7 +10,7 @@ function Carte(props) {
         onClick={() => {
           setLikes(likes + 1);
           props.onLike();
-        }}
+        }
       >
         ❤️ {likes}
       </button>