From a7ec6e0086ffc82ef77b900dd9e1f9b4976ae3ce Mon Sep 17 00:00:00 2001
From: Anton <anton@scinote.net>
Date: Wed, 17 Jul 2024 12:13:51 +0200
Subject: [PATCH] Fix scinote edit in attachments [SCI-10834]

---
 .../attachments/attachment_actions.vue        | 36 ------------
 .../content/attachments/context_menu.vue      | 33 +----------
 .../vue/shared/content/attachments/inline.vue | 33 -----------
 .../vue/shared/content/attachments/list.vue   | 33 -----------
 .../shared/content/attachments/open_menu.vue  | 55 +++++++++++++++++--
 .../shared/content/attachments/thumbnail.vue  | 51 +----------------
 6 files changed, 52 insertions(+), 189 deletions(-)

diff --git a/app/javascript/vue/shared/content/attachments/attachment_actions.vue b/app/javascript/vue/shared/content/attachments/attachment_actions.vue
index a4b6d6f4c..71561f7c3 100644
--- a/app/javascript/vue/shared/content/attachments/attachment_actions.vue
+++ b/app/javascript/vue/shared/content/attachments/attachment_actions.vue
@@ -2,7 +2,6 @@
   <div class="flex items-center gap-1.5 justify-end w-[184px]">
     <OpenMenu
       :attachment="attachment"
-      :multipleOpenOptions="multipleOpenOptions"
       @open="$emit('attachment:toggle_menu', $event)"
       @close="$emit('attachment:toggle_menu', $event)"
       @menu-dropdown-toggle="$emit('attachment:toggle_menu', $event)"
@@ -48,41 +47,6 @@ export default {
   components: {
     OpenMenu,
     ContextMenu
-  },
-  mounted() {
-    this.fetchLocalAppInfo();
-  },
-  computed: {
-    multipleOpenOptions() {
-      const options = [];
-      if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
-        options.push({
-          text: this.attachment.attributes.wopi_context.button_text,
-          url: this.attachment.attributes.urls.edit_asset,
-          url_target: '_blank'
-        });
-      }
-      if (this.attachment.attributes.asset_type !== 'marvinjs'
-          && this.attachment.attributes.image_editable
-          && this.attachment.attributes.urls.start_edit_image) {
-        options.push({
-          text: this.i18n.t('assets.file_preview.edit_in_scinote'),
-          emit: 'open_scinote_editor'
-        });
-      }
-      if (this.canOpenLocally) {
-        const text = this.localAppName
-          ? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
-          : this.i18n.t('attachments.open_locally');
-
-        options.push({
-          text,
-          emit: 'open_locally',
-          data_e2e: 'e2e-BT-attachmentOptions-openLocally'
-        });
-      }
-      return options;
-    }
   }
 };
 </script>
diff --git a/app/javascript/vue/shared/content/attachments/context_menu.vue b/app/javascript/vue/shared/content/attachments/context_menu.vue
index e6b8d51d0..bb17af66c 100644
--- a/app/javascript/vue/shared/content/attachments/context_menu.vue
+++ b/app/javascript/vue/shared/content/attachments/context_menu.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="asset-context-menu"
        ref="menu"
-       @mouseenter="fetchLocalAppInfo"
   >
     <a  class="marvinjs-edit-button hidden"
         v-if="attachment.attributes.asset_type == 'marvinjs' && attachment.attributes.urls.marvin_js_start_edit"
@@ -30,10 +29,6 @@
       :btnClasses="`btn icon-btn bg-sn-white ${ withBorder ? 'btn-secondary' : 'btn-light'}`"
       :position="'right'"
       :btnIcon="'sn-icon sn-icon-more-hori'"
-      @open_ove_editor="openOVEditor(attachment.attributes.urls.open_vector_editor_edit)"
-      @open_marvinjs_editor="openMarvinJsEditor"
-      @open_scinote_editor="openScinoteEditor"
-      @open_locally="openLocally"
       @delete="deleteModal = true"
       @rename="renameModal = true"
       @duplicate="duplicate"
