From e2d79b76c35139979b289a1f9495acd38d244878 Mon Sep 17 00:00:00 2001 From: Mathieu Santostefano Date: Tue, 6 Aug 2024 11:23:35 +0200 Subject: [PATCH 1/2] feat(ui-element): Add TextWithImageUiElement --- composer.json | 3 +- src/Form/Type/ImageType.php | 46 ++++++++++++ .../UiElement/TextWithImageUiElementType.php | 72 +++++++++++++++++++ src/Resources/translations/messages.en.yaml | 11 ++- src/Resources/translations/messages.fr.yaml | 11 ++- .../text_with_image_ui_element.html.twig | 25 +++++++ .../text_with_image_ui_element.html.twig | 25 +++++++ 7 files changed, 190 insertions(+), 3 deletions(-) create mode 100644 src/Form/Type/ImageType.php create mode 100644 src/Form/Type/UiElement/TextWithImageUiElementType.php create mode 100644 src/Resources/views/Admin/UiElement/text_with_image_ui_element.html.twig create mode 100644 src/Resources/views/Shop/UiElement/text_with_image_ui_element.html.twig diff --git a/composer.json b/composer.json index 5f4eacf..af31157 100644 --- a/composer.json +++ b/composer.json @@ -7,7 +7,8 @@ "require": { "php": "^8.2", "sylius/sylius": ">=1.12 <1.14", - "monsieurbiz/sylius-rich-editor-plugin": "^2.8" + "monsieurbiz/sylius-rich-editor-plugin": "^2.8", + "monsieurbiz/sylius-media-manager-plugin": "^1.1" }, "require-dev": { "friendsofphp/php-cs-fixer": "^3.16", diff --git a/src/Form/Type/ImageType.php b/src/Form/Type/ImageType.php new file mode 100644 index 0000000..0f51229 --- /dev/null +++ b/src/Form/Type/ImageType.php @@ -0,0 +1,46 @@ + + * 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; + +use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\UiElement\ImageType as RichEditorImageType; +use Symfony\Component\Form\FormBuilderInterface; +use Symfony\Component\OptionsResolver\OptionsResolver; + +class ImageType extends RichEditorImageType +{ + /** + * @inheritdoc + */ + public function buildForm(FormBuilderInterface $builder, array $options): void + { + parent::buildForm($builder, $options); + + if (!$options['with_link']) { + $builder->remove('link'); + } + + if (!$options['with_alignment']) { + $builder->remove('align'); + } + } + + public function configureOptions(OptionsResolver $resolver): void + { + parent::configureOptions($resolver); + $resolver->setDefaults([ + 'with_link' => true, + 'with_alignment' => true, + ]); + $resolver->setAllowedTypes('with_link', ['null', 'bool']); + $resolver->setAllowedTypes('with_alignment', ['null', 'bool']); + } +} diff --git a/src/Form/Type/UiElement/TextWithImageUiElementType.php b/src/Form/Type/UiElement/TextWithImageUiElementType.php new file mode 100644 index 0000000..a303bc1 --- /dev/null +++ b/src/Form/Type/UiElement/TextWithImageUiElementType.php @@ -0,0 +1,72 @@ + + * 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\SyliusUiElementsPlugin\Form\Type\ImageType; +use Symfony\Component\Form\AbstractType; +use Symfony\Component\Form\Extension\Core\Type\ChoiceType; +use Symfony\Component\Form\FormBuilderInterface; +use Symfony\Component\Validator\Constraints as Assert; + +#[AsUiElement( + code: 'monsieurbiz_ui_elements.text_with_image_ui_element', + icon: 'indent', + title: 'monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.title', + description: 'monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.description', + templates: new TemplatesUiElement( + adminRender: '@MonsieurBizSyliusUiElementsPlugin/Admin/UiElement/text_with_image_ui_element.html.twig', + frontRender: '@MonsieurBizSyliusUiElementsPlugin/Front/UiElement/text_with_image_ui_element.html.twig', + ), + tags: [], +)] +class TextWithImageUiElementType extends AbstractType +{ + public const IMAGE_POSITION_LEFT = 'left'; + + public const IMAGE_POSITION_RIGHT = 'right'; + + /** + * @SuppressWarnings(PHPMD.UnusedFormalParameter) + */ + public function buildForm(FormBuilderInterface $builder, array $options): void + { + $builder + ->add('content', WysiwygType::class, [ + 'label' => 'monsieurbiz_ui_elements.common.fields.content', + 'required' => true, + 'constraints' => [ + new Assert\NotBlank(), + ], + ]) + ->add('image', ImageType::class, [ + 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.image.field.image', + 'required' => true, + 'with_link' => false, + 'with_alignment' => false, + ]) + ->add('imageAlign', ChoiceType::class, [ + 'label' => 'monsieurbiz_ui_elements.common.fields.alignment', + 'required' => true, + 'choices' => [ + \sprintf('monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.%s', self::IMAGE_POSITION_LEFT) => self::IMAGE_POSITION_LEFT, + \sprintf('monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.%s', self::IMAGE_POSITION_RIGHT) => self::IMAGE_POSITION_RIGHT, + ], + 'constraints' => [ + new Assert\NotBlank(), + ], + ]) + ; + } +} diff --git a/src/Resources/translations/messages.en.yaml b/src/Resources/translations/messages.en.yaml index 01f1e88..0d9074d 100644 --- a/src/Resources/translations/messages.en.yaml +++ b/src/Resources/translations/messages.en.yaml @@ -10,7 +10,8 @@ monsieurbiz_ui_elements: link: "Link" label: "Label" type: "Type" - withDot: "With dot ?" + content: "Content" + image: "Image" errors: not_valid_url: "This value is not a valid URL (absolute or relative) or a valid hashtag." ui_element: @@ -42,3 +43,11 @@ monsieurbiz_ui_elements: buttons: add_element: "Add key figure" delete_element: "Delete key figure" + text_with_image_ui_element: + title: "Text with image" + description: "Text with image" + fields: + image_align: + choices: + left: "Left" + right: "Right" diff --git a/src/Resources/translations/messages.fr.yaml b/src/Resources/translations/messages.fr.yaml index 498d09e..80e9b0a 100644 --- a/src/Resources/translations/messages.fr.yaml +++ b/src/Resources/translations/messages.fr.yaml @@ -10,7 +10,8 @@ monsieurbiz_ui_elements: link: "Lien" label: "Libellé" type: "Type" - withDot: "Avec point ?" + content: "Contenu" + image: "Image" errors: not_valid_url: "Cette valeur n'est pas une URL valide (absolue ou relative) ou un hashtag valide." ui_element: @@ -42,3 +43,11 @@ monsieurbiz_ui_elements: buttons: add_element: "Ajouter un chiffre clé" delete_element: "Supprimer un chiffre clé" + text_with_image_ui_element: + title: "Texte avec image" + description: "Texte avec image" + fields: + image_align: + choices: + left: "Gauche" + right: "Droite" diff --git a/src/Resources/views/Admin/UiElement/text_with_image_ui_element.html.twig b/src/Resources/views/Admin/UiElement/text_with_image_ui_element.html.twig new file mode 100644 index 0000000..b7890e4 --- /dev/null +++ b/src/Resources/views/Admin/UiElement/text_with_image_ui_element.html.twig @@ -0,0 +1,25 @@ +{# +UI Element template +type: text_with_image_ui_element +element fields: + - content + - image + - image + - alt + - title + - imageAlign +#} + +
+
+ {{ element.content|raw }} +
+ {{ element.image.alt ?? '' }} +
+
    +
  • + {{ 'monsieurbiz_ui_elements.common.fields.alignment'|trans }} : {{ element.imageAlign }} +
    • +
+
+
diff --git a/src/Resources/views/Shop/UiElement/text_with_image_ui_element.html.twig b/src/Resources/views/Shop/UiElement/text_with_image_ui_element.html.twig new file mode 100644 index 0000000..b7890e4 --- /dev/null +++ b/src/Resources/views/Shop/UiElement/text_with_image_ui_element.html.twig @@ -0,0 +1,25 @@ +{# +UI Element template +type: text_with_image_ui_element +element fields: + - content + - image + - image + - alt + - title + - imageAlign +#} + +
+
+ {{ element.content|raw }} +
+ {{ element.image.alt ?? '' }} +
+
    +
  • + {{ 'monsieurbiz_ui_elements.common.fields.alignment'|trans }} : {{ element.imageAlign }} +
    • +
+
+
From 5c51597ac20e313f5a219ee0d44dd7a5c978db21 Mon Sep 17 00:00:00 2001 From: Mathieu Santostefano Date: Tue, 6 Aug 2024 14:46:08 +0200 Subject: [PATCH 2/2] fix(review): Address review comments --- src/Form/Type/ImageType.php | 12 +++++++----- .../Type/UiElement/TextWithImageUiElementType.php | 4 ++-- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/src/Form/Type/ImageType.php b/src/Form/Type/ImageType.php index 0f51229..c6b08e5 100644 --- a/src/Form/Type/ImageType.php +++ b/src/Form/Type/ImageType.php @@ -12,22 +12,20 @@ namespace MonsieurBiz\SyliusUiElementsPlugin\Form\Type; use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\UiElement\ImageType as RichEditorImageType; +use Symfony\Component\Form\AbstractType; use Symfony\Component\Form\FormBuilderInterface; use Symfony\Component\OptionsResolver\OptionsResolver; -class ImageType extends RichEditorImageType +class ImageType extends AbstractType { /** * @inheritdoc */ public function buildForm(FormBuilderInterface $builder, array $options): void { - parent::buildForm($builder, $options); - if (!$options['with_link']) { $builder->remove('link'); } - if (!$options['with_alignment']) { $builder->remove('align'); } @@ -35,7 +33,6 @@ public function buildForm(FormBuilderInterface $builder, array $options): void public function configureOptions(OptionsResolver $resolver): void { - parent::configureOptions($resolver); $resolver->setDefaults([ 'with_link' => true, 'with_alignment' => true, @@ -43,4 +40,9 @@ public function configureOptions(OptionsResolver $resolver): void $resolver->setAllowedTypes('with_link', ['null', 'bool']); $resolver->setAllowedTypes('with_alignment', ['null', 'bool']); } + + public function getParent(): string + { + return RichEditorImageType::class; + } } diff --git a/src/Form/Type/UiElement/TextWithImageUiElementType.php b/src/Form/Type/UiElement/TextWithImageUiElementType.php index a303bc1..690c0aa 100644 --- a/src/Form/Type/UiElement/TextWithImageUiElementType.php +++ b/src/Form/Type/UiElement/TextWithImageUiElementType.php @@ -60,8 +60,8 @@ public function buildForm(FormBuilderInterface $builder, array $options): void 'label' => 'monsieurbiz_ui_elements.common.fields.alignment', 'required' => true, 'choices' => [ - \sprintf('monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.%s', self::IMAGE_POSITION_LEFT) => self::IMAGE_POSITION_LEFT, - \sprintf('monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.%s', self::IMAGE_POSITION_RIGHT) => self::IMAGE_POSITION_RIGHT, + 'monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.left' => self::IMAGE_POSITION_LEFT, + 'monsieurbiz_ui_elements.ui_element.text_with_image_ui_element.fields.image_align.choices.right' => self::IMAGE_POSITION_RIGHT, ], 'constraints' => [ new Assert\NotBlank(),