Merge branch 'Sylius:main' into translations/french

config/packages/sylius_twig_hooks.yaml

@@ -8,6 +8,11 @@ sylius_twig_hooks:
             page_body:
                 template: 'book/show/content/page_body.html.twig'
 
+        'sylius_admin.common.index.content.header.title_block':
+            title:
+                configuration:
+                    icon: tabler:list-details
+
         'sylius_admin.book.index.content.header':
             description:
                 template: 'book/index/content/header/description.html.twig'
@@ -25,3 +30,10 @@ sylius_twig_hooks:
                 props:
                     form: '@=_context.form'
                     initialFormData: '@=_context.resource'
+
+        'sylius_admin.speaker.index.content.header.title_block':
+            title:
+                template: '@SyliusBootstrapAdminUi/shared/crud/common/content/header/title_block/title.html.twig'
+                configuration:
+                    icon: tabler:users
+                    subheader: app.ui.managing_your_speakers

docs/README.md

@@ -10,8 +10,12 @@ The Sylius stack is a set of tools for your Symfony projects:
 * [**TwigHooks:** Composable Twig layouts](twig-hooks/getting-started.md)
 * [**UiTranslations:** Basic UI translations](ui-translations/getting-started.md)
 
-📖 Cookbook
+⚙️ Installation
 ----------------
 
-* [How to customize your admin panel](cookbook/admin_panel/index.md)
+* [Getting started](getting-started.md)
+
+📖 Cookbook
+----------------
 
+* [How to customize your admin panel](cookbook/admin_panel.md)

docs/SUMMARY.md

@@ -1,10 +1,11 @@
 # Table of contents
 
 * [Sylius Stack Documentation](README.md)
+* [Getting started](getting-started.md)
 
 ## Cookbook
 
-* [How to customize your admin panel](cookbook/admin_panel/index.md)
+* [How to customize your admin panel](cookbook/admin_panel.md)
   * [Basic operations](cookbook/admin_panel/basic_operations.md)
   * [Customizing the logo](cookbook/admin_panel/logo.md)
   * [Customizing the menu](cookbook/admin_panel/menu.md)

docs/bootstrap-admin-ui/getting-started.md

@@ -1,11 +1,11 @@
 ---
 description: >-
-    Bootstrap Admin Ui allow you to build your Bootstrap admin panels with Sylius and Symfony UX.
+    Bootstrap Admin Ui lets you build your Bootstrap admin panels using Sylius and Symfony UX.
 ---
 
 # Getting started
 
-This package configures content of the [AdminUi package](../admin-ui/getting-started.md) templates.
+This package lets you set up the content of the [AdminUi package](../admin-ui/getting-started.md) templates.
 
 ## Installation
 
@@ -17,15 +17,15 @@ composer require sylius/bootstrap-admin-ui
 
 ## Configuring the CRUD templates
 
-Content of CRUD templates is split into configurable blocks.
+CRUD templates are split into configurable blocks.
 
-You are able to add new blocks, disable existing ones, or reorder them using the [TwigHooks package](../twig-hooks/getting-started.md).
+You can add new blocks, disable existing ones, or reorder them using the [TwigHooks package](../twig-hooks/getting-started.md).
 
 ### Create
 
-This package configures content of the template to create a new resource.
+This package sets up the template content needed to create a new resource.
 
-This adds configurable blocks into the `@SyliusAdminUi/crud/create.html.twig` template.
+This adds configurable blocks to the `@SyliusAdminUi/crud/create.html.twig` template.
 
 **Overview of the blocks**
 
@@ -58,9 +58,9 @@ flowchart LR
 
 ### Index
 
-This package configures content of the template to list resources.
+This package sets up the template content needed to list resources.
 
-This adds configurable blocks into the `@SyliusAdminUi/crud/index.html.twig` template.
+This adds configurable blocks to the `@SyliusAdminUi/crud/index.html.twig` template.
 
 **Overview of the blocks**
 
@@ -81,9 +81,9 @@ flowchart LR
 
 ### Show
 
-This package configures content of the template to show resource details.
+This package sets up the template content needed to show resource details.
 
-This adds configurable blocks into the `@SyliusAdminUi/crud/show.html.twig` template.
+This adds configurable blocks to the `@SyliusAdminUi/crud/show.html.twig` template.
 
 **Overview of the blocks**
 

