Change links to UrlType with correct constraints and manage link type

monsieurbiz · Aug 26, 2024 · 570c8fa · 570c8fa
1 parent 3915391
commit 570c8fa
Show file tree

Hide file tree

Showing 13 changed files with 95 additions and 27 deletions.
diff --git a/src/Form/Type/LinkTypeType.php b/src/Form/Type/LinkTypeType.php
@@ -0,0 +1,37 @@
+<?php
+
+/*
+ * This file is part of Monsieur Biz' Rich Editor plugin for Sylius.
+ *
+ * (c) Monsieur Biz <[email protected]>
+ *
+ * For the full copyright and license information, please view the LICENSE.txt
+ * file that was distributed with this source code.
+ */
+
+declare(strict_types=1);
+
+namespace MonsieurBiz\SyliusRichEditorPlugin\Form\Type;
+
+use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
+use Symfony\Component\OptionsResolver\OptionsResolver;
+
+class LinkTypeType extends ChoiceType
+{
+    public const TYPE_INTERNAL = 'internal';
+
+    public const TYPE_EXTERNAL = 'external';
+
+    public function configureOptions(OptionsResolver $resolver): void
+    {
+        parent::configureOptions($resolver);
+        $resolver->setDefaults([
+            'label' => 'monsieurbiz_richeditor_plugin.common.link_type',
+            'choices' => [
+                'monsieurbiz_richeditor_plugin.common.internal_link' => self::TYPE_INTERNAL,
+                'monsieurbiz_richeditor_plugin.common.external_link' => self::TYPE_EXTERNAL,
+            ],
+            'multiple' => false,
+        ]);
+    }
+}
diff --git a/src/Form/Type/UiElement/ButtonLinkType.php b/src/Form/Type/UiElement/ButtonLinkType.php
@@ -14,9 +14,10 @@
 namespace MonsieurBiz\SyliusRichEditorPlugin\Form\Type\UiElement;
 
 use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\AlignmentType;
+use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\LinkTypeType;
 use Symfony\Component\Form\AbstractType;
 use Symfony\Component\Form\Extension\Core\Type\TextType as FormTextType;
-use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
+use Symfony\Component\Form\Extension\Core\Type\UrlType;
 use Symfony\Component\Form\FormBuilderInterface;
 use Symfony\Component\Validator\Constraints as Assert;
 
@@ -32,26 +33,30 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
             $constraintsLabel = [
                 new Assert\NotBlank([]),
             ];
+            $constraintsLinkType = [
+                new Assert\NotBlank([]),
+            ];
             $constraintsLink = [
                 new Assert\AtLeastOneOf([
                     'includeInternalMessages' => false,
                     'message' => 'monsieurbiz_richeditor_plugin.not_valid_url',
                     'constraints' => [
                         new Assert\Url(['protocols' => ['http', 'https'], 'relativeProtocol' => true]),
-                        new Assert\Regex(['pattern' => '`^(#|/[^/])`']),
+                        new Assert\Regex(['pattern' => '`^(#|/.*)$`']),
                     ],
                 ]),
                 new Assert\NotBlank([]),
             ];
         } else {
             $constraintsLabel = [];
+            $constraintsLinkType = [];
             $constraintsLink = [
                 new Assert\AtLeastOneOf([
                     'includeInternalMessages' => false,
                     'message' => 'monsieurbiz_richeditor_plugin.not_valid_url',
                     'constraints' => [
                         new Assert\Url(['protocols' => ['http', 'https'], 'relativeProtocol' => true]),
-                        new Assert\Regex(['pattern' => '`^(#|/[^/])`']),
+                        new Assert\Regex(['pattern' => '`^(#|/.*)$`']),
                     ],
                 ]),
             ];
@@ -63,16 +68,14 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.button.field.label',
                 'constraints' => $constraintsLabel,
             ])
