feat: added symfony/ux-turbo

strangebuzz · Apr 1, 2024 · 799127f · 799127f
1 parent 15429cd
commit 799127f
Show file tree

Hide file tree

Showing 11 changed files with 172 additions and 7 deletions.
diff --git a/Makefile b/Makefile
@@ -27,7 +27,7 @@ go-dev: ## Switch to the development environment
 	@rm -rf ./public/assets/*
 	#@composer dump-autoload
 
-warmup: ## Warmup the dev cache for the statis analysis
+warmup: ## Warmup the dev cache for the static analysis
 	@bin/console c:w --env=dev
 
 purge: ## Purge all Symfony cache and logs

diff --git a/README.md b/README.md
@@ -13,7 +13,7 @@ I'll update it when needed:
 So, this blog post is the official documentation.
 This readme is a teaser of what MicroSymfony contains.
 
-If you want to use the last Symfony **6.4 LTS** version, in your `composer.json`
+If you want to use the last Symfony **6.4 LTS** version in your `composer.json`
 file, replace all occurrences of `7.0` with `6.4`, run `composer up`, and you are
 done.
 
@@ -23,7 +23,7 @@ done.
 Because a live demo is always better than all explanations. Here is it:
 
 * Live demo at [https://microsymfony.ovh](https://microsymfony.ovh)
-* Live demo powered by FrankenPHP at [https://frankenphp.microsymfony.ovh](https://frankenphp.microsymfony.ovh)
+* Live demo powered by [FrankenPHP](#frankenphp-) at [https://frankenphp.microsymfony.ovh](https://frankenphp.microsymfony.ovh)
 
 
 ## Quick-start with the Symfony binary 🎶 
@@ -90,7 +90,8 @@ Open [https://localhost](https://localhost) and enjoy! 🙂
 
 * [Symfony 7.0](https://symfony.com/7)
 * [Twig 3.8](https://twig.symfony.com)
-* [Stimulus 3.2](https://stimulus.hotwired.dev/)
+* [hotwired/stimulus 3.2](https://stimulus.hotwired.dev/)
+* [hotwired/turbo 7.3](https://turbo.hotwired.dev/)
 * [PHPUnit 11.0](https://phpunit.de)
 * The classless [BareCSS](http://barecss.com) CSS framework
 
@@ -128,6 +129,14 @@ to fix some issues as the project is not maintained anymore.
   * [Demo](https://microsymfony.ovh/404) 
 
 
+## Notes 📒
+
+Turbo forms are disabled in [assets/app.js](assets/app.js).
+To enable the feature for a given form, add the `data-turbo="true"` attribute to it. 
+Or change the parameter `Turbo.setFormMode` to `on` to activate the feature globally.
+In both cases, your controller code has to be [modified accordingly](https://symfony.com/bundles/ux-turbo/current/index.html#3-form-response-code-changes).
+
+
 ## Other good practices 👌
 
 * Using strict types in all PHP files ([source](https://github.com/strangebuzz/MicroSymfony/blob/main/src/Controller/AppController.php#L3))

diff --git a/assets/app.js b/assets/app.js
@@ -9,4 +9,8 @@ import './bootstrap.js';
 import './vendor/barecss/css/bare.min.css';
 import './styles/app.css';
 
+// "optin" - No turbo forms unless you insist. Use data-turbo="true" to enable turbo on individual forms.
+// @see https://stackoverflow.com/a/76286583/633864
+Turbo.setFormMode('optin') // "on" | "off" | "optin"
+
 console.log('This log comes from assets/app.js - welcome to AssetMapper! 🎉')
diff --git a/assets/controllers.json b/assets/controllers.json
@@ -1,4 +1,15 @@
 {
-    "controllers": [],
+    "controllers": {
+        "@symfony/ux-turbo": {
+            "turbo-core": {
+                "enabled": true,
+                "fetch": "eager"
+            },
+            "mercure-turbo-stream": {
+                "enabled": false,
+                "fetch": "eager"
+            }
+        }
+    },
     "entrypoints": []
 }
diff --git a/assets/vendor/@hotwired/turbo/turbo.index.js b/assets/vendor/@hotwired/turbo/turbo.index.js
diff --git a/composer.json b/composer.json
@@ -38,6 +38,7 @@
         "symfony/stimulus-bundle": "^2.0",
         "symfony/string": "7.0.*",
         "symfony/twig-bundle": "~7.0.0",
+        "symfony/ux-turbo": "^2.16",
         "symfony/validator": "~7.0.0",
         "symfony/web-link": "7.0.*",
         "symfony/yaml": "~7.0.0",

diff --git a/composer.lock b/composer.lock
diff --git a/config/bundles.php b/config/bundles.php
@@ -9,4 +9,5 @@
     Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true],
     Symfony\UX\StimulusBundle\StimulusBundle::class => ['all' => true],
     Symfony\Bundle\WebProfilerBundle\WebProfilerBundle::class => ['dev' => true, 'test' => true],
+    Symfony\UX\Turbo\TurboBundle::class => ['all' => true],
 ];
diff --git a/importmap.php b/importmap.php
@@ -25,7 +25,10 @@
         'path' => '@symfony/stimulus-bundle/loader.js',
     ],
     'barecss/css/bare.min.css' => [
-        'version' => '1.2.0',
+        'version' => '1.1.0',
         'type' => 'css',
     ],
+    '@hotwired/turbo' => [
+        'version' => '7.3.0',
+    ],
 ];
diff --git a/symfony.lock b/symfony.lock
@@ -144,6 +144,9 @@
             "templates/base.html.twig"
         ]
     },
+    "symfony/ux-turbo": {
+        "version": "v2.16.0"
+    },
     "symfony/validator": {
         "version": "6.2",
         "recipe": {

diff --git a/templates/_form.html.twig b/templates/_form.html.twig
@@ -0,0 +1,3 @@
+<div id="user-form">
+    {{ form(form, {'attr': {'novalidate': 'novalidate'}}) }}
+</div>