Added:

- turbo-stream for Chapter updates
- progressbar for chapter scrapping
- minor optimisations

assets/bootstrap.js

@@ -9,3 +9,27 @@ export const app = startStimulusApp(require.context(
 
 // register any custom, 3rd party controllers here
 // app.register('some_controller_name', SomeImportedController);
+
+//DEBUG TURBO
+// import * as Turbo from "@hotwired/turbo"
+//
+// Turbo.session.drive = false
+// Turbo.start()
+//
+// // Écouteurs existants
+// document.addEventListener("turbo:before-stream-render", (event) => {
+//   console.log("Before stream render", event.target);
+// });
+//
+// document.addEventListener("turbo:stream-render", (event) => {
+//   console.log("Stream rendered", event.target);
+// });
+//
+// // Nouvel écouteur pour les événements de création
+// document.addEventListener("turbo:before-fetch-request", (event) => {
+//   console.log("Before fetch request", event.detail.fetchOptions);
+// });
+//
+// document.addEventListener("turbo:before-fetch-response", (event) => {
+//   console.log("Before fetch response", event.detail.fetchResponse);
+// });

assets/controllers.json

@@ -15,7 +15,7 @@
                 "fetch": "eager"
             },
             "mercure-turbo-stream": {
-                "enabled": false,
+                "enabled": true,
                 "fetch": "eager"
             }
         }

assets/controllers/chapter_progress_controller.js

