OpenWopiLink, option title is maintened (replace button by options)

src/Bundle/ChillDocStoreBundle/Resources/views/AccompanyingCourseDocument/_workflow.html.twig

@@ -37,20 +37,7 @@
         </li>
         <li>
         {% if not freezed %}
-            {% set button = {
+            {{ document.object|chill_document_edit_button({'changeIcon': 'fa-unlock', 'title': document.title|e('html') }) }}
-                'changeIcon': 'fa-unlock',
-            } %}{#
-                'changeClass'   string
-                'noText'        boolean
-            #}
-            {# vue component #}
-            <span
-                data-module="wopi-link"
-                data-wopi-url="{{ path('chill_wopi_file_edit', {'fileId': document.object.uuid}) }}"
-                data-doc-title="{{ document.title|e('html_attr') }}"
-                data-doc-type="{{ document.object.type|e('html_attr') }}"
-                data-button="{{ button|json_encode }}"
-            ></span>
         {% else %}
             <a class="btn btn-update change-icon disabled" href="#" title="{{ 'workflow.freezed document'|trans }}">
                 <i class="fa fa-lock me-2"></i>{{ 'Update document'|trans }}

src/Bundle/ChillDocStoreBundle/Resources/views/Button/wopi_edit_document.html.twig

@@ -2,13 +2,11 @@
 <span data-module="wopi-link"
     data-wopi-url="{{ path('chill_wopi_file_edit', {'fileId': document.uuid}) }}"
     data-doc-type="{{ document.type|e('html_attr') }}"
-    data-button="{{ options|json_encode }}"
+    data-options="{{ options|json_encode }}"
 ></span>
-    
-    {{ chill_path_add_return_path('chill_wopi_file_edit', {'fileId': document.uuid}) }}
 #}
 
-{# Twig way,
+{# Twig way
     TODO: une route, un template avec un header CHILL et un iframe
 #}
 <a href="{{ chill_path_add_return_path('chill_wopi_file_edit', {'fileId': document.uuid}) }}"

src/Bundle/ChillMainBundle/Resources/public/module/wopi-link/index.js

@@ -8,16 +8,15 @@ window.addEventListener('DOMContentLoaded', function (e) {
     document.querySelectorAll('span[data-module="wopi-link"]')
         .forEach(function (el) {
             createApp({
-                template: '<open-wopi-link :wopiUrl="wopiUrl" :title="title" :type="type" :button="button"></open-wopi-link>',
+                template: '<open-wopi-link :wopiUrl="wopiUrl" :type="type" :options="options"></open-wopi-link>',
                 components: {
                     OpenWopiLink
                 },
                 data() {
                     return {
                         wopiUrl: el.dataset.wopiUrl,
-                        title: el.dataset.docTitle,
                         type: el.dataset.docType,
-                        button: el.dataset.button !== 'null' ? JSON.parse(el.dataset.button) : {}
+                        options: el.dataset.options !== 'null' ? JSON.parse(el.dataset.options) : {}
                     }
                 }
             })

src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/OpenWopiLink.vue

@@ -2,10 +2,10 @@
    <a v-if="isOpenDocument"
       class="btn" :class="[
          isChangeIcon ? 'change-icon' : '',
-         isChangeClass ? button.changeClass : 'btn-wopilink' ]"
+         isChangeClass ? options.changeClass : 'btn-wopilink' ]"
       @click="openModal">
       
-      <i v-if="isChangeIcon" class="fa me-2" :class="button.changeIcon"></i>
+      <i v-if="isChangeIcon" class="fa me-2" :class="options.changeIcon"></i>
       
       <span v-if="!noText">
          {{ $t('online_edit_document') }}
@@ -22,7 +22,7 @@
             <template v-slot:header>
                <img class="logo" :src="logo" height="45"/>
                   <span class="ms-auto me-3">
-                     <span v-if="title">{{ title }}</span>
+                     <span v-if="options.title">{{ options.title }}</span>
                   </span>
                   <!--
                   <a class="btn btn-outline-light">
@@ -75,15 +75,11 @@ export default {
          type: String,
          required: true
       },
-      title: {
-         type: String,
-         required: false
-      },
       type: {
          type: String,
          required: true
       },
-      button: {
+      options: {
          type: Object,
          required: false
       }
@@ -179,20 +175,20 @@ export default {
          return false;
       },
       noText() {
-         if (typeof this.button.noText !== 'undefined') {
+         if (typeof this.options.noText !== 'undefined') {
-            return this.button.noText === true;
+            return this.options.noText === true;
          }
          return false;
       },
       isChangeIcon() {
-         if (typeof this.button.changeIcon !== 'undefined') {
+         if (typeof this.options.changeIcon !== 'undefined') {
-            return (!(this.button.changeIcon === null || this.button.changeIcon === ''))
+            return (!(this.options.changeIcon === null || this.options.changeIcon === ''))
          }
          return false;
       },
       isChangeClass() {
-         if (typeof this.button.changeClass !== 'undefined') {
+         if (typeof this.options.changeClass !== 'undefined') {
-            return (!(this.button.changeClass === null || this.button.changeClass === ''))
+            return (!(this.options.changeClass === null || this.options.changeClass === ''))
          }
          return false;
       }