docs/cookbook/admin_panel.md

@@ -0,0 +1,7 @@
+# How to customize your admin panel
+
+* [Basic operations](admin_panel/basic_operations.md)
+* [Customizing the logo](admin_panel/logo.md)
+* [Customizing the menu](admin_panel/menu.md)
+* [Configuring the security access](admin_panel/security.md)
+* [Customizing the page titles](admin_panel/page_titles.md)

docs/cookbook/admin_panel/basic_operations.md

@@ -8,12 +8,67 @@
 
 </div>
 
-Create a grid for your resource.
+Create a grid for your resource using Symfony's Maker Bundle.
 
 ```shell
 bin/console make:grid
 ```
 
+Magic! Here is the generated grid.
+
+````php
+final class BookGrid extends AbstractGrid implements ResourceAwareGridInterface
+{
+    public function __construct()
+    {
+        // TODO inject services if required
+    }
+
+    public static function getName(): string
+    {
+        return 'app_book';
+    }
+
+    public function buildGrid(GridBuilderInterface $gridBuilder): void
+    {
+        $gridBuilder
+            // see https://github.com/Sylius/SyliusGridBundle/blob/master/docs/field_types.md
+            ->addField(
+                StringField::create('title')
+                    ->setLabel('Title')
+                    ->setSortable(true),
+            )
+            ->addField(
+                StringField::create('author')
+                    ->setLabel('Author')
+                    ->setSortable(true),
+            )
+            ->addActionGroup(
+                MainActionGroup::create(
+                    CreateAction::create(),
+                ),
+            )
+            ->addActionGroup(
+                ItemActionGroup::create(
+                    // ShowAction::create(),
+                    UpdateAction::create(),
+                    DeleteAction::create(),
+                ),
+            )
+            ->addActionGroup(
+                BulkActionGroup::create(
+                    DeleteAction::create(),
+                ),
+            )
+        ;
+    }
+
+    public function getResourceClass(): string
+    {
+        return Book::class;
+    }
+````
+
 Configure the `index` operation in your resource.
 
 ```php
@@ -46,7 +101,7 @@ Use the Symfony `debug:router` command to check the results.
 bin/console debug:router
 ```
 
-Your route should look like this.
+Your route should look like this:
 
 ```shell
  ------------------------------ ---------------------------
@@ -101,7 +156,7 @@ Use the Symfony `debug:router` command to check the results.
 bin/console debug:router
 ```
 
-Your route should look like this.
+Your route should look like this:
 
 ```shell
  ------------------------------ ---------------------------
@@ -152,7 +207,7 @@ Use the Symfony `debug:router` command to check the results.
 bin/console debug:router
 ```
 
-Your route should look like this.
+Your route should look like this:
 
 ```shell
  ------------------------------ ---------------------------
@@ -200,7 +255,7 @@ Use the Symfony `debug:router` command to check the results.
 bin/console debug:router
 ```
 
-Your route should look like this.
+Your route should look like this:
 
 ```shell
  ------------------------------ ---------------------------

docs/cookbook/admin_panel/logo.md

@@ -61,7 +61,7 @@ Choose the YAML or the PHP version.
 sylius_twig_hooks:
     hooks:
         # ...
-        'sylius_admin.security.login.logo':
+        'sylius_admin.security.login.page.logo':
             image:
                 # template: '@SyliusBootstrapAdminUi/security/common/logo/image.html.twig'
                 template: 'security/common/logo/image.html.twig'
@@ -75,7 +75,7 @@ use Symfony\Component\DependencyInjection\Loader\Configurator\ContainerConfigura
 return static function (ContainerConfigurator $containerConfigurator): void {
     // ...
 
-    // Add these following lines to define your own Twig template for the logo.
+    // Add the following lines to define your own Twig template for the logo.
     $containerConfigurator->extension('sylius_twig_hooks', [
         'hooks' => [
             'sylius_admin.security.login.logo' => [

docs/cookbook/admin_panel/menu.md

@@ -2,7 +2,7 @@
 
 ## How to customize the sidebar menu
 
-You should decorate the `sylius_admin_ui.knp.menu_builder` service to customize the admin menu.
+To customize the admin menu, you need to decorate the `sylius_admin_ui.knp.menu_builder` service.
 
 ```php
 declare(strict_types=1);
@@ -11,7 +11,7 @@ namespace App\Menu;
 
 use Knp\Menu\FactoryInterface;
 use Knp\Menu\ItemInterface;
-use Sylius\AdminUi\Knp\Menu\MenuBuilderInterface
+use Sylius\AdminUi\Knp\Menu\MenuBuilderInterface;
 use Symfony\Component\DependencyInjection\Attribute\AsDecorator;
 
 #[AsDecorator(decorates: 'sylius_admin_ui.knp.menu_builder')]
@@ -31,8 +31,10 @@ final readonly class MenuBuilder implements MenuBuilderInterface
                 'route' => 'sylius_admin_ui_dashboard',
             ])
             ->setLabel('sylius.ui.dashboard')
