Passage des paramètres des boutons vu ou a voir e dynamique

src/Enum/BasculeFilm.php

@@ -0,0 +1,76 @@
+<?php
+
+namespace App\Enum;
+
+use App\Entity\Film;
+use App\Entity\User;
+
+/**
+ * Bascules d'état possibles pour un film, affichées par le composant
+ * Vue SwitchEtat. Chaque cas centralise toute la configuration du
+ * bouton : icônes, libellés, infobulle et route de bascule.
+ *
+ * Pour ajouter un nouveau type de bascule : ajouter un cas et compléter
+ * les match() existants, aucun template ni composant JS à modifier.
+ */
+enum BasculeFilm: string
+{
+    case A_VOIR = 'a-voir';
+    case VU = 'vu';
+
+    public function routeName(): string
+    {
+        return match ($this) {
+            self::A_VOIR => 'maliste_modifier_a_voir',
+            self::VU => 'maliste_modifier_vus',
+        };
+    }
+
+    public function iconeActif(): string
+    {
+        return match ($this) {
+            self::A_VOIR => 'fa-solid fa-bookmark fa-lg',
+            self::VU => 'fa-solid fa-eye fa-lg text-success',
+        };
+    }
+
+    public function iconeInactif(): string
+    {
+        return match ($this) {
+            self::A_VOIR => 'fa-regular fa-bookmark text-secondary fa-lg',
+            self::VU => 'fa-solid fa-eye-slash fa-lg text-secondary',
+        };
+    }
+
+    public function texteActif(): string
+    {
+        return match ($this) {
+            self::A_VOIR => 'Supprimer ce film de votre liste à voir',
+            self::VU => 'Supprimer ce film de votre liste des films vus',
+        };
+    }
+
+    public function texteInactif(): string
+    {
+        return match ($this) {
+            self::A_VOIR => 'Ajouter ce film à votre liste à voir',
+            self::VU => 'Marquer ce film comme vu',
+        };
+    }
+
+    public function avecInfoBulle(): bool
+    {
+        return match ($this) {
+            self::A_VOIR => true,
+            self::VU => false,
+        };
+    }
+
+    public function estActifPour(User $user, Film $film): bool
+    {
+        return match ($this) {
+            self::A_VOIR => (bool) $user->wantToSee($film),
+            self::VU => (bool) $user->haveSeen($film),
+        };
+    }
+}

templates/videotheque/_bascule_film.html.twig

