{/* Guides card */}
diff --git a/src/components/MutuelleCard.jsx b/src/components/MutuelleCard.jsx
index 51670c7..3fa3cc7 100644
--- a/src/components/MutuelleCard.jsx
+++ b/src/components/MutuelleCard.jsx
@@ -1,22 +1,32 @@
+import { useState } from 'react'
import { FiArrowRight, FiActivity, FiEye, FiSmile } from 'react-icons/fi'
-import { MdLocalHospital } from 'react-icons/md'
-const hospConfig = {
- orange: {
- bg: 'bg-orange-50',
- text: 'text-orange-700',
- border: 'border-orange-200',
- },
- green: {
- bg: 'bg-emerald-50',
- text: 'text-emerald-700',
- border: 'border-emerald-200',
- },
- teal: {
- bg: 'bg-teal-50',
- text: 'text-teal-700',
- border: 'border-teal-200',
- },
+// Favicon auto-chargé depuis le lien, fallback sur les initiales
+export function LogoMutuelle({ mutuelle, className = '' }) {
+ const [faviconError, setFaviconError] = useState(false)
+
+ const faviconUrl =
+ mutuelle.lien && !faviconError
+ ? `https://www.google.com/s2/favicons?sz=64&domain_url=${encodeURIComponent(mutuelle.lien)}`
+ : null
+
+ return (
+
+ {faviconUrl ? (
+
setFaviconError(true)}
+ />
+ ) : (
+
{mutuelle.initiales}
+ )}
+
+ )
}
function FeatureDots({ count }) {
@@ -54,8 +64,7 @@ function ScoreBar({ score, color }) {
}
export default function MutuelleCard({ mutuelle }) {
- const hosp = hospConfig[mutuelle.hospColor] || hospConfig.teal
- const isFirst = mutuelle.rank === 1
+ const isFirst = mutuelle.rang === 1
return (
- {/* Rank badge */}
+ {/* Rang */}
- {mutuelle.rank}
+ {mutuelle.rang}
- {/* Logo */}
-
- {mutuelle.initials}
-
+ {/* Logo (favicon ou initiales) */}
+
- {/* Name + tags */}
+ {/* Nom + tags */}
- {mutuelle.name}
- {isFirst && (
+ {mutuelle.nom}
+ {mutuelle.meilleurChoix && (
⭐ Meilleur Choix
)}
- {mutuelle.idealFor.map((tag) => (
+ {mutuelle.tags.map((tag) => (
- {/* Features */}
+ {/* Points de couverture */}
Soins
-
+
Dentaire
-
+
Optique
-
+
-
{/* Score */}
-
+
{/* CTA */}
-
+
)
}
diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx
index 0fd1ea3..f022f42 100644
--- a/src/components/Navbar.jsx
+++ b/src/components/Navbar.jsx
@@ -25,7 +25,7 @@ export default function Navbar() {
diff --git a/src/hooks/useMutuelles.js b/src/hooks/useMutuelles.js
new file mode 100644
index 0000000..4fbd812
--- /dev/null
+++ b/src/hooks/useMutuelles.js
@@ -0,0 +1,25 @@
+import { useState, useEffect } from 'react'
+
+export function useMutuelles() {
+ const [mutuelles, setMutuelles] = useState([])
+ const [loading, setLoading] = useState(true)
+ const [error, setError] = useState(null)
+
+ useEffect(() => {
+ fetch('/mutuelles.json')
+ .then((res) => {
+ if (!res.ok) throw new Error('Impossible de charger les données')
+ return res.json()
+ })
+ .then((data) => {
+ setMutuelles(data.mutuelles)
+ setLoading(false)
+ })
+ .catch((err) => {
+ setError(err.message)
+ setLoading(false)
+ })
+ }, [])
+
+ return { mutuelles, loading, error }
+}