feat(admin-offers): détection dynamique des scrapers disponibles

Clément VALENTIN · claude · Clément VALENTIN · commit d561b409185f · 2025-11-29T22:55:59.000+01:00
- Backend: nouvel endpoint GET /admin/scrapers pour lister les scrapers - Backend: GET /admin/providers avec param include_missing_scrapers - Frontend: affiche tous les fournisseurs avec scraper, même non initialisés - Frontend: badge "Non initialisé" pour les fournisseurs pas encore en base - UI: centrage des onglets dans AdminTabs et ApiDocsTabs - Docs: mise à jour admin-offers.md et checklist.md 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
diff --git a/apps/api/src/routers/admin.py b/apps/api/src/routers/admin.py
@@ -1213,14 +1213,47 @@ async def list_offers(
         )
 
 
+@router.get("/scrapers", response_model=APIResponse)
+async def list_available_scrapers(
+    current_user: User = Depends(require_permission('offers'))
+) -> APIResponse:
+    """
+    List all available scrapers (providers with scraping support)
+
+    Returns:
+        APIResponse with list of scraper names
+    """
+    try:
+        scraper_names = list(PriceUpdateService.SCRAPERS.keys())
+
+        return APIResponse(
+            success=True,
+            data={
+                "scrapers": scraper_names,
+                "total": len(scraper_names)
+            }
+        )
+
+    except Exception as e:
+        logger.error(f"Error listing scrapers: {e}", exc_info=True)
+        return APIResponse(
+            success=False,
+            error={"code": "LIST_ERROR", "message": str(e)}
+        )
+
+
 @router.get("/providers", response_model=APIResponse)
 async def list_providers(
+    include_missing_scrapers: bool = Query(False, description="Include providers with scrapers that don't exist in DB yet"),
     current_user: User = Depends(require_permission('offers')),
     db: AsyncSession = Depends(get_db)
 ) -> APIResponse:
     """
     List all energy providers
 
+    Args:
+        include_missing_scrapers: If True, also returns providers with scrapers not yet in DB
+
     Returns:
         APIResponse with list of providers
     """