@@ -60,21 +55,6 @@
         :targets_url="attachment.attributes.urls.move_targets"
         @confirm="moveAttachment($event)" @cancel="closeMoveModal"
       />
-      <NoPredefinedAppModal
-        v-if="showNoPredefinedAppModal"
-        :fileName="attachment.attributes.file_name"
-        @close="showNoPredefinedAppModal = false"
-      />
-      <UpdateVersionModal
-        v-if="showUpdateVersionModal"
-        @close="showUpdateVersionModal = false"
-      />
-      <editLaunchingApplicationModal
-        v-if="editAppModal"
-        :fileName="attachment.attributes.file_name"
-        :application="this.localAppName"
-        @close="editAppModal = false"
-      />
     </Teleport>
   </div>
 </template>
@@ -84,7 +64,6 @@ import RenameAttachmentModal from '../modal/rename_modal.vue';
 import deleteAttachmentModal from './delete_modal.vue';
 import MoveAssetModal from '../modal/move.vue';
 import MoveMixin from './mixins/move.js';
-import OpenLocallyMixin from './mixins/open_locally.js';
 import MenuDropdown from '../../menu_dropdown.vue';
 import axios from '../../../../packs/custom_axios.js';
 
@@ -96,7 +75,7 @@ export default {
     MoveAssetModal,
     MenuDropdown
   },
-  mixins: [MoveMixin, OpenLocallyMixin],
+  mixins: [MoveMixin],
   props: {
     attachment: {
       type: Object,
@@ -186,16 +165,6 @@ export default {
     },
     reloadAttachments() {
       this.$emit('attachment:uploaded');
-    },
-    openMarvinJsEditor() {
-      MarvinJsEditor.initNewButton(
-        this.$refs.marvinjsEditButton,
-        this.reloadAttachments
-      );
-      $(this.$refs.marvinjsEditButton).trigger('click');
-    },
-    openScinoteEditor() {
-      $(this.$refs.imageEditButton).trigger('click');
     }
   }
 };
diff --git a/app/javascript/vue/shared/content/attachments/inline.vue b/app/javascript/vue/shared/content/attachments/inline.vue
index df5fae80d..14788fc32 100644
--- a/app/javascript/vue/shared/content/attachments/inline.vue
+++ b/app/javascript/vue/shared/content/attachments/inline.vue
@@ -34,7 +34,6 @@
       <div class="flex items-center ml-auto gap-2">
         <AttachmentActions
           :attachment="attachment"
-          :showOptions="showOptions"
           @attachment:viewMode="updateViewMode"
           @attachment:delete="deleteAttachment"
           @attachment:moved="attachmentMoved"
@@ -158,37 +157,5 @@ export default {
       this.isMenuDropdownOpen = isOpen;
     }
   },
-  computed: {
-    multipleOpenOptions() {
-      const options = [];
-      if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
-        options.push({
-          text: this.attachment.attributes.wopi_context.button_text,
-          url: this.attachment.attributes.urls.edit_asset,
-          url_target: '_blank'
-        });
-      }
-      if (this.attachment.attributes.asset_type !== 'marvinjs'
-          && this.attachment.attributes.image_editable
-          && this.attachment.attributes.urls.start_edit_image) {
-        options.push({
-          text: this.i18n.t('assets.file_preview.edit_in_scinote'),
-          emit: 'open_scinote_editor'
-        });
-      }
-      if (this.canOpenLocally) {
-        const text = this.localAppName
-          ? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
-          : this.i18n.t('attachments.open_locally');
-
-        options.push({
-          text,
-          emit: 'open_locally',
-          data_e2e: 'e2e-BT-attachmentOptions-openLocally'
-        });
-      }
-      return options;
-    }
-  }
 };
 </script>
