pagination

assets/app/frontend/scss/carto-liste.scss

     }
   }
 
+  .navigation {
+    text-align: center;
+    margin-top: 25px;
+
+    .pagination {
+      display: inline;
+    }
+
+    .current {
+      font-family: FranklinGothic;
+    }
+
+    .previous, .first, .next, .last {
+      a {
+        color: $green;
+      }
+    }
+
+    a {
+      color: #808080;
+    }
+
+    span {
+      margin-left: 10px;
+      margin-right: 10px;
+    }
+  }
+
   .export {
     color: #FFF;
     background-color: #433937;
       tr:nth-child(odd) {
         background-color: #dcdcdc;
       }
+
       td {
         padding: 15px 20px 15px 20px;
       }

public/build/entrypoints.json

         "/build/app-frontend.5284a67c.js"
       ],
       "css": [
-        "/build/app-frontend.8f0b3f15.css"
+        "/build/app-frontend.33e42276.css"
       ]
     }
   }

public/build/manifest.json

   "build/sov-ticket.js": "/build/sov-ticket.df76c7a0.js",
   "build/app-backend.css": "/build/app-backend.3d882954.css",
   "build/app-backend.js": "/build/app-backend.e0a6620d.js",
-  "build/app-frontend.css": "/build/app-frontend.8f0b3f15.css",
+  "build/app-frontend.css": "/build/app-frontend.33e42276.css",
   "build/app-frontend.js": "/build/app-frontend.5284a67c.js",
   "build/runtime.js": "/build/runtime.3095b250.js",
   "build/vendors-node_modules_core-js_internals_export_js.2e873f33.js": "/build/vendors-node_modules_core-js_internals_export_js.2e873f33.js",

src/Controller/Frontend/DefaultController.php

 use App\Repository\ProjectInspiringStore;
 use App\Repository\RevoltStore;
 use Doctrine\ORM\EntityManagerInterface;
+use Knp\Component\Pager\PaginatorInterface;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Component\HttpFoundation\JsonResponse;
 use Symfony\Component\HttpFoundation\Response;
 
 class DefaultController extends AbstractController
 {
-    protected $em;
+    protected EntityManagerInterface $em;
     protected DreamStore $dreamStore;
     protected RevoltStore $revoltStore;
     protected ProjectBoostStore $projectBoostStore;
     protected ProjectInspiringStore $projectInspiringStore;
+    protected PaginatorInterface $paginator;
 
     public function __construct(
         EntityManagerInterface $em,
         DreamStore $dreamStore,
         RevoltStore $revoltStore,
         ProjectBoostStore $projectBoostStore,
-        ProjectInspiringStore $projectInspiringStore
+        ProjectInspiringStore $projectInspiringStore,
+        PaginatorInterface $paginator
     ) {
         $this->em = $em;
         $this->dreamStore = $dreamStore;
         $this->revoltStore = $revoltStore;
         $this->projectBoostStore = $projectBoostStore;
         $this->projectInspiringStore = $projectInspiringStore;
+        $this->paginator = $paginator;
     }
 
     public function home()
 
     public function cartoListe(Request $request)
     {
-        $dreamArray = $revoltArray = $projectBoostArray = $projectInspiringArray = $resultArray = array();
+        $dreamArray = $revoltArray = $projectBoostArray = $projectInspiringArray = $resultArray = $resultArrayPagination = array();
 
         $form = $this->createForm(SearchListForm::class);
         $form->handleRequest($request);
             }
 
             $resultArray = array_merge($dreamArray, $revoltArray, $projectBoostArray, $projectInspiringArray);
+
+            $resultArrayPagination = $this->paginator->paginate(
+                $resultArray,
+                $request->query->getInt('page', 1),
+                2
+            );
         }
 
         return $this->render(
             [
                 'form' => $form->createView(),
                 'nbContrib' => $this->countContrib(),
-                'resultArray' => $resultArray
+                'resultArray' => $resultArrayPagination
             ]
         );
     }

templates/frontend/carto-liste.html.twig

         </div>
         {{ form_end(form) }}
 
-        <div class="row">
-            <div class="col">
-                <a href="" class="export export-excel" title="Exporter Excel">Exporter au format Excel</a>
-                <a href="" class="export export-pdf" title="Exporter au format PDF">Exporter au format PDF</a>
-            </div>
-        </div>
         {% if resultArray %}
+            <div class="navigation">
+                {{ knp_pagination_render(resultArray) }}
+            </div>
+
+            <div class="row">
+                <div class="col">
+                    <a href="" class="export export-excel" title="Exporter Excel">Exporter au format Excel</a>
+                    <a href="" class="export export-pdf" title="Exporter au format PDF">Exporter au format PDF</a>
+                </div>
+            </div>
+
             <table class="table-search">
                 <thead>
                 <tr>