@@ -1231,7 +1264,11 @@ async def list_providers(
         providers = result.scalars().all()
 
         providers_data = []
+        existing_names = set()
+
         for provider in providers:
+            existing_names.add(provider.name)
+
             # Count active offers
             offers_result = await db.execute(
                 select(func.count()).select_from(EnergyOffer).where(
@@ -1243,17 +1280,44 @@ async def list_providers(
             )
             offers_count = offers_result.scalar()
 
+            # Check if this provider has a scraper
+            has_scraper = provider.name in PriceUpdateService.SCRAPERS
+
             providers_data.append({
                 "id": provider.id,
                 "name": provider.name,
                 "logo_url": provider.logo_url,
                 "website": provider.website,
                 "is_active": provider.is_active,
                 "active_offers_count": offers_count,
+                "has_scraper": has_scraper,
+                "scraper_urls": provider.scraper_urls,
                 "created_at": provider.created_at.isoformat(),
                 "updated_at": provider.updated_at.isoformat(),
             })
 
+        # Add providers with scrapers that don't exist in DB yet
+        if include_missing_scrapers:
+            for scraper_name in PriceUpdateService.SCRAPERS.keys():
+                if scraper_name not in existing_names:
+                    # Generate a placeholder ID and default values
+                    providers_data.append({
+                        "id": f"scraper-{scraper_name.lower().replace(' ', '-')}",
+                        "name": scraper_name,
+                        "logo_url": None,
+                        "website": None,
+                        "is_active": False,
+                        "active_offers_count": 0,
+                        "has_scraper": True,
+                        "scraper_urls": None,
+                        "created_at": None,
+                        "updated_at": None,
+                        "not_in_database": True,  # Flag to indicate this is a placeholder
+                    })
+
+        # Sort by name
+        providers_data.sort(key=lambda x: x["name"])
+
         return APIResponse(
             success=True,
             data={
diff --git a/apps/web/src/api/energy.ts b/apps/web/src/api/energy.ts
@@ -8,6 +8,11 @@ export interface EnergyProvider {
   scraper_urls?: string[]
   active_offers_count?: number
   last_update?: string
+  has_scraper?: boolean
+  not_in_database?: boolean  // True if provider exists only as scraper, not in DB
+  is_active?: boolean
+  created_at?: string
+  updated_at?: string
 }
 
 export interface EnergyOffer {
@@ -125,6 +130,16 @@ export const energyApi = {
     return apiClient.get<EnergyProvider[]>('energy/providers')
   },
 
+  // Admin endpoint - includes providers with scrapers not yet in DB
+  getProvidersWithScrapers: async () => {
+    return apiClient.get<{ providers: EnergyProvider[], total: number }>('admin/providers', { include_missing_scrapers: true })
+  },
+
+  // Get list of available scrapers
+  getAvailableScrapers: async () => {
+    return apiClient.get<{ scrapers: string[], total: number }>('admin/scrapers')
+  },
+
   getOffers: async (providerId?: string) => {
     return apiClient.get<EnergyOffer[]>('energy/offers', providerId ? { provider_id: providerId } : {})
   },
diff --git a/apps/web/src/components/AdminTabs.tsx b/apps/web/src/components/AdminTabs.tsx
@@ -26,7 +26,7 @@ export default function AdminTabs() {
 
   return (
     <div className="w-full border-b border-gray-200 dark:border-gray-700 overflow-x-auto bg-white dark:bg-gray-800">
-      <nav className="flex gap-1 min-w-max px-3 sm:px-4 lg:px-6" aria-label="Tabs">
+      <nav className="flex justify-center gap-1 min-w-max px-3 sm:px-4 lg:px-6" aria-label="Tabs">
         {visibleTabs.map((tab) => {
           const isActive = location.pathname === tab.path
           return (
diff --git a/apps/web/src/components/ApiDocsTabs.tsx b/apps/web/src/components/ApiDocsTabs.tsx
@@ -15,7 +15,7 @@ export default function ApiDocsTabs() {
 
   return (
     <div className="w-full border-b border-gray-200 dark:border-gray-700 overflow-x-auto bg-white dark:bg-gray-800">
-      <nav className="flex gap-1 min-w-max px-3 sm:px-4 lg:px-6" aria-label="Tabs">
+      <nav className="flex justify-center gap-1 min-w-max px-3 sm:px-4 lg:px-6" aria-label="Tabs">
         {tabs.map((tab) => {
           const isActive = location.pathname === tab.path
           return (
diff --git a/apps/web/src/pages/AdminOffers.tsx b/apps/web/src/pages/AdminOffers.tsx
@@ -85,13 +85,13 @@ export default function AdminOffers() {
     return new Date(validFrom) < sixMonthsAgo
   }
 
-  // Fetch providers
+  // Fetch providers (includes providers with scrapers not yet in DB)
   const { data: providersData } = useQuery({
-    queryKey: ['energy-providers'],
+    queryKey: ['energy-providers-with-scrapers'],
     queryFn: async () => {
-      const response = await energyApi.getProviders()
-      if (response.success && Array.isArray(response.data)) {
-        return response.data as EnergyProvider[]
+      const response = await energyApi.getProvidersWithScrapers()
+      if (response.success && response.data?.providers) {
+        return response.data.providers as EnergyProvider[]
       }
       return []
     },
@@ -638,13 +638,15 @@ export default function AdminOffers() {
         <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
           {Array.isArray(providersData) &&
             providersData
+              // Filtrer pour n'afficher que les fournisseurs avec un scraper
+              .filter((provider) => provider.has_scraper)
               .sort((a, b) => a.name.localeCompare(b.name, 'fr', { sensitivity: 'base' }))
               .map((provider) => {
                 const allProviderOffers = allOffersByProvider?.[provider.id] || []
                 const activeCount = allProviderOffers.filter(o => o.is_active).length
                 const isLoadingPreview = loadingPreview === provider.id
                 const isRefreshing = refreshingProvider === provider.id
-                const hasProvider = ['EDF', 'Enercoop', 'TotalEnergies', 'Priméo Énergie', 'Engie', 'ALPIQ', 'Alterna', 'Ekwateur'].includes(provider.name)
+                const isNotInDatabase = provider.not_in_database === true
 
                 // Find the most recent tariff date
                 const mostRecentDate = allProviderOffers
@@ -656,25 +658,38 @@ export default function AdminOffers() {
                   <div
                     key={provider.id}
                     className={`bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-lg p-4 hover:shadow-lg transition-shadow duration-200 ${
-                      !hasProvider ? 'opacity-60 bg-gray-50 dark:bg-gray-900' : ''
+                      isNotInDatabase ? 'border-dashed border-2 border-amber-400 dark:border-amber-600' : ''
                     }`}
                   >
                     <div className="flex items-start justify-between mb-3">
                       <div className="flex-1">
-                        <h3 className="font-semibold text-gray-900 dark:text-white mb-1">
-                          {provider.name}
-                        </h3>
-                        <p className="text-sm text-gray-600 dark:text-gray-400">
-                          {activeCount} offre{activeCount > 1 ? 's' : ''} active{activeCount > 1 ? 's' : ''}
-                        </p>
+                        <div className="flex items-center gap-2 mb-1">
+                          <h3 className="font-semibold text-gray-900 dark:text-white">
+                            {provider.name}
+                          </h3>
+                          {isNotInDatabase && (
+                            <span className="px-2 py-0.5 text-xs font-medium bg-amber-100 dark:bg-amber-900/30 text-amber-700 dark:text-amber-400 rounded-full">
+                              Non initialisé
+                            </span>
+                          )}
+                        </div>
+                        {isNotInDatabase ? (
+                          <p className="text-sm text-amber-600 dark:text-amber-400">
+                            Scraper disponible - Cliquez sur Prévisualiser pour initialiser
+                          </p>
+                        ) : (
+                          <p className="text-sm text-gray-600 dark:text-gray-400">
+                            {activeCount} offre{activeCount > 1 ? 's' : ''} active{activeCount > 1 ? 's' : ''}
+                          </p>
+                        )}
                         {mostRecentDate && (
                           <p className="text-xs text-green-600 dark:text-green-400 font-medium mt-1">
                             Tarif du {mostRecentDate.toLocaleDateString('fr-FR', { month: 'short', year: 'numeric' })}
                           </p>
                         )}
-                        {provider.last_update && (
+                        {provider.updated_at && !isNotInDatabase && (
                           <p className="text-xs text-gray-500 dark:text-gray-500 mt-1">
-                            Mise à jour : {new Date(provider.last_update).toLocaleDateString('fr-FR')}
+                            Mise à jour : {new Date(provider.updated_at).toLocaleDateString('fr-FR')}
                           </p>
                         )}
                       </div>
@@ -699,9 +714,9 @@ export default function AdminOffers() {
                     </div>
 
                     <div className="flex flex-col gap-2">
-                      {/* Détection si le fournisseur a un scraper - déjà défini plus haut */}
+                      {/* Boutons d'action */}
                       {(() => {
-                        const isDisabled = !hasProvider || isLoadingPreview || isRefreshing
+                        const isDisabled = isLoadingPreview || isRefreshing
 
                         return (
                           <>
@@ -710,10 +725,8 @@ export default function AdminOffers() {
                               <button
                                 onClick={() => handlePreviewRefresh(provider.id, provider.name)}
                                 disabled={isDisabled}
-                                className={`btn btn-primary flex-1 text-sm flex items-center justify-center gap-2 ${
-                                  !hasProvider ? 'opacity-50 cursor-not-allowed' : ''
-                                }`}
-                                title={!hasProvider ? 'Scraper non disponible pour ce fournisseur' : ''}
+                                className="btn btn-primary flex-1 text-sm flex items-center justify-center gap-2"
+                                title="Prévisualiser les changements avant application"
                               >
                                 {isLoadingPreview && loadingPreview === provider.id ? (
                                   <>
@@ -728,8 +741,8 @@ export default function AdminOffers() {
                                 )}
                               </button>
 
-                              {/* Bouton Purger - Uniquement avec permission delete */}
-                              {hasAction('offers', 'delete') && (
+                              {/* Bouton Purger - Uniquement avec permission delete et si le fournisseur existe en base */}
+                              {hasAction('offers', 'delete') && !isNotInDatabase && (
                                 <button
                                   onClick={() => handlePurgeProvider(provider.id, provider.name)}
                                   disabled={isRefreshing}
@@ -741,15 +754,8 @@ export default function AdminOffers() {
                               )}
                             </div>
 
-                            {/* Message si pas de scraper */}
-                            {!hasProvider && (
-                              <div className="text-xs text-gray-500 dark:text-gray-400 italic text-center">
-                                Scraper non disponible
-                              </div>
-                            )}
-
                             {/* Affichage des sources du scraper */}
-                            {hasProvider && provider.scraper_urls && provider.scraper_urls.length > 0 && (() => {
+                            {provider.scraper_urls && provider.scraper_urls.length > 0 && (() => {
                               // Labels pour les URLs en fonction du fournisseur
                               const urlLabels: Record<string, string[]> = {
                                 'EDF': ['Tarif Bleu (réglementé)', 'Zen Week-End (marché)'],
diff --git a/docs/design/checklist.md b/docs/design/checklist.md
@@ -15,14 +15,18 @@ Cette checklist garantit que chaque nouvelle page ou modification respecte les s
 
 ### Container Principal
 
-- [ ] Container avec `pt-6 w-full`
+- [ ] Container avec `w-full`
 - [ ] Espacement cohérent entre sections (`mt-6`)
 - [ ] Padding latéral géré par Layout (ne pas ajouter `px-*`)
 
 **Référence:** [01 - Container](./components/01-container.md)
 
 ### Header de Page
 
+**⚠️ Important : Les pages Admin n'ont PAS besoin d'ajouter leur propre header H1.**
+Le header est géré automatiquement par le Layout via la configuration des routes.
+
+Pour les **pages non-Admin** uniquement :
 - [ ] H1 avec `text-3xl font-bold mb-2 flex items-center gap-3`
 - [ ] Icône avec `text-primary-600 dark:text-primary-400` et `size={32}`
 - [ ] Sous-titre avec `text-gray-600 dark:text-gray-400`
diff --git a/docs/pages/admin-offers.md b/docs/pages/admin-offers.md
