Merge pull request #5 from monsieurbiz/feature/quote-with-link

feat(ui-element): Add QuoteWithLinkUiElement
monsieurbiz · Aug 10, 2024 · b6e0ff2 · b6e0ff2
2 parents 91ca408 + 3a52810
commit b6e0ff2
Show file tree

Hide file tree

Showing 8 changed files with 198 additions and 6 deletions.
diff --git a/src/Form/Type/UiElement/CustomerQuoteUiElementType.php b/src/Form/Type/UiElement/CustomerQuoteUiElementType.php
@@ -0,0 +1,89 @@
+<?php
+
+/*
+ * This file is part of Monsieur Biz's SyliusUiElementsPlugin for Sylius.
+ * (c) Monsieur Biz <[email protected]>
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+declare(strict_types=1);
+
+namespace MonsieurBiz\SyliusUiElementsPlugin\Form\Type\UiElement;
+
+use MonsieurBiz\SyliusRichEditorPlugin\Attribute\AsUiElement;
+use MonsieurBiz\SyliusRichEditorPlugin\Attribute\TemplatesUiElement;
+use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\WysiwygType;
+use MonsieurBiz\SyliusRichEditorPlugin\WysiwygEditor\EditorInterface;
+use Symfony\Component\Form\AbstractType;
+use Symfony\Component\Form\Extension\Core\Type\TextType;
+use Symfony\Component\Form\Extension\Core\Type\UrlType;
+use Symfony\Component\Form\FormBuilderInterface;
+use Symfony\Component\Validator\Constraints as Assert;
+
+#[AsUiElement(
+    code: 'monsieurbiz_ui_elements.customer_quote_ui_element',
+    icon: 'quote left',
+    title: 'monsieurbiz_ui_elements.ui_element.customer_quote_ui_element.title',
+    description: 'monsieurbiz_ui_elements.ui_element.customer_quote_ui_element.description',
+    templates: new TemplatesUiElement(
+        adminRender: '@MonsieurBizSyliusUiElementsPlugin/Admin/UiElement/customer_quote_ui_element.html.twig',
+        frontRender: '@MonsieurBizSyliusUiElementsPlugin/Front/UiElement/customer_quote_ui_element.html.twig',
+    ),
+    tags: [],
+)]
+class CustomerQuoteUiElementType extends AbstractType
+{
+    /**
+     * @SuppressWarnings(PHPMD.UnusedFormalParameter)
+     */
+    public function buildForm(FormBuilderInterface $builder, array $options): void
+    {
+        $builder
+            ->add('title', TextType::class, [
+                'label' => 'monsieurbiz_ui_elements.common.fields.title',
+                'required' => false,
+            ])
+            ->add('quote', WysiwygType::class, [
+                'label' => 'monsieurbiz_ui_elements.common.fields.quote',
+                'required' => true,
+                'editor_height' => 120,
+                'editor_toolbar_type' => EditorInterface::TOOLBAR_TYPE_CUSTOM,
+                'editor_toolbar_buttons' => [
+                    ['undo', 'redo'],
+                    ['fontSize', 'formatBlock'],
+                    ['bold', 'underline', 'italic', 'strike'],
+                    ['fontColor', 'hiliteColor'],
+                    ['removeFormat'],
+                    ['link'],
+                    ['showBlocks', 'codeView'],
+                ],
+                'constraints' => [
+                    new Assert\NotBlank(),
+                ],
+            ])
+            ->add('author', TextType::class, [
+                'label' => 'monsieurbiz_ui_elements.common.fields.author',
+                'required' => false,
+            ])
+            ->add('link', UrlType::class, [
+                'label' => 'monsieurbiz_ui_elements.common.fields.link',
+                'required' => true,
+                'constraints' => [
+                    new Assert\AtLeastOneOf([
+                        'includeInternalMessages' => false,
+                        'message' => 'monsieurbiz_ui_elements.errors.not_valid_url',
+                        'constraints' => [
+                            new Assert\Url(['protocols' => ['http', 'https'], 'relativeProtocol' => true]),
+                            new Assert\Regex(['pattern' => '`^(#|/[^/])`']),
+                        ],
+                    ]),
+                ],
+            ])
+            ->add('linkLabel', TextType::class, [
+                'label' => 'monsieurbiz_ui_elements.common.fields.label',
+                'required' => true,
+            ])
+        ;
+    }
+}
diff --git a/src/Form/Type/UiElement/HeroUiElementType.php b/src/Form/Type/UiElement/HeroUiElementType.php
@@ -16,6 +16,7 @@
 use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\WysiwygType;
 use MonsieurBiz\SyliusRichEditorPlugin\WysiwygEditor\EditorInterface;
 use Symfony\Component\Form\AbstractType;
+use Symfony\Component\Form\Extension\Core\Type\TextType;
 use Symfony\Component\Form\FormBuilderInterface;
 
 #[AsUiElement(
@@ -52,11 +53,11 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                     ['showBlocks', 'codeView'],
                 ],
             ])
