Merge pull request #541 from BitBagCommerce/add_trix

Trix support

Author: christopherhero

.github/workflows/build.yml

@@ -14,27 +14,21 @@ jobs:
   tests:
     runs-on: ubuntu-latest
 
-    name: "Sylius ${{ matrix.sylius }}, PHP ${{ matrix.php }}, Symfony ${{ matrix.symfony }}, MySQL ${{ matrix.mysql }}"
+    name: "Sylius ${{ matrix.sylius }}, PHP ${{ matrix.php }}, Symfony ${{ matrix.symfony }}, MySQL ${{ matrix.mysql }}, Trix ${{ matrix.trix }}"
 
     strategy:
       fail-fast: false
       matrix:
-        php: ["8.0", "8.1", "8.2", "8.3"]
+        php: ["8.1", "8.2", "8.3"]
         symfony: ["^5.4", "^6.4"]
-        sylius: ["~1.12.0", "~1.13.0", "~1.14.0"]
+        sylius: ["~1.13.0", "~1.14.0"]
         node: ["20.x"]
         mysql: ["8.0"]
+        trix: [false, true]
 
         exclude:
-          - sylius: "~1.13.0"
-            php: 8.0
-          - sylius: "~1.14.0"
-            php: 8.0
           - sylius: "~1.14.0"
             symfony: ^5.4
-          - sylius: "~1.12.0"
-            php: 8.0
-            symfony: ^6.4
 
     env:
       APP_ENV: test
@@ -115,7 +109,17 @@ jobs:
 
       - name: Install JS dependencies
         run: |
-          (cd tests/Application && yarn install)
+          cd tests/Application
+          if [ "${{ matrix.trix }}" = "true" ]; then
+            yarn add trix
+            sed -i "s/wysiwyg: 'ckeditor'/wysiwyg: 'trix'/" webpack.config.js
+          fi
+          yarn install
+
+      - name: Configure Trix if enabled
+        if: matrix.trix == true
+        run: |
+          printf "bit_bag_sylius_cms:\n    wysiwyg_editor: trix\n" >> tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml
 
       - name: Prepare test application database
         run: |
@@ -145,25 +149,29 @@ jobs:
       - name: Run PHPUnit
         run: vendor/bin/phpunit --colors=always
 
+      - name: Set Behat tags
+        if: matrix.trix != true
+        run: echo "BEHAT_TAGS=--tags='~@wysiwyg'" >> $GITHUB_ENV
+
       - name: Run Behat
-        run: vendor/bin/behat --colors --strict -vvv --no-interaction -f progress || vendor/bin/behat --colors --strict -vvv --no-interaction -f progress --rerun
+        run: vendor/bin/behat ${{ env.BEHAT_TAGS }} --colors --strict -vvv --no-interaction -f progress || vendor/bin/behat ${{ env.BEHAT_TAGS }} --colors --strict -vvv --no-interaction -f progress --rerun
 
       - name: Upload Behat logs
-        uses: actions/upload-artifact@v3
+        uses: actions/upload-artifact@v4
         if: failure()
         with:
           name: Behat logs
           path: etc/build/
           if-no-files-found: ignore
 
-      - name: Failed build Slack notification
-        uses: rtCamp/action-slack-notify@v2
-        if: ${{ failure() && (github.ref == 'refs/heads/main' || github.ref == 'refs/heads/master') }}
-        env:
-          SLACK_CHANNEL: ${{ secrets.FAILED_BUILD_SLACK_CHANNEL }}
-          SLACK_COLOR: ${{ job.status }}
-          SLACK_ICON: https://github.com/rtCamp.png?size=48
-          SLACK_MESSAGE: ':x:'
-          SLACK_TITLE: Failed build on ${{ github.event.repository.name }} repository
-          SLACK_USERNAME: ${{ secrets.FAILED_BUILD_SLACK_USERNAME }}
-          SLACK_WEBHOOK: ${{ secrets.FAILED_BUILD_SLACK_WEBHOOK }}
+#      - name: Failed build Slack notification
+#        uses: rtCamp/action-slack-notify@v2
+#        if: ${{ failure() && (github.ref == 'refs/heads/main' || github.ref == 'refs/heads/master') }}
+#        env:
+#          SLACK_CHANNEL: ${{ secrets.FAILED_BUILD_SLACK_CHANNEL }}
+#          SLACK_COLOR: ${{ job.status }}
+#          SLACK_ICON: https://github.com/rtCamp.png?size=48
+#          SLACK_MESSAGE: ':x:'
+#          SLACK_TITLE: Failed build on ${{ github.event.repository.name }} repository
+#          SLACK_USERNAME: ${{ secrets.FAILED_BUILD_SLACK_USERNAME }}
+#          SLACK_WEBHOOK: ${{ secrets.FAILED_BUILD_SLACK_WEBHOOK }}

