@@ -0,0 +6,4 @@
+import BreedInfoPage from "./components/BreedInfoPage";
+import "./App.css";
+import { debounce } from "lodash";
+const apikey ="live_8bnMZatSzkOR7eyT6o0iwDmXQuTxPI3deVWy0KY2ABxDkTMJdTYZ13S9lVFmrZRO"

@@ -0,0 +2,4 @@
+import { useParams, useNavigate } from "react-router-dom";
+
+const API_URL = "https://api.thecatapi.com/v1";
+const API_KEY = "live_8bnMZatSzkOR7eyT6o0iwDmXQuTxPI3deVWy0KY2ABxDkTMJdTYZ13S9lVFmrZRO"; 

@@ -0,0 +6,4 @@
+      <h2 className="fav-heading">Favorites Gallery</h2>
+      <div className="favorites">
+        {favorites.map((cat) => (
+          <div key={cat.id} className="cat-item">

@@ -0,0 +8,4 @@
+        type="text"
+        name="breed"
+        placeholder="Search by breed name"
+        value={filters.breed}

@@ -0,0 +15,4 @@
+
+      <select
+        name="hairLength"
+        value={filters.hairLength}

@@ -0,0 +14,4 @@
+    const handleCatClick =(cat)=>{
+        console.log('id',cat)
+        if (cat.breeds && cat.breeds[0] && cat.breeds[0].id) {
+            navigate(`/breed/${cat.breeds[0].id}`);