-            ->add('link', FormTextType::class, [
+            ->add('link', UrlType::class, [
                 'required' => $required,
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.button.field.link',
                 'constraints' => $constraintsLink,
             ])
-            ->add('target', ChoiceType::class, [
-                'choices'  => [
-                    'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.button.field.target_option.self' => '_self',
-                    'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.button.field.target_option.blank' => '_blank',
-                ],
+            ->add('link_type', LinkTypeType::class, [
+                'required' => $required,
+                'constraints' => $constraintsLinkType,
             ])
             ->add('align', AlignmentType::class)
         ;

diff --git a/src/Form/Type/UiElement/ImageType.php b/src/Form/Type/UiElement/ImageType.php
@@ -16,10 +16,12 @@
 use MonsieurBiz\SyliusMediaManagerPlugin\Form\Type\ImageType as MediaManagerImageType;
 use MonsieurBiz\SyliusRichEditorPlugin\Form\Constraints\RichEditorConstraints;
 use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\AlignmentType;
+use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\LinkTypeType;
 use MonsieurBiz\SyliusRichEditorPlugin\MonsieurBizSyliusRichEditorPlugin;
 use Symfony\Component\Form\AbstractType;
 use Symfony\Component\Form\Extension\Core\Type\FileType;
 use Symfony\Component\Form\Extension\Core\Type\TextType as FormTextType;
+use Symfony\Component\Form\Extension\Core\Type\UrlType;
 use Symfony\Component\Form\FormBuilderInterface;
 use Symfony\Component\Form\FormEvent;
 use Symfony\Component\Form\FormEvents;
@@ -56,7 +58,7 @@ public function addFields(FormBuilderInterface $builder, array $options): void
                 'required' => false,
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.image.field.title',
             ])
-            ->add('link', FormTextType::class, [
+            ->add('link', UrlType::class, [
                 'required' => false,
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.image.field.link',
                 'constraints' => [
@@ -65,11 +67,14 @@ public function addFields(FormBuilderInterface $builder, array $options): void
                         'message' => 'monsieurbiz_richeditor_plugin.not_valid_url',
                         'constraints' => [
                             new Assert\Url(['protocols' => ['http', 'https'], 'relativeProtocol' => true]),
-                            new Assert\Regex(['pattern' => '`^(#|/[^/])`']),
+                            new Assert\Regex(['pattern' => '`^(#|/.*)$`']),
                         ],
                     ]),
                 ],
             ])
+            ->add('link_type', LinkTypeType::class, [
+                'required' => false,
+            ])
             ->add('align', AlignmentType::class)
         ;
     }

diff --git a/src/Resources/translations/messages.en.yml b/src/Resources/translations/messages.en.yml
@@ -80,10 +80,6 @@ monsieurbiz_richeditor_plugin:
       field:
         label: 'Label'
         link: 'Link'
-        target: 'Target'
-        target_option:
-          self: 'Open in the same frame as it was clicked (this is default)'
-          blank: 'Open in a new window or tab'
     monsieurbiz.youtube:
       title: 'Youtube Element'
       short_description: 'A Youtube element.'
@@ -146,3 +142,7 @@ monsieurbiz_richeditor_plugin:
     unallowed_uielement: 'Element not allowed here'
   ui:
     disabled: 'Disabled'
+  common:
+    link_type: 'Link type'
+    internal_link: 'Internal link'
+    external_link: 'External link'
diff --git a/src/Resources/translations/messages.es.yml b/src/Resources/translations/messages.es.yml
@@ -80,7 +80,6 @@ monsieurbiz_richeditor_plugin:
       field:
         label: 'Etiqueta'
         link: 'Enlace'
-        target: 'Destino'
     monsieurbiz.youtube:
       title: 'Elemento de Youtube'
       short_description: 'Un elemento de Youtube.'
@@ -140,3 +139,8 @@ monsieurbiz_richeditor_plugin:
     unallowed_uielement: 'Elemento no permitido aquí'
   ui:
     disabled: 'Desactivado'
+  common:
+    link_type: 'Tipo de enlace'
+    internal_link: 'Enlace interno'
+    external_link: 'Enlace externo'
+
diff --git a/src/Resources/translations/messages.fr.yml b/src/Resources/translations/messages.fr.yml
@@ -80,7 +80,6 @@ monsieurbiz_richeditor_plugin:
       field:
         label: 'Libellé'
         link: 'Lien'
-        target: 'Cible'
     monsieurbiz.youtube:
       title: 'Lame Youtube'
       short_description: 'Une vidéo youtube.'
@@ -143,3 +142,7 @@ monsieurbiz_richeditor_plugin:
     unallowed_uielement: 'Élément non autorisé ici'
   ui:
     disabled: 'Désactivé'
+  common:
+    link_type: 'Type de lien'
+    internal_link: 'Lien interne'
+    external_link: 'Lien externe'
diff --git a/src/Resources/translations/messages.hr.yml b/src/Resources/translations/messages.hr.yml
@@ -80,7 +80,6 @@ monsieurbiz_richeditor_plugin:
       field:
         label: 'Natpis na gumbu'
         link: 'URL linka'
-        target: 'Ciljni'
     monsieurbiz.youtube:
       title: 'YouTube video'
       short_description: 'Element s YouTube videom.'
@@ -131,3 +130,7 @@ monsieurbiz_richeditor_plugin:
     cannot_find_type: 'Vrsta dijela elemenata nije podržana.'
     cannot_upload_image: 'Postoji tehnički problem. Molimo kontaktirajte svog administratora.'
     ajax_error: 'Technikai probléma van. Kérjük, lépjen kapcsolatba rendszergazdájával.'
+  common:
+    link_type: 'Tip linka'
+    internal_link: 'Unutarnji link'
+    external_link: 'Vanjski link'
diff --git a/src/Resources/translations/messages.nl.yml b/src/Resources/translations/messages.nl.yml
@@ -62,7 +62,6 @@ monsieurbiz_richeditor_plugin:
       field:
         label: 'Label'
         link: 'Link'
-        target: 'Doelkenmerk'
     monsieurbiz.youtube:
       title: 'YouTube-video'
       short_description: 'Een YouTube-element.'
@@ -105,3 +104,7 @@ monsieurbiz_richeditor_plugin:
     cannot_find_type: 'Kan type niet vinden voor sommige UI-elementen'
     cannot_upload_image: 'Kan de afbeelding niet uploaden. Het bestand is mogelijk te groot of heeft een onjuist formaat.'
     ajax_error: 'Er is een technisch probleem. Neem contact op met uw beheerder.'
+  common:
+    link_type: 'Type link'
+    internal_link: 'Interne link'
+    external_link: 'Externe link'
diff --git a/src/Resources/translations/messages.pl.yaml b/src/Resources/translations/messages.pl.yaml
@@ -80,7 +80,6 @@ monsieurbiz_richeditor_plugin:
             field:
                 label: 'Etykieta'
                 link: 'Link'
-                target: 'Docelowy'
         monsieurbiz.youtube:
             title: 'Element YouTube'
             short_description: 'Element YouTube.'
@@ -143,3 +142,7 @@ monsieurbiz_richeditor_plugin:
         unallowed_uielement: 'Element niedozwolony tutaj'
     ui:
         disabled: 'Wyłączone'
+    common:
+        link_type: 'Typ linku'
+        internal_link: 'Link wewnętrzny'
+        external_link: 'Link zewnętrzny'
diff --git a/src/Resources/views/Admin/UiElement/button.html.twig b/src/Resources/views/Admin/UiElement/button.html.twig
@@ -4,13 +4,14 @@
     element fields :
         label
         link
-        target
+        link_type
         align
 #}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'center' %}
-{% set target = element.target is defined and element.target is not empty ? element.target : '_self' %}
-{% set rel = element.target is defined and element.target == '_blank' ? 'rel="noopener noreferrer"' : '' %}
+{% set linkIsBlank = element.link_type is defined and element.link_type == constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\LinkTypeType::TYPE_EXTERNAL') %}
 
 <p style="text-align: {{align}};">
-    <a href="{{ element.link }}" target="{{ element.target }}" {{ rel }} class="ui primary button massive">{{ element.label }}</a>
+    <a href="{{ element.link }}"{% if linkIsBlank %} target="_blank" rel="noopener noreferrer"{% endif %} class="ui primary button massive">
+        {{ element.label }}
+    </a>
 </p>
diff --git a/src/Resources/views/Admin/UiElement/image.html.twig b/src/Resources/views/Admin/UiElement/image.html.twig
@@ -6,13 +6,15 @@
         alt
         title
         link
+        link_type
         align
 #}
 {% if element.image is defined %}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'inherit' %}
 <p style="text-align: {{align}};">
     {% if element.link is not empty %}
-        <a href="{{ element.link }}">
+        {% set linkIsBlank = element.link_type is defined and element.link_type == constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\LinkTypeType::TYPE_EXTERNAL') %}
+        <a href="{{ element.link }}"{% if linkIsBlank %} target="_blank" rel="noopener noreferrer"{% endif %}>
             <img class="ui fluid image" src="{{ monsieurbiz_richeditor_get_media_without_upload_dir(element.image)|imagine_filter('monsieurbiz_rich_editor_image') }}" alt="{{ element.alt|default('') }}" title="{{ element.title|default('') }}" />
         </a>
     {% else %}

diff --git a/src/Resources/views/Shop/UiElement/button.html.twig b/src/Resources/views/Shop/UiElement/button.html.twig
@@ -4,9 +4,11 @@
     element fields :
         label
         link
+        link_type
         align
 #}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'center' %}
+{% set linkIsBlank = element.link_type is defined and element.link_type == constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\LinkTypeType::TYPE_EXTERNAL') %}
 <p style="text-align: {{align}};">
-    <a href="{{ element.link }}" class="ui primary button massive">{{ element.label }}</a>
+    <a href="{{ element.link }}"{% if linkIsBlank %} target="_blank" rel="noopener noreferrer"{% endif %} class="ui primary button massive">{{ element.label }}</a>
 </p>
diff --git a/src/Resources/views/Shop/UiElement/image.html.twig b/src/Resources/views/Shop/UiElement/image.html.twig
@@ -6,13 +6,15 @@
         alt
         title
         link
+        link_type
         align
 #}
 {% if element.image is defined %}
 {% set align = element.align is defined and element.align is not empty ? element.align : 'inherit' %}
 <p style="text-align: {{align}};">
     {% if element.link is not empty %}
-        <a href="{{ element.link }}">
+        {% set linkIsBlank = element.link_type is defined and element.link_type == constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\LinkTypeType::TYPE_EXTERNAL') %}
+        <a href="{{ element.link }}"{% if linkIsBlank %} target="_blank" rel="noopener noreferrer"{% endif %}>
             <img class="ui fluid image" src="{{ monsieurbiz_richeditor_get_media_without_upload_dir(element.image)|imagine_filter('monsieurbiz_rich_editor_image') }}" alt="{{ element.alt|default('') }}" title="{{ element.title|default('') }}" />
         </a>
     {% else %}