Repository: symfony/ux
Pull request #2302 (2024-10-25 13:40:30)

[Turbo] Add generic `<Turbo:Stream>` component
| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | yes
| Issues        | https://github.com/symfony/ux/pull/2298#issuecomment-2434799250
| License       | MIT

I added a generic Turbo Stream component. To use it, you can do this:

```twig
<twig:Turbo:Stream action="turbo_frame_reload" targets="#count-post" />
```

The rendering is:

```twig
<turbo-stream action="turbo_frame_reload" targets="#count-post"></turbo-stream>
```

smnandre: Is there any advantage here (apart from the syntax) ?

Because 

```html
<turbo-frame foo bar>foo bar</turbo-frame>
```

and

```twig
<twig:Turbo:Frame foo bar>
foo bar
</twig:Turbo:Frame>
```

have a real difference in term of performance.

But i get the target to cover all bases of turbo with one syntax. 

Thinking outloud here.. not sure what to do.

I wonder if we should not make a search/replace here, instead of calling an embedding component 🤷 
But then, it would be difficult to explain the differences in scope
seb-jean: > Can you also update the CHANGELOG here please? Thanks

Done
seb-jean: > Is there any advantage here (apart from the syntax) ?
> 
> Because
> 
> ```
> <turbo-frame foo bar>foo bar</turbo-frame>
> ```
> 
> and
> 
> ```
> <twig:Turbo:Frame foo bar>
> foo bar
> </twig:Turbo:Frame>
> ```
> 
> have a real difference in term of performance.
> 
> But i get the target to cover all bases of turbo with one syntax.
> 
> Thinking outloud here.. not sure what to do.
> 
> I wonder if we should not make a search/replace here, instead of calling an embedding component 🤷 But then, it would be difficult to explain the differences in scope

This comment is rather related to this PR I think no?: https://github.com/symfony/ux/pull/2303

Patch:
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
deleted file mode 100644
index 6b7e9370..00000000
--- a/.github/CODEOWNERS
+++ /dev/null
@@ -1,3 +0,0 @@
-src/LazyImage @Kocal
-src/Map @Kocal
-src/Translator @Kocal
diff --git a/src/StimulusBundle/src/AssetMapper/ControllersMapGenerator.php b/src/StimulusBundle/src/AssetMapper/ControllersMapGenerator.php
index b99f5ffb..4eb66984 100644
--- a/src/StimulusBundle/src/AssetMapper/ControllersMapGenerator.php
+++ b/src/StimulusBundle/src/AssetMapper/ControllersMapGenerator.php
@@ -77,7 +77,7 @@ class ControllersMapGenerator
             $name = str_replace(['_', '/', '\\'], ['-', '--', '--'], $name);
 
             $asset = $this->assetMapper->getAssetFromSourcePath($file->getRealPath());
-            $content = file_get_contents($asset->sourcePath);
+            $content = $asset->content ?: file_get_contents($asset->sourcePath);
             $isLazy = preg_match('/\/\*\s*stimulusFetch:\s*\'lazy\'\s*\*\//i', $content);
 
             $controllersMap[$name] = new MappedControllerAsset($asset, $isLazy);
diff --git a/src/Turbo/CHANGELOG.md b/src/Turbo/CHANGELOG.md
index df89967e..cd68756d 100644
--- a/src/Turbo/CHANGELOG.md
+++ b/src/Turbo/CHANGELOG.md
@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 2.22.0
+
+-   Add `<twig:Turbo:Stream>` component
+
 ## 2.21.0
 
 -   Add `Helper/TurboStream::append()` et al. methods
diff --git a/src/Turbo/templates/components/Stream.html.twig b/src/Turbo/templates/components/Stream.html.twig
new file mode 100644
index 00000000..69805a8e
--- /dev/null
+++ b/src/Turbo/templates/components/Stream.html.twig
@@ -0,0 +1,3 @@
+{% props action -%}
+
+<turbo-stream action="{{ action }}" {{- attributes }}></turbo-stream>
diff --git a/ux.symfony.com/compose.override.yml b/ux.symfony.com/docker-compose.override.yml
similarity index 88%
rename from ux.symfony.com/compose.override.yml
rename to ux.symfony.com/docker-compose.override.yml
index ab4d2054..50f0fab6 100644
--- a/ux.symfony.com/compose.override.yml
+++ b/ux.symfony.com/docker-compose.override.yml
@@ -1,3 +1,5 @@
+version: '3'
+
 services:
 ###> symfony/mercure-bundle ###
   mercure:
diff --git a/ux.symfony.com/compose.yml b/ux.symfony.com/docker-compose.yml
similarity index 82%
rename from ux.symfony.com/compose.yml
rename to ux.symfony.com/docker-compose.yml
index 7484a1fc..c04df4d6 100644
--- a/ux.symfony.com/compose.yml
+++ b/ux.symfony.com/docker-compose.yml
@@ -1,3 +1,5 @@
+version: '3'
+
 services:
 ###> symfony/mercure-bundle ###
   mercure:
