Merge pull request #7723 from aignatov-bio/ai-sci-10834-fix-scinote-edit

Fix scinote edit in attachments [SCI-10834]
2024-09-20 14:45:56 +08:00 · 2024-07-17 12:40:38 +02:00 · 2024-07-17 12:40:38 +02:00 · eb03389065
parent a9980c04c7 a7ec6e0086
commit eb03389065
6 changed files with 52 additions and 189 deletions
--- 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>
--- 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');
    }
  }
 };
--- 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>
--- 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>
--- 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);
--- 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) {