[Site] Clean demo names / tpl

ux.symfony.com/assets/styles/app.scss

@@ -125,6 +125,7 @@ $utilities: map-remove(
 // Components
 @import "components/Badge";
 @import "components/Banner";
+@import "components/Button";
 @import "components/Browser";
 @import "components/Changelog";
 @import "components/DataList";

ux.symfony.com/assets/styles/components/_Button.scss

@@ -0,0 +1,19 @@
+.Button {
+  display: inline-flex;
+  align-items: center;
+  justify-items: flex-end;
+
+  border-radius: 1.5rem;
+  padding: 0.75rem 1.5rem;
+  gap: .75rem;
+
+  background: var(--bs-body-bg);
+  color: var(--bs-body-color);
+}
+
+.Button--dark {
+  background: var(--bs-body-color);
+  color: var(--bs-body-bg);
+  color: #dee2e6;
+  border: 1px solid #a6a0a0;
+}

ux.symfony.com/assets/styles/sections/_hero.scss

@@ -2,15 +2,6 @@
   padding-top: 5rem;
 }
 
-.rainbow-emphasis {
-  background: linear-gradient(113.84deg, #D65831 0%, #D2D631 36.52%, #31D673 71.83%, #315FD6 100%);
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  font-style: normal;
-  filter: brightness(102%) contrast(200%) drop-shadow(1px 1px 1px #0004);
-  letter-spacing: 0;
-}
-
 .hero-background {
   padding-block-start: 4rem;
 }

ux.symfony.com/src/Controller/Demo/LiveComponentDemoController.php → ux.symfony.com/src/Controller/Demo/LiveDemoController.php

@@ -24,22 +24,14 @@
 use Symfony\Component\Routing\Attribute\Route;
 
 #[Route('/demos/live-component')]
-class LiveComponentDemoController extends AbstractController
+class LiveDemoController extends AbstractController
 {
     #[Route('/', name: 'app_demo_live_component')]
     public function __invoke(): Response
     {
         return $this->redirectToRoute('app_demos');
     }
 
-    #[Route('/auto-validating-form', name: 'app_demo_live_component_auto_validating_form')]
-    public function demoAutoValidatingForm(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/auto_validating_form.html.twig', [
-            'demo' => $liveDemoRepository->find('auto-validating-form'),
-        ]);
-    }
-
     #[Route('/form-collection-type/{id}', name: 'app_demo_live_component_form_collection_type', defaults: ['id' => null])]
     public function demoFormCollectionType(LiveDemoRepository $liveDemoRepository, Request $request, TodoListRepository $todoListRepository, ?TodoList $todoList = null): Response
     {
@@ -66,14 +58,6 @@ public function demoFormCollectionType(LiveDemoRepository $liveDemoRepository, R
         ]);
     }
 
-    #[Route('/dependent-form-fields', name: 'app_demo_live_component_dependent_form_fields')]
-    public function demoDependentFormFields(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/dependent_form_fields.html.twig', [
-            'demo' => $liveDemoRepository->find('dependent-form-fields'),
-        ]);
-    }
-
     #[Route('/voting', name: 'app_demo_live_component_voting')]
     public function demoVoting(LiveDemoRepository $liveDemoRepository, FoodRepository $foodRepository): Response
     {
@@ -97,14 +81,6 @@ public function inlineEdit(LiveDemoRepository $liveDemoRepository, FoodRepositor
         ]);
     }
 
-    #[Route('/chartjs', name: 'app_demo_live_component_chartjs')]
-    public function chartJs(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/chartjs.html.twig', parameters: [
-            'demo' => $liveDemoRepository->find('chartjs'),
-        ]);
-    }
-
     #[Route('/invoice/{id}', name: 'app_demo_live_component_invoice', defaults: ['id' => null])]
     public function invoice(LiveDemoRepository $liveDemoRepository, ?Invoice $invoice = null): Response
     {
@@ -116,35 +92,20 @@ public function invoice(LiveDemoRepository $liveDemoRepository, ?Invoice $invoic
         ]);
     }
 
+    #[Route('/{demo}', name: 'app_demo_live_component_demo')]
+    #[Route('/auto-validating-form', name: 'app_demo_live_component_auto_validating_form')]
+    #[Route('/chartjs', name: 'app_demo_live_component_chartjs')]
+    #[Route('/dependent-form-fields', name: 'app_demo_live_component_dependent_form_fields')]
     #[Route('/infinite-scroll', name: 'app_demo_live_component_infinite_scroll')]
-    public function infiniteScroll(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/infinite_scroll.html.twig', parameters: [
-            'demo' => $liveDemoRepository->find('infinite-scroll'),
-        ]);
-    }
-
     #[Route('/infinite-scroll-2', name: 'app_demo_live_component_infinite_scroll_2')]
-    public function infiniteScroll2(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/infinite_scroll_2.html.twig', parameters: [
-            'demo' => $liveDemoRepository->find('infinite-scroll-2'),
-        ]);
-    }
-
     #[Route('/product-form', name: 'app_demo_live_component_product_form')]
-    public function productForm(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/product_form.html.twig', parameters: [
-            'demo' => $liveDemoRepository->find('product-form'),
-        ]);
-    }
-
     #[Route('/upload', name: 'app_demo_live_component_upload')]
-    public function uploadFiles(LiveDemoRepository $liveDemoRepository): Response
-    {
-        return $this->render('demos/live_component/upload.html.twig', parameters: [
-            'demo' => $liveDemoRepository->find('upload'),
-        ]);
+    public function demo(
+        LiveDemoRepository $liveDemoRepository,
+        string $demo,
+    ): Response {
+        $demo = $liveDemoRepository->find($demo);
+
+        return $this->render($demo->getTemplate(), ['demo' => $demo]);
     }
 }

ux.symfony.com/src/Controller/Demo/LiveMemoryController.php

@@ -21,6 +21,7 @@
 class LiveMemoryController extends AbstractController
 {
     #[Route('/', name: 'app_demo_live_memory')]
+    #[Route('/', name: 'app_demo_live_component_live_memory')]
     public function __invoke(LiveDemoRepository $liveDemoRepository): Response
     {
         return $this->render('demos/live_memory/index.html.twig', [
@@ -33,6 +34,7 @@ public function __invoke(LiveDemoRepository $liveDemoRepository): Response
      * from the session. This can be useful when you want to start over.
      */
     #[Route('/reset', name: 'app_demo_live_memory_reset', env: 'dev')]
+    #[Route('/reset', name: 'app_demo_live_component_live_memory_reset', env: 'dev')]
     public function reset(GameStorageInterface $gameStorage): Response
     {
         $gameStorage->saveGame(null);

ux.symfony.com/src/Model/Demo.php

@@ -0,0 +1,58 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <[email protected]>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace App\Model;
+
+class Demo
+{
+    public function __construct(
+        private string $identifier,
+        private string $name,
+        private string $description,
+        private Person|string $author,
+        private \DateTimeImmutable|string $publishedAt,
+        private array $tags,
+    ) {
+    }
+
+    public function getIdentifier(): string
+    {
+        return $this->identifier;
+    }
+
+    public function getName(): string
+    {
+        return $this->name;
+    }
+
+    public function getDescription(): string
+    {
+        return $this->description;
+    }
+
+    /**
+     * @return list<string>
+     */
+    public function getTags(): array
+    {
+        return $this->tags;
+    }
+
+    public function getAuthor(): Person|string
+    {
+        return $this->author;
+    }
+
+    public function getPublishedAt(): \DateTimeImmutable|string
+    {
+        return $this->publishedAt;
+    }
+}

ux.symfony.com/src/Model/LiveDemo.php

@@ -11,53 +11,37 @@
 
 namespace App\Model;
 
-class LiveDemo
+final class LiveDemo extends Demo
 {
     public function __construct(
-        private string $identifier,
-        private string $name,
-        private string $description,
-        private string $route,
+        string $identifier,
+        string $name,
+        string $description,
+        string $author,
+        string $publishedAt,
+        array $tags,
         private string $longDescription,
-        /**
-         * @var string[]
-         */
-        private array $tags = [],
     ) {
+        parent::__construct($identifier, $name, $description, $author, $publishedAt, $tags);
     }
 
-    public function getIdentifier(): string
+    public function getRoute(): string
     {
-        return $this->identifier;
+        return 'app_demo_live_component_'.str_replace('-', '_', parent::getIdentifier());
     }
 
-    public function getName(): string
+    public function getScreenshotFilename(?string $format = null): string
     {
-        return $this->name;
+        return 'images/live_demo/'.parent::getIdentifier().($format ? ('-'.$format) : '').'.png';
     }
 
-    public function getDescription(): string
+    public function getTemplate(): string
     {
-        return $this->description;
+        return \sprintf('demos/live_component/%s.html.twig', str_replace('-', '_', parent::getIdentifier()));
     }
 
     public function getLongDescription(): string
     {
         return $this->longDescription;
     }
-
-    public function getRoute(): string
-    {
-        return $this->route;
-    }
-
-    public function getTags(): array
-    {
-        return $this->tags;
-    }
-
-    public function getScreenshotFilename(?string $format = null): string
-    {
-        return 'images/live_demo/'.$this->identifier.($format ? ('-'.$format) : '').'.png';
-    }
 }