@@ -10,6 +12,8 @@ services:
       # Set the URL of your Symfony project (without trailing slash!) as value of the cors_origins directive
       MERCURE_EXTRA_DIRECTIVES: |
         cors_origins https://127.0.0.1:9044
+    # Comment the following line to disable the development mode
+    command: /usr/bin/caddy run --config /etc/caddy/Caddyfile.dev
     volumes:
       - mercure_data:/data
       - mercure_config:/config


Test patch:
diff --git a/src/StimulusBundle/tests/AssetMapper/ControllersMapGeneratorTest.php b/src/StimulusBundle/tests/AssetMapper/ControllerMapGeneratorTest.php
similarity index 89%
rename from src/StimulusBundle/tests/AssetMapper/ControllersMapGeneratorTest.php
rename to src/StimulusBundle/tests/AssetMapper/ControllerMapGeneratorTest.php
index 21277b28..11cbfe42 100644
--- a/src/StimulusBundle/tests/AssetMapper/ControllersMapGeneratorTest.php
+++ b/src/StimulusBundle/tests/AssetMapper/ControllerMapGeneratorTest.php
@@ -20,7 +20,7 @@ use Symfony\UX\StimulusBundle\AssetMapper\ControllersMapGenerator;
 use Symfony\UX\StimulusBundle\AssetMapper\MappedControllerAutoImport;
 use Symfony\UX\StimulusBundle\Ux\UxPackageReader;
 
-class ControllersMapGeneratorTest extends TestCase
+class ControllerMapGeneratorTest extends TestCase
 {
     public function testGetControllersMap()
     {
@@ -41,12 +41,7 @@ class ControllersMapGeneratorTest extends TestCase
                     $logicalPath = substr($path, $assetsPosition + 1);
                 }
 
-                $content = null;
-                if (str_ends_with($path, 'minified-controller.js')) {
-                    $content = 'import{Controller}from"@hotwired/stimulus";export default class extends Controller{}';
-                }
-
-                return new MappedAsset($logicalPath, $path, content: $content);
+                return new MappedAsset($logicalPath, $path, content: file_get_contents($path));
             });
 
         $packageReader = new UxPackageReader(__DIR__.'/../fixtures');
@@ -78,8 +73,8 @@ class ControllersMapGeneratorTest extends TestCase
         $map = $generator->getControllersMap();
         // + 3 controller.json UX controllers
         // - 1 controllers.json UX controller is disabled
-        // + 10 custom controllers (1 file is not a controller & 1 is overridden)
-        $this->assertCount(12, $map);
+        // + 9 custom controllers (1 file is not a controller & 1 is overridden)
+        $this->assertCount(11, $map);
         $packageNames = array_keys($map);
         sort($packageNames);
         $this->assertSame([
@@ -89,7 +84,6 @@ class ControllersMapGeneratorTest extends TestCase
             'hello',
             'hello-with-dashes',
             'hello-with-underscores',
-            'minified',
             'other',
             'subdir--deeper',
             'subdir--deeper-with-dashes',
@@ -121,8 +115,5 @@ class ControllersMapGeneratorTest extends TestCase
 
         $otherController = $map['other'];
         $this->assertTrue($otherController->isLazy);
-
-        $minifiedController = $map['minified'];
-        $this->assertTrue($minifiedController->isLazy);
     }
 }
diff --git a/src/StimulusBundle/tests/AssetMapper/StimulusControllerLoaderFunctionalTest.php b/src/StimulusBundle/tests/AssetMapper/StimulusControllerLoaderFunctionalTest.php
index 58bb6c8c..877073ff 100644
--- a/src/StimulusBundle/tests/AssetMapper/StimulusControllerLoaderFunctionalTest.php
+++ b/src/StimulusBundle/tests/AssetMapper/StimulusControllerLoaderFunctionalTest.php
@@ -63,9 +63,8 @@ class StimulusControllerLoaderFunctionalTest extends WebTestCase
                 // 2x from UX packages, which are enabled in controllers.json
                 '/assets/fake-vendor/ux-package1/package-controller-second.js',
                 '/assets/fake-vendor/ux-package2/package-hello-controller.js',
-                // 3x from more-controllers
+                // 2x from more-controllers
                 '/assets/more-controllers/hello-controller.js',
-                '/assets/more-controllers/minified-controller.js',
                 '/assets/more-controllers/other-controller.js',
                 // 5x from importmap.php
                 '@hotwired/stimulus',
diff --git a/src/StimulusBundle/tests/fixtures/assets/more-controllers/minified-controller.js b/src/StimulusBundle/tests/fixtures/assets/more-controllers/minified-controller.js
deleted file mode 100644
index 2eb85a71..00000000
--- a/src/StimulusBundle/tests/fixtures/assets/more-controllers/minified-controller.js
+++ /dev/null
@@ -1,6 +0,0 @@
-// minified-controller.js
-import { Controller } from '@hotwired/stimulus';
-
-/* stimulusFetch: 'lazy' */
-export default class extends Controller {
-}