-            ->setLabelAttribute('icon', 'dashboard')
+            ->setLabelAttribute('icon', 'tabler:dashboard')
         ;
+
+        return $menu;
     }
 }
 ```

docs/cookbook/admin_panel/page_titles.md

@@ -0,0 +1,83 @@
+# Customizing the page titles
+
+## Adding an icon
+
+<div data-full-width="false">
+
+<figure><img src="../../.gitbook/assets/title_with_icon.png" alt="Title with icon"></figure>
+
+</div>
+
+To add an icon to the page title, you need to use Twig hooks configuration.
+
+Search the "title_block" in the Symfony debug profiler at the Twig hooks section.
+
+<div data-full-width="false">
+
+<figure><img src="../../.gitbook/assets/title_block_in_profiler.png" alt="Title block in profiler"></figure>
+
+</div>
+
+Here's an example to define a "users" icon on a speaker list.
+
+```yaml
+# config/packages/sylius_bootstrap_admin_ui.yaml
+# ...
+sylius_twig_hooks:
+    hooks:
+        # ...
+        'sylius_admin.speaker.index.content.header.title_block':
+            title:
+                # We need to reuse the same template as 'sylius_admin.common.index.content.header.title_block'
+                template: '@SyliusBootstrapAdminUi/shared/crud/common/content/header/title_block/title.html.twig'
+                configuration:
+                    icon: tabler:users # you can use any icon from Symfony UX icons.
+```
+
+You can also define a default icon for every "index" pages.
+
+<div data-full-width="false">
+
+<figure><img src="../../.gitbook/assets/icon_for_index_pages.png" alt="Icon for index pages"></figure>
+
+</div>
+
+```yaml
+# config/packages/sylius_bootstrap_admin_ui.yaml
+# ...
+sylius_twig_hooks:
+    hooks:
+        # ...
+        'sylius_admin.common.index.content.header.title_block':
+            title:
+                configuration:
+                    icon: tabler:list-details
+```
+
+## Adding a subheader
+
+<div data-full-width="false">
+
+<figure><img src="../../.gitbook/assets/title_with_subheader.png" alt="Title with subheader"></figure>
+
+</div>
+
+To add a subheader to the page title, you need to use Twig hooks configuration.
+
+See the [previous section](#adding-an-icon) to see how to search for the title block.
+
+Here's an example to define a subheader on a speaker list.
+
+```yaml
+# config/packages/sylius_bootstrap_admin_ui.yaml
+# ...
+sylius_twig_hooks:
+    hooks:
+        # ...
+        'sylius_admin.speaker.index.content.header.title_block':
+            title:
+                # We need to reuse the same template as 'sylius_admin.common.index.content.header.title_block'
+                template: '@SyliusBootstrapAdminUi/shared/crud/common/content/header/title_block/title.html.twig'
+                configuration:
+                    subheader: app.ui.managing_your_speakers # you also need add this key on your translations.
+```

docs/cookbook/admin_panel/security.md

@@ -1,5 +1,11 @@
 # Configuring the Security access
 
+<div data-full-width="false">
+
+<figure><img src="../../.gitbook/assets/login.png" alt="Login page"></figure>
+
+</div>
+
 Now that you have an admin panel, you want to make sure admin users are the only ones allowed to access its URL.
 To secure your back-office interface, you can simply resort to Symfony's Security configuration with 4 basic steps : 
 * [Create a User](#create-a-user-entity)