.github/workflows/coding_standard.yml

@@ -18,21 +18,14 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        php: ["8.0", "8.1", "8.2", "8.3"]
+        php: ["8.1", "8.2", "8.3"]
         symfony: ["^5.4", "^6.4"]
-        sylius: ["~1.12.0", "~1.13.0", "~1.14.0"]
+        sylius: ["~1.13.0", "~1.14.0"]
         node: ["20.x"]
 
         exclude:
-          - sylius: "~1.13.0"
-            php: 8.0
-          - sylius: "~1.14.0"
-            php: 8.0
           - sylius: "~1.14.0"
             symfony: ^5.4
-          - sylius: "~1.12.0"
-            php: 8.0
-            symfony: ^6.4
 
     steps:
       - uses: actions/checkout@v3

UPGRADE-4.4.md

@@ -0,0 +1,45 @@
+# UPGRADE FROM `v4.3` TO `v4.4`
+
+This update adds support for Trix (as an optional WYSIWYG editor). If you would like to replace CKeditor with Trix review the plugin installation steps.
+
+The configuration has been split and the `fos_ck_editor` configuration is required to be added with this update.
+
+1. Import required CKeditor config in your `config/packages/_sylius.yaml` file:
+```yaml
+# config/packages/_sylius.yaml
+
+imports:
+    ...
+    
+    - { resource: "@BitBagSyliusCmsPlugin/Resources/config/fos_ck_editor/fos_ck_editor.yml" }
+```
+
+*Or copy contents of `vendor/BitBag/cms-plugin/src/Resources/config/fos_ck_editor/fos_ck_editor.yml` to `config/packages/fos_ck_editor.yaml` file.*
+
+2. If project use a `./vendor/bitbag/cms-plugin/webpack.config.js` file in `webpack.config.js` you need change:
+
+From:
+```js
+// webpack.config.js
+
+const [ bitbagCmsShop, bitbagCmsAdmin ] = require('./vendor/bitbag/cms-plugin/webpack.config.js')
+
+...
+
+module.exports = [..., bitbagCmsShop, bitbagCmsAdmin];
+```
+
+To:
+```js
+// webpack.config.js
+
+const createCmsConfigs  = require('./vendor/bitbag/cms-plugin/webpack.config.js)
+
+...
+
+const [bitbagCmsShop, bitbagCmsAdmin] = createCmsConfigs({
+    wysiwyg: 'ckeditor' // 'ckeditor' | 'trix'
+});
+
+module.exports = [..., bitbagCmsShop, bitbagCmsAdmin];
+```

composer.json