@@ -31,7 +31,7 @@ export default class extends Controller {
   }
 
   handleProgressUpdate(data) {
-    this.currentPage = data.pageIndex + 1;
+    this.currentPage = data.pageIndex;
     this.totalPages = data.totalPages;
 
     this.updateProgressBar();

src/Controller/MangaController.php

@@ -28,6 +28,7 @@ use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\HttpKernel\Exception\NotFoundHttpException;
 use Symfony\Component\Messenger\MessageBusInterface;
 use Symfony\Component\Routing\Attribute\Route;
+use Symfony\Component\Serializer\SerializerInterface;
 use Symfony\Component\String\Slugger\SluggerInterface;
 
 class MangaController extends AbstractController

src/Entity/Chapter.php

@@ -6,8 +6,10 @@ use App\Repository\ChapterRepository;
 use Doctrine\Common\Collections\ArrayCollection;
 use Doctrine\Common\Collections\Collection;
 use Doctrine\ORM\Mapping as ORM;
+use Symfony\UX\Turbo\Attribute\Broadcast;
 
 #[ORM\Entity(repositoryClass: ChapterRepository::class)]
+#[Broadcast()]
 class Chapter
 {
     #[ORM\Id]

src/Entity/Manga.php

@@ -7,6 +7,7 @@ use Doctrine\Common\Collections\ArrayCollection;
 use Doctrine\Common\Collections\Collection;
 use Doctrine\DBAL\Types\Types;
 use Doctrine\ORM\Mapping as ORM;
+use Symfony\Component\Serializer\Annotation\Groups;
 
 #[ORM\Entity(repositoryClass: MangaRepository::class)]
 class Manga

src/Manager/Toolbar/Definition/Toolbar.php

@@ -4,7 +4,7 @@ namespace App\Manager\Toolbar\Definition;
 
 use App\Manager\Toolbar\Element\ToolbarElement;
 
-class Toolbar
+abstract class Toolbar
 {
     private array $leftGroup = [];
     private array $rightGroup = [];

src/MessageHandler/DownloadChapterHandler.php

@@ -46,8 +46,7 @@ readonly class DownloadChapterHandler
                 ->setBaseUrl('https://api.mangadex.org/')
                 ->setImageSelector('img')
                 ->setChapterUrlFormat('at-home/server/%s')
-                ->setScrapingType('mangadex')
+                ->setScrapingType('mangadex');
-        ;
 
 //            (new ContentSource())
 //                ->setBaseUrl('https://lelscans.net')

src/MessageHandler/RefreshMetadataHandler.php

@@ -32,7 +32,7 @@ readonly class RefreshMetadataHandler
         $lastChapters = $this->mangadexProvider->addAllChaptersToManga($manga);
 
         try {
-            foreach ($manga->getChapters() as $chapter) {
+            foreach ($lastChapters as $chapter) {
                 $this->entityManager->persist($chapter);
             }
 

templates/activity/index.html.twig

@@ -5,6 +5,7 @@
     {% endif %}
 {% endblock %}
 {% block body %}
+    <div {{ turbo_stream_listen('App\\Entity\\Chapter') }}></div>
     <div class="container mx-auto mt-8 p-2">
         <div class="bg-white overflow-hidden">
             <div class="overflow-x-auto">
@@ -24,7 +25,7 @@
                     </thead>
                     <tbody class="text-gray-700">
                     {% for manga in status %}
-                        <tr class="border-b border-gray-200 hover:bg-gray-50 transition duration-150 ease-in-out">
+                        <tr id="activity-{{ manga.chapterId }}" class="border-b border-gray-200 hover:bg-gray-50 transition duration-150 ease-in-out">
                             <td class="py-4 px-4 text-center">
                                 <input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
                             </td>
@@ -40,7 +41,7 @@
                                      data-controller="chapter-progress"
                                      data-chapter-progress-chapter-id-value="{{ manga.chapterId }}">
                                     <div class="relative bg-gray-200 rounded-full h-6 overflow-hidden">
-                                        <div data-chapter-progress-target="progressBar" class="absolute top-0 left-0 h-full bg-green-400 transition-all duration-300 ease-out" style="width: 0%"></div>
+                                        <div data-chapter-progress-target="progressBar" class="absolute top-0 left-0 h-full bg-green-400 transition-all duration-300 ease-out" style="width: 0"></div>
                                         <div class="absolute inset-0 flex items-center justify-center text-xs font-semibold text-white" data-chapter-progress-target="progressText">
                                             0 / 0
                                         </div>

templates/broadcast/Chapter.stream.html.twig

@@ -0,0 +1,21 @@
+{% block create %}
+    <turbo-stream action="prepend" target="volume-{{ entity.volume }}">
+        <template>
+            {% include 'manga/_chapter_row.html.twig' with { chapter: entity, manga: entity.manga } %}
+        </template>
+    </turbo-stream>
+{% endblock %}
+
+{% block update %}
+    <turbo-stream action="remove" target="activity-{{ entity.id }}"></turbo-stream>
+
+    <turbo-stream action="replace" target="chapter-{{ entity.id }}">
+        <template>
+            {% include 'manga/_chapter_row.html.twig' with { chapter: entity, manga: entity.manga } %}
+        </template>
+    </turbo-stream>
+
+{% endblock %}
+
+{% block remove %}
+{% endblock %}

templates/manga/_chapter_list.html.twig

@@ -1,5 +1,5 @@
 <turbo-frame id="chapter_list">
-    <div class="p-4">
+    <div class="p-4" {{ turbo_stream_listen('App\\Entity\\Chapter') }}>
         {% for volume, chapters in chapters_by_volume %}
             {% set is_first = loop.first %}
             {% set volume_cbz_path = chapters|first.cbzPath %}
@@ -63,7 +63,7 @@
                                 <th class="px-4 py-2 text-right">Actions</th>
                             </tr>
                             </thead>
-                            <tbody>
+                            <tbody id="volume-{{ volume }}">
                             {% if all_chapters_same_cbz and volume_cbz_path is not null %}
                                 <tr class="border-t hover:bg-green-100">
                                     <td class="px-4 py-2 text-green-500">
@@ -85,54 +85,7 @@
                                 </tr>
                             {% else %}
                                 {% for chapter in chapters %}
-                                    <tr class="border-t hover:bg-green-100">
+                                    {% include 'manga/_chapter_row.html.twig' with {'chapter': chapter, 'manga': manga} %}
-                                        {% if chapter.cbzPath is not null %}
-                                            <td class="px-4 py-2 text-green-500">
-                                                <a data-turbo-frame="_top" href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
-                                                    {{ '%02d'|format(chapter.number) }}
-                                                </a>
-                                            </td>
-                                        {% else %}
-                                            <td class="px-4 py-2">{{ '%02d'|format(chapter.number) }}</td>
-                                        {% endif %}
-
-                                        <td class="px-4 py-2 w-full text-left">
-                                            {% if chapter.cbzPath is not null %}
-                                                <a data-turbo-frame="_top" href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
-                                                    {{ chapter.title ?? 'No title' }}
-                                                </a>
-                                            {% else %}
-                                                {{ chapter.title ?? 'No title' }}
-                                            {% endif %}
-                                        </td>
-                                        <td class="px-4 py-2 flex justify-end gap-2">
-                                            {% if chapter.cbzPath is null %}
-                                                <button
-                                                    data-controller="download"
-                                                    data-action="download#download"
-                                                    data-download-url-value="{{ path('search_chapter', {id: chapter.id}) }}"
-                                                >
-                                                    <span class="text-gray-500 hover:text-green-500">
-                                                        <i data-download-target="icon" class="fas fa-search"></i>
-                                                    </span>
-                                                </button>
-                                            {% else %}
-                                                <button disabled>
-                                                    <span class="text-gray-500">
-                                                        <i class="fas fa-search"></i>
-                                                    </span>
-                                                </button>
-                                            {% endif %}
-                                            <a href="#"
-                                               data-controller="download"
-                                               data-action="download#download"
-                                               data-download-url-value="{{ path('download_cbz', {chapterId: chapter.id}) }}"
-                                               class="w-8 text-center">
-                                                <i data-download-target="icon"
-                                                   class="fas fa-download text-gray-500 hover:text-green-500"></i>
-                                            </a>
-                                        </td>
-                                    </tr>
                                 {% endfor %}
                             {% endif %}
                             </tbody>

templates/manga/_chapter_row.html.twig

@@ -0,0 +1,48 @@
+<tr id="chapter-{{ chapter.id }}" class="border-t hover:bg-green-100">
+    {% if chapter.cbzPath is not null %}
+        <td class="px-4 py-2 text-green-500">
+            <a data-turbo-frame="_top" href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
+                {{ '%02d'|format(chapter.number) }}
+            </a>
+        </td>
+    {% else %}
+        <td class="px-4 py-2">{{ '%02d'|format(chapter.number) }}</td>
+    {% endif %}
+
+    <td class="px-4 py-2 w-full text-left">
+        {% if chapter.cbzPath is not null %}
+            <a data-turbo-frame="_top" href="{{ path('app_manga_read', { mangaSlug: manga.slug, chapterNumber: chapter.number, pageNumber: 1 }) }}">
+                {{ chapter.title ?? 'No title' }}
+            </a>
+        {% else %}
+            {{ chapter.title ?? 'No title' }}
+        {% endif %}
+    </td>
+    <td class="px-4 py-2 flex justify-end gap-2">
+        {% if chapter.cbzPath is null %}
+            <button
+                data-controller="download"
+                data-action="download#download"
+                data-download-url-value="{{ path('search_chapter', {id: chapter.id}) }}"
+            >
+                <span class="text-gray-500 hover:text-green-500">
+                    <i data-download-target="icon" class="fas fa-search"></i>
+                </span>
+            </button>
+        {% else %}
+            <button disabled>
+                <span class="text-gray-500">
+                    <i class="fas fa-search"></i>
+                </span>
+            </button>
+        {% endif %}
+        <a href="#"
+           data-controller="download"
+           data-action="download#download"
+           data-download-url-value="{{ path('download_cbz', {chapterId: chapter.id}) }}"
+           class="w-8 text-center">
+            <i data-download-target="icon"
+               class="fas fa-download text-gray-500 hover:text-green-500"></i>
+        </a>
+    </td>
+</tr>

templates/manga/_list.html.twig

@@ -1,6 +1,5 @@
 {% block body %}
         {% if currentView == 'poster' %}
-            {# Vue poster actuelle #}
             <div
                 class="w-full p-4 grid sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-8 2xl:grid-cols-12 gap-4">
                 {% for manga in mangas %}
@@ -25,7 +24,6 @@
                 {% endfor %}
             </div>
         {% elseif currentView == 'resume' %}
-            {# Vue résumé #}
             <div class="w-full p-4 space-y-4">
                 {% for manga in mangas %}
                     <div