fix: monitors page & pagination

src/Download/Framework/Repository/DownloadRepository.php

@@ -25,7 +25,7 @@ class DownloadRepository extends ServiceEntityRepository
         $this->paginator = $paginator;
     }
 
-    public function getCompletePaginated(UserInterface $user, int $pageNumber = 1, int $perPage = 10)
+    public function getCompletePaginated(UserInterface $user, int $pageNumber = 1, int $perPage = 10): Paginator
     {
         $query = $this->createQueryBuilder('d')
             ->andWhere('d.status IN (:statuses)')
@@ -38,7 +38,7 @@ class DownloadRepository extends ServiceEntityRepository
         return $this->paginator->paginate($query, $pageNumber, $perPage);
     }
 
-    public function getActivePaginated(UserInterface $user, int $pageNumber = 1, int $perPage = 5)
+    public function getActivePaginated(UserInterface $user, int $pageNumber = 1, int $perPage = 5): Paginator
     {
         $query = $this->createQueryBuilder('d')
             ->andWhere('d.status IN (:statuses)')

src/Monitor/Framework/Controller/WebController.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace App\Monitor\Framework\Controller;
+
+use App\Download\Action\Input\DeleteDownloadInput;
+use App\Monitor\Action\Handler\AddMonitorHandler;
+use App\Monitor\Action\Handler\DeleteMonitorHandler;
+use App\Monitor\Action\Input\AddMonitorInput;
+use App\Monitor\Action\Input\DeleteMonitorInput;
+use App\Monitor\Framework\Repository\MonitorRepository;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Bundle\SecurityBundle\Security;
+use Symfony\Component\DependencyInjection\Attribute\Autowire;
+use Symfony\Component\Mercure\HubInterface;
+use Symfony\Component\Mercure\Update;
+use Symfony\Component\Routing\Attribute\Route;
+use Twig\Environment;
+
+class WebController extends AbstractController
+{
+    public function __construct(
+        #[Autowire(service: 'twig')]
+        private readonly Environment $renderer,
+    ) {}
+
+    #[Route('/monitors', name: 'app_monitors', methods: ['GET'])]
+    public function addMonitor()
+    {
+        return $this->render('monitor/index.html.twig');
+    }
+}

src/Monitor/Framework/Repository/MonitorRepository.php

@@ -21,7 +21,7 @@ class MonitorRepository extends ServiceEntityRepository
         $this->paginator = $paginator;
     }
 
-    public function getUserMonitorsPaginated(UserInterface $user, int $page, int $perPage)
+    public function getUserMonitorsPaginated(UserInterface $user, int $page, int $perPage): Paginator
     {
         $query = $this->createQueryBuilder('m')
             ->andWhere('m.status IN (:statuses)')

src/Twig/Components/MonitorList.php

@@ -4,13 +4,19 @@ namespace App\Twig\Components;
 
 use App\Monitor\Framework\Repository\MonitorRepository;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
 use Symfony\UX\LiveComponent\Attribute\LiveAction;
-use Symfony\UX\LiveComponent\Attribute\LiveArg;
-use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;
+use Symfony\UX\LiveComponent\Attribute\LiveProp;
+use Symfony\UX\LiveComponent\DefaultActionTrait;
 
-#[AsTwigComponent]
+#[AsLiveComponent]
 final class MonitorList extends AbstractController
 {
+    use DefaultActionTrait;
+
+    use PaginateTrait;
+
+    #[LiveProp(writable: true)]
     public bool $isWidget = true;
 
     public function __construct(
@@ -18,8 +24,8 @@ final class MonitorList extends AbstractController
     ) {}
 
     #[LiveAction]
-    public function getUserMonitors(#[LiveArg] int $page = 1, #[LiveArg] int $perPage = 5)
+    public function getUserMonitors()
     {
-        return $this->monitorRepository->getUserMonitorsPaginated($this->getUser(), $page, $perPage);
+        return $this->monitorRepository->getUserMonitorsPaginated($this->getUser(), $this->pageNumber, $this->perPage);
     }
 }

src/Twig/Components/PaginateTrait.php

@@ -0,0 +1,22 @@
+<?php
+
+namespace App\Twig\Components;
+
+use Symfony\UX\LiveComponent\Attribute\LiveAction;
+use Symfony\UX\LiveComponent\Attribute\LiveArg;
+use Symfony\UX\LiveComponent\Attribute\LiveProp;
+
+trait PaginateTrait
+{
+    #[LiveProp(writable: true)]
+    public int $pageNumber = 1;
+
+    #[LiveProp(writable: true)]
+    public int $perPage = 5;
+
+    #[LiveAction]
+    public function paginate(#[LiveArg] int $page)
+    {
+        $this->pageNumber = $page;
+    }
+}

templates/components/MonitorList.html.twig

@@ -61,10 +61,10 @@
                     </td>
                 </tr>
             {% endfor %}
-            {% if this.userMonitors.items|length > 5 %}
+            {% if this.isWidget and this.userMonitors.items|length > 5 %}
                 <tr  id="monitor_view_all">
                     <td colspan="100%" class="py-2 whitespace-nowrap bg-orange-500 uppercase text-sm font-medium text-center text-white min-w-[50ch] max-w-[50ch] truncate">
-                        <a href="#">View All Monitors</a>
+                        <a href="{{ path('app_monitors') }}">View All Monitors</a>
                     </td>
                 </tr>
             {% endif %}

templates/components/NavBar.html.twig

@@ -20,6 +20,15 @@
                 </a>
             </li>
 
+            <li>
+                <a href="{{ path('app_monitors') }}"
+                   class="block rounded-lg
+                         bg-orange-500 hover:bg-opacity-80 bg-clip-padding backdrop-filter backdrop-blur-md bg-opacity-60
+                         px-4 py-2 text-sm font-medium text-gray-50">
+                    Monitors
+                </a>
+            </li>
+
             <li>
                 <a href="{{ path('app_user_preferences') }}"
                    class="block rounded-lg px-4 py-2 text-sm font-medium text-gray-50 hover:bg-gray-100 hover:text-stone-700">

templates/monitor/index.html.twig

@@ -0,0 +1,12 @@
+{% extends 'base.html.twig' %}
+
+{% block title %}Monitors — Torsearch{% endblock %}
+{% block h2 %}Monitors{% endblock %}
+
+{% block body %}
+    <div class="p-4">
+        <twig:Card title="Monitors">
+            <twig:MonitorList :isWidget="false" :perPage="10"></twig:MonitorList>
+        </twig:Card>
+    </div>
+{% endblock %}