-            ->add('subtitle', null, [
+            ->add('subtitle', TextType::class, [
                 'label' => 'monsieurbiz_ui_elements.common.fields.subtitle',
                 'required' => false,
             ])
-            ->add('description', null, [
+            ->add('description', TextType::class, [
                 'label' => 'monsieurbiz_ui_elements.common.fields.description',
                 'required' => false,
             ])

diff --git a/src/Resources/translations/messages.en.yaml b/src/Resources/translations/messages.en.yaml
@@ -10,6 +10,8 @@ monsieurbiz_ui_elements:
             link: "Link"
             label: "Label"
             type: "Type"
+            quote: "Quote"
+            author: "Author"
             content: "Content"
             image: "Image"
     errors:
@@ -43,6 +45,9 @@ monsieurbiz_ui_elements:
             buttons:
                 add_element: "Add key figure"
                 delete_element: "Delete key figure"
+        customer_quote_ui_element:
+            title: "Customer quote"
+            description: "Quote from a customer"
         text_with_image_ui_element:
             title: "Text with image"
             description: "Text with image"
@@ -51,3 +56,4 @@ monsieurbiz_ui_elements:
                     choices:
                         left: "Left"
                         right: "Right"
+
diff --git a/src/Resources/translations/messages.fr.yaml b/src/Resources/translations/messages.fr.yaml
@@ -10,6 +10,8 @@ monsieurbiz_ui_elements:
             link: "Lien"
             label: "Libellé"
             type: "Type"
+            quote: "Citation"
+            author: "Auteur"
             content: "Contenu"
             image: "Image"
     errors:
@@ -43,6 +45,9 @@ monsieurbiz_ui_elements:
             buttons:
                 add_element: "Ajouter un chiffre clé"
                 delete_element: "Supprimer un chiffre clé"
+        customer_quote_ui_element:
+            title: "Citation client"
+            description: "Citation d'un client"
         text_with_image_ui_element:
             title: "Texte avec image"
             description: "Texte avec image"

diff --git a/src/Resources/views/Admin/UiElement/customer_quote_ui_element.html.twig b/src/Resources/views/Admin/UiElement/customer_quote_ui_element.html.twig
@@ -0,0 +1,28 @@
+{#
+UI Element template
+type: customer_quote_ui_element
+element fields:
+    - title
+    - quote
+    - author
+    - link
+    - label
+#}
+
+<div>
+    {% if element.title|default('') is not empty %}
+        <span class="ui huge header">{{ element.title|raw }}</span>
+    {% endif %}
+    {% if element.quote|default('') is not empty %}
+        <blockquote>
+            {{ element.quote | raw }}
+            {% if element.author|default('') is not empty %}
+                <br />— <cite>{{ element.author }}</cite>
+            {% endif %}
+        </blockquote>
+    {% endif %}
+    {% if element.link|default('') is not empty
+        and element.linkLabel|default('') is not empty %}
+        <a href="{{ element.link }}" class="ui button">{{ element.linkLabel }}</a>
+    {% endif %}
+</div>
diff --git a/src/Resources/views/Admin/UiElement/links_ui_element.html.twig b/src/Resources/views/Admin/UiElement/links_ui_element.html.twig
@@ -15,7 +15,17 @@ element fields:
     {% if element.title.content|default('') is not empty %}
         <span class="ui huge header">{{ element.title.content|raw }}</span>
     {% endif %}
-{#    {% for linkItem in element.links %}#}
-
-{#    {% endfor %}#}
+    {% for linkItem in element.links %}
+        <div class="four wide column">
+            <a href="{{ linkItem.link }}">{{ linkItem.label }}</a> <br>
+            <small>{{ 'monsieurbiz_ui_elements.common.fields.type'|trans }} : {{ linkItem.type }}</small>
+        </div>
+    {% endfor %}
+    <div class="extra content">
+        <ul>
+            <li>
+                {{ 'monsieurbiz_ui_elements.common.fields.alignment'|trans }} : {{ element.alignment }}
+            </li>
+        </ul>
+    </div>
 </div>
diff --git a/src/Resources/views/Shop/UiElement/customer_quote_ui_element.html.twig b/src/Resources/views/Shop/UiElement/customer_quote_ui_element.html.twig
@@ -0,0 +1,28 @@
+{#
+UI Element template
+type: customer_quote_ui_element
+element fields:
+    - title
+    - quote
+    - author
+    - link
+    - label
+#}
+
+<div>
+    {% if element.title|default('') is not empty %}
+        <span class="ui huge header">{{ element.title|raw }}</span>
+    {% endif %}
+    {% if element.quote|default('') is not empty %}
+        <blockquote>
+            {{ element.quote | raw }}
+            {% if element.author|default('') is not empty %}
+                <br />— <cite>{{ element.author }}</cite>
+            {% endif %}
+        </blockquote>
+    {% endif %}
+    {% if element.link|default('') is not empty
+        and element.linkLabel|default('') is not empty %}
+        <a href="{{ element.link }}" class="ui button">{{ element.linkLabel }}</a>
+    {% endif %}
+</div>
diff --git a/src/Resources/views/Shop/UiElement/links_ui_element.html.twig b/src/Resources/views/Shop/UiElement/links_ui_element.html.twig
@@ -2,5 +2,30 @@
 UI Element template
 type: links_ui_element
 element fields:
-    - …
+    - title
+    - background
+    - alignment
+    - links
+        - link
+        - label
+        - type
 #}
+
+<div class="ui grid {{ element.background == constant('MonsieurBiz\\SyliusUiElementsPlugin\\Form\\Type\\UiElement\\LinksUiElementType::BACKGROUND_DARK') ? 'inverted' }}">
+    {% if element.title.content|default('') is not empty %}
+        <span class="ui huge header">{{ element.title.content|raw }}</span>
+    {% endif %}
+    {% for linkItem in element.links %}
+        <div class="four wide column">
+            <a href="{{ linkItem.link }}">{{ linkItem.label }}</a> <br>
+            <small>{{ 'monsieurbiz_ui_elements.common.fields.type'|trans }} : {{ linkItem.type }}</small>
+        </div>
+    {% endfor %}
+    <div class="extra content">
+        <ul>
+            <li>
+                {{ 'monsieurbiz_ui_elements.common.fields.alignment'|trans }} : {{ element.alignment }}
+            </li>
+        </ul>
+    </div>
+</div>