@@ -0,0 +1,20 @@
+{# Composant de bascule d'état d'un film (Vue) #}
+{# Toute la configuration de chaque bascule (icônes, libellés, route) #}
+{# se trouve dans App\Enum\BasculeFilm. #}
+{# Paramètres: #}
+{#   - bascule: cas de l'Enum (BasculeFilm::VU ou BasculeFilm::A_VOIR) #}
+{#   - film: le film concerné #}
+{#   - tag: balise racine du composant, 'a' (défaut) ou 'button' #}
+{#   - classe: classes CSS de la balise (ex: 'btn text-primary') #}
+{% set actif = bascule.estActifPour(app.user, film) %}
+<span {{ vue_component('SwitchEtat', {
+    path: path(bascule.routeName()),
+    idFilm: film.id,
+    iconeActif: bascule.iconeActif(),
+    iconeInactif: bascule.iconeInactif(),
+    actif: actif,
+    titre: actif ? bascule.texteActif() : bascule.texteInactif(),
+    tooltip: bascule.avecInfoBulle(),
+    tag: tag|default('a'),
+    classe: classe|default('')
+}) }}></span>

templates/videotheque/liste_tableaux.html.twig

@@ -34,25 +34,10 @@
 			<tr data-auteur="{{ film.authered.nomComplet }}">
 				{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
 					<td>
-						{% set follow_texte = app.user.wantToSee(film) ? "Supprimer ce film de votre liste à voir" : "Ajouter ce film à votre liste à voir" %}
-						<span {{ vue_component('SwitchEtat', {
-							path: path('maliste_modifier_a_voir'),
-							idFilm: film.id,
-							iconeActif: 'fa-solid fa-bookmark fa-lg',
-							iconeInactif: 'fa-regular fa-bookmark text-secondary fa-lg',
-							actif: app.user.wantToSee(film),
-							titre: follow_texte,
-							tooltip: true
-						}) }}></span>
+						{{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').A_VOIR, film: film }) }}
 					</td>
 					<td>
-						<span {{ vue_component('SwitchEtat', {
-							path: path('maliste_modifier_vus'),
-							idFilm: film.id,
-							iconeActif: 'fa-solid fa-eye fa-lg text-success',
-							iconeInactif: 'fa-solid fa-eye-slash fa-lg text-secondary',
-							actif: app.user.haveSeen(film)
-						}) }}></span>
+						{{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').VU, film: film }) }}
 					</td>
 					<td>
 						{%  if film.authered is defined %}

templates/videotheque/liste_vignettes.html.twig

@@ -24,27 +24,12 @@
 				</h4>
 				<div class="d-flex">
 					{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
-						<div class="me-3" {{ vue_component('SwitchEtat', {
-							path: path('maliste_modifier_vus'),
-							idFilm: film.id,
-							iconeActif: 'fa-solid fa-eye fa-lg text-success',
-							iconeInactif: 'fa-solid fa-eye-slash fa-lg text-secondary',
-							actif: app.user.haveSeen(film),
-							tag: 'button',
-							classe: 'btn'
-						}) }}></div>
-						{% set follow_texte = app.user.wantToSee(film) ? "Supprimer ce film de votre liste à voir" : "Ajouter ce film à votre liste à voir" %}
-						<div class="me-3" {{ vue_component('SwitchEtat', {
-							path: path('maliste_modifier_a_voir'),
-							idFilm: film.id,
-							iconeActif: 'fa-solid fa-bookmark fa-lg',
-							iconeInactif: 'fa-regular fa-bookmark text-secondary fa-lg',
-							actif: app.user.wantToSee(film),
-							titre: follow_texte,
-							tooltip: true,
-							tag: 'button',
-							classe: 'btn text-primary'
-						}) }}></div>
+						<div class="me-3">
+							{{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').VU, film: film, tag: 'button', classe: 'btn' }) }}
+						</div>
+						<div class="me-3">
+							{{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').A_VOIR, film: film, tag: 'button', classe: 'btn text-primary' }) }}
+						</div>
 					{% endif %}
 					<div class="">
 						<button class="btn text-primary" data-bs-toggle="collapse" data-bs-target="#collapse-id-{{ film.id }}"><i data-collapser-target="button" class="fa-solid fa-chevron-circle-right fa-lg"></i></button>

templates/videotheque/voirfilm.html.twig

@@ -3,23 +3,8 @@
 {% block title %}{{ parent() }} - Fiche film - {{ film.titre }}{% endblock %}
 {% block titre %}
     {% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
-        {% set follow_texte = film.usersWantToView.contains(app.user) ? "Supprimer ce film de votre liste à voir" : "Ajouter ce film à votre liste à voir" %}
-        <span {{ vue_component('SwitchEtat', {
-            path: path('maliste_modifier_a_voir'),
-            idFilm: film.id,
-            iconeActif: 'fa-solid fa-bookmark',
-            iconeInactif: 'fa-regular fa-bookmark text-secondary',
-            actif: film.usersWantToView.contains(app.user),
-            titre: follow_texte,
-            tooltip: true
-        }) }}></span>
-        <span {{ vue_component('SwitchEtat', {
-            path: path('maliste_modifier_vus'),
-            idFilm: film.id,
-            iconeActif: 'fa-solid fa-eye text-success',
-            iconeInactif: 'fa-solid fa-eye-slash text-secondary',
-            actif: film.usersWhoSeen.contains(app.user)
-        }) }}></span>
+        {{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').A_VOIR, film: film }) }}
+        {{ include('videotheque/_bascule_film.html.twig', { bascule: enum('App\\Enum\\BasculeFilm').VU, film: film }) }}
     {% endif %}
     {{ film.titre }}