diff --git a/app/javascript/vue/shared/content/attachments/list.vue b/app/javascript/vue/shared/content/attachments/list.vue
index d29b21d6f..d8cdc5ad6 100644
--- a/app/javascript/vue/shared/content/attachments/list.vue
+++ b/app/javascript/vue/shared/content/attachments/list.vue
@@ -33,7 +33,6 @@
     <div class="attachment-actions shrink-0 ml-auto">
       <AttachmentActions
           :attachment="attachment"
-          :showOptions="showOptions"
           @attachment:viewMode="updateViewMode"
           @attachment:delete="deleteAttachment"
           @attachment:moved="attachmentMoved"
@@ -106,37 +105,5 @@ export default {
       this.isMenuDropdownOpen = isOpen;
     }
   },
-  computed: {
-    multipleOpenOptions() {
-      const options = [];
-      if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
-        options.push({
-          text: this.attachment.attributes.wopi_context.button_text,
-          url: this.attachment.attributes.urls.edit_asset,
-          url_target: '_blank'
-        });
-      }
-      if (this.attachment.attributes.asset_type !== 'marvinjs'
-          && this.attachment.attributes.image_editable
-          && this.attachment.attributes.urls.start_edit_image) {
-        options.push({
-          text: this.i18n.t('assets.file_preview.edit_in_scinote'),
-          emit: 'open_scinote_editor'
-        });
-      }
-      if (this.canOpenLocally) {
-        const text = this.localAppName
-          ? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
-          : this.i18n.t('attachments.open_locally');
-
-        options.push({
-          text,
-          emit: 'open_locally',
-          data_e2e: 'e2e-BT-attachmentOptions-openLocally'
-        });
-      }
-      return options;
-    }
-  }
 };
 </script>
diff --git a/app/javascript/vue/shared/content/attachments/open_menu.vue b/app/javascript/vue/shared/content/attachments/open_menu.vue
index 36157bf64..c648b546e 100644
--- a/app/javascript/vue/shared/content/attachments/open_menu.vue
+++ b/app/javascript/vue/shared/content/attachments/open_menu.vue
@@ -1,5 +1,5 @@
 <template>
-  <span>
+  <span @mouseenter="fetchLocalAppInfo()">
     <!-- multiple options -->
     <MenuDropdown
       v-if="multipleOpenOptions.length > 1"
@@ -87,6 +87,23 @@
       :data-image-mime-type="attachment.attributes.image_context.type"
       :data-image-start-edit-url="attachment.attributes.urls.start_edit_image"
     ></a>
+    <Teleport to="body">
+      <NoPredefinedAppModal
+        v-if="showNoPredefinedAppModal"
+        :fileName="attachment.attributes.file_name"
+        @close="showNoPredefinedAppModal = false"
+      />
+      <UpdateVersionModal
+        v-if="showUpdateVersionModal"
+        @close="showUpdateVersionModal = false"
+      />
+      <editLaunchingApplicationModal
+        v-if="editAppModal"
+        :fileName="attachment.attributes.file_name"
+        :application="this.localAppName"
+        @close="editAppModal = false"
+      />
+    </Teleport>
   </span>
 </template>
 
@@ -102,15 +119,43 @@ export default {
     MenuDropdown
   },
   props: {
-    multipleOpenOptions: {
-      type: Array,
-      required: true
-    },
     attachment: {
       type: Object,
       required: true
     }
   },