@@ -9,8 +9,8 @@
   "description": "CMS plugin for Sylius applications.",
   "license": "MIT",
   "require": {
-    "php": "^8.0",
-    "sylius/sylius": "^1.12",
+    "php": "^8.1",
+    "sylius/sylius": "^1.13",
     "league/csv": "^9.1",
     "friendsofsymfony/ckeditor-bundle": "^2.0",
     "instaclick/php-webdriver": "^1.4",

doc/01.1-webpack-config.md

@@ -13,9 +13,13 @@
 
 ```js
 // webpack.config.js
-const [ bitbagCmsShop, bitbagCmsAdmin ] = require('./vendor/bitbag/cms-plugin/webpack.config.js')
+const createCmsConfigs  = require('./vendor/bitbag/cms-plugin/webpack.config.js)
 ...
 
+const [bitbagCmsShop, bitbagCmsAdmin] = createCmsConfigs({
+    wysiwyg: 'ckeditor' // 'ckeditor' | 'trix'
+});
+
 module.exports = [..., bitbagCmsShop, bitbagCmsAdmin];
 ```
 

doc/01.2-webpack-entry.md

@@ -15,9 +15,12 @@
 
 // Shop config
     .addEntry('bitbag-cms-shop', 'vendor/bitbag/cms-plugin/src/Resources/assets/shop/entry.js')
-
-// Admin config
+    
+// Admin config - add one of the following entries (CKeditor or Trix)
+    // CKeditor
     .addEntry('bitbag-cms-admin', 'vendor/bitbag/cms-plugin/src/Resources/assets/admin/entry.js')
+    // Trix
+    .addEntry('bitbag-cms-admin', 'vendor/bitbag/cms-plugin/src/Resources/assets/admin/trix-entry.js')
 ```
 
 2. Add encore functions to your templates

doc/01.3-import-entry.md

@@ -16,6 +16,9 @@
 // ./assets/shop/entry.js
 import '../../vendor/bitbag/cms-plugin/src/Resources/assets/shop/entry.js';
 
-// ./assets/admin/entry.js
+// ./assets/admin/entry.js - choose one of the following entries (CKeditor or Trix)
+//CkEditor
 import '../../vendor/bitbag/cms-plugin/src/Resources/assets/admin/entry.js';
+// Trix
+import '../../vendor/bitbag/cms-plugin/src/Resources/assets/admin/trix-entry.js';
 ```

doc/01.4-custom-solution.md

@@ -11,9 +11,15 @@ Main entry points:
 ```js
 // shop
 .addEntry('/vendor/bitbag/cms-plugin/src/Resources/assets/shop/entry.js')
+```
 
+Choose one of the following entries (CKeditor or Trix):
+```js
 // admin
+// Ckeditor
 .addEntry('/vendor/bitbag/cms-plugin/src/Resources/assets/admin/entry.js')
+// Trix
+.addEntry('/vendor/bitbag/cms-plugin/src/Resources/assets/admin/trix-entry.js')
 ```
 
 Style entry points:

doc/01.5-non-webpack.md

@@ -17,11 +17,22 @@ $ bin/console assets:install
 ```
 
 2. Add twig inclusions in your templates:
+
+(select one of the following options, depending on the editor you want to use:  Trix or CKEditor)
 ```twig
+{# CKeditor config #}
 {# @SyliusAdminBundle/_scripts.html.twig #}
 {% include '@SyliusUi/_javascripts.html.twig' with {
     'path': 'bundles/bitbagsyliuscmsplugin/build/bitbag-cms-admin.js'
 } %}
+{# end - CKeditor config #}
+
+{# Trix config #}
+{# @SyliusAdminBundle/_scripts.html.twig #}
+{% include '@SyliusUi/_javascripts.html.twig' with {
+    'path': 'vendor/bitbag/cms-plugin/src/Resources/assets/trix-entry.js'
+} %}
+{# end - Trix config #}
 
 {# @SyliusAdminBundle/_styles.html.twig #}
 {% include '@SyliusUi/_stylesheets.html.twig' with {

doc/ckeditor-config.md

@@ -0,0 +1,48 @@
+1. Add plugin dependencies to your `config/bundles.php` file:
+
+```php
+return [
+    ...
+
+    FOS\CKEditorBundle\FOSCKEditorBundle::class => ['all' => true], 
+    BitBag\SyliusCmsPlugin\BitBagSyliusCmsPlugin::class  => ['all' => true],
+];
+```
+
+2. Install CKeditor ([FOS CKEditor](https://symfony.com/doc/master/bundles/FOSCKEditorBundle/usage/ckeditor.html))
+
+```bash
+$ bin/console ckeditor:install
+```
+
+**Note.** If you have an issue with CKEditor not running, please try installing it using the `4.22.1` tag:
+
+```bash
+$ bin/console ckeditor:install --tag=4.22.1
+```
+
+For more information regarding the `4.22.1` tag, please visit the #485 issue.
+
+3. Since FOSCKEditorBundle 2.0, to make Twig render the WYSIWYG editor, you must add some configuration under the `twig.form_themes` config key:
+
+```yaml
+# Symfony 2/3: app/config/config.yml
+# Symfony 4: config/packages/twig.yaml
+
+twig:
+    form_themes:
+        - '@FOSCKEditor/Form/ckeditor_widget.html.twig'
+        - '@BitBagSyliusCmsPlugin/Form/ckeditor_widget.html.twig'
+```
+
+4. Import required CKeditor config in your `config/packages/_sylius.yaml` file:
+```yaml
+# config/packages/_sylius.yaml
+
+imports:
+    ...
+    
+    - { resource: "@BitBagSyliusCmsPlugin/Resources/config/fos_ck_editor/fos_ck_editor.yml" }
+```
+
+Continue with the next installation steps