+  computed: {
+    multipleOpenOptions() {
+      const options = [];
+      if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
+        options.push({
+          text: this.attachment.attributes.wopi_context.button_text,
+          url: this.attachment.attributes.urls.edit_asset,
+          url_target: '_blank'
+        });
+      }
+      if (this.attachment.attributes.asset_type !== 'marvinjs'
+          && this.attachment.attributes.image_editable
+          && this.attachment.attributes.urls.start_edit_image) {
+        options.push({
+          text: this.i18n.t('assets.file_preview.edit_in_scinote'),
+          emit: 'open_scinote_editor'
+        });
+      }
+      if (this.canOpenLocally) {
+        const text = this.localAppName
+          ? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
+          : this.i18n.t('attachments.open_locally');
+
+        options.push({
+          text,
+          emit: 'open_locally',
+          data_e2e: 'e2e-BT-attachmentOptions-openLocally'
+        });
+      }
+      return options;
+    }
+  },
   methods: {
     toggleMenu(isOpen) {
       this.$emit('menu-dropdown-toggle', isOpen);
diff --git a/app/javascript/vue/shared/content/attachments/thumbnail.vue b/app/javascript/vue/shared/content/attachments/thumbnail.vue
index e178189ec..ebdc25442 100644
--- a/app/javascript/vue/shared/content/attachments/thumbnail.vue
+++ b/app/javascript/vue/shared/content/attachments/thumbnail.vue
@@ -75,21 +75,6 @@
         :targets_url="attachment.attributes.urls.move_targets"
         @confirm="moveAttachment($event)" @cancel="closeMoveModal"
       />
-      <NoPredefinedAppModal
-        v-if="showNoPredefinedAppModal"
-        :fileName="attachment.attributes.file_name"
-        @close="showNoPredefinedAppModal = false"
-      />
-      <UpdateVersionModal
-        v-if="showUpdateVersionModal"
-        @close="showUpdateVersionModal = false"
-      />
-      <editLaunchingApplicationModal
-        v-if="editAppModal"
-        :fileName="attachment.attributes.file_name"
-        :application="this.localAppName"
-        @close="editAppModal = false"
-      />
     </Teleport>
     <a  class="image-edit-button hidden"
       v-if="attachment.attributes.asset_type != 'marvinjs'
@@ -114,14 +99,13 @@ import deleteAttachmentModal from './delete_modal.vue';
 import MenuDropdown from '../../../shared/menu_dropdown.vue';
 import MoveAssetModal from '../modal/move.vue';
 import MoveMixin from './mixins/move.js';
-import OpenLocallyMixin from './mixins/open_locally.js';
 import OpenMenu from './open_menu.vue';
 import AttachmentActions from './attachment_actions.vue';
 import { vOnClickOutside } from '@vueuse/components';
 
 export default {
   name: 'thumbnailAttachment',
-  mixins: [ContextMenuMixin, AttachmentMovedMixin, MoveMixin, OpenLocallyMixin],
+  mixins: [ContextMenuMixin, AttachmentMovedMixin, MoveMixin],
   components: {
     ContextMenu,
     deleteAttachmentModal,
@@ -154,38 +138,6 @@ export default {
   directives: {
     'click-outside': vOnClickOutside
   },
-  computed: {
-    multipleOpenOptions() {
-      const options = [];
-      if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
-        options.push({
-          text: this.attachment.attributes.wopi_context.button_text,
-          url: this.attachment.attributes.urls.edit_asset,
-          url_target: '_blank'
-        });
-      }
-      if (this.attachment.attributes.asset_type !== 'marvinjs'
-          && this.attachment.attributes.image_editable
-          && this.attachment.attributes.urls.start_edit_image) {
-        options.push({
-          text: this.i18n.t('assets.file_preview.edit_in_scinote'),
-          emit: 'open_scinote_editor'
-        });
-      }
-      if (this.canOpenLocally) {
-        const text = this.localAppName
-          ? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
-          : this.i18n.t('attachments.open_locally');
-
-        options.push({
-          text,
-          emit: 'open_locally',
-          data_e2e: 'e2e-BT-attachmentOptions-openLocally'
-        });
-      }
-      return options;
-    }
-  },
   mounted() {
     $(this.$nextTick(() => {
       $('.attachment-preview img')
@@ -218,7 +170,6 @@ export default {
       }
     },
     async handleMouseEnter() {
-      await this.fetchLocalAppInfo();
       this.showOptions = true;
     },
     toggleMenu(isMenuOpen) {