🚧 Working on interactive editor, commiting to switch computer

src/components/LinkItems/Item.vue

@@ -40,7 +40,9 @@
       :id="`context-menu-${id}`"
       @launchItem="launchItem"
       @openItemSettings="openItemSettings"
+      @openMoveItemMenu="openMoveItemMenu"
     />
+    <MoveItemTo v-if="isEditMode" :itemId="id" />
     <EditItem v-if="editMenuOpen" :itemId="id" @closeEditMenu="closeEditMenu" />
   </div>
 </template>
@@ -52,6 +54,7 @@ import Icon from '@/components/LinkItems/ItemIcon.vue';
 import ItemOpenMethodIcon from '@/components/LinkItems/ItemOpenMethodIcon';
 import StatusIndicator from '@/components/LinkItems/StatusIndicator';
 import EditItem from '@/components/InteractiveEditor/EditItem';
+import MoveItemTo from '@/components/InteractiveEditor/MoveItemTo';
 import ContextMenu from '@/components/LinkItems/ItemContextMenu';
 import StoreKeys from '@/utils/StoreMutations';
 import { targetValidator } from '@/utils/ConfigHelpers';
@@ -92,6 +95,7 @@ export default {
     ItemOpenMethodIcon,
     StatusIndicator,
     ContextMenu,
+    MoveItemTo,
     EditItem,
     EditModeIcon,
   },
@@ -289,6 +293,11 @@ export default {
       lastUsed[itemId] = new Date().getTime();
       localStorage.setItem(localStorageKeys.LAST_USED, JSON.stringify(lastUsed));
     },
+    openMoveItemMenu() {
+      this.$modal.show(`${modalNames.MOVE_ITEM_TO}-${this.id}`);
+      this.$store.commit(StoreKeys.SET_MODAL_OPEN, true);
+      this.closeContextMenu();
+    },
   },
   mounted() {
     // If ststus checking is enabled, then check service status

src/components/LinkItems/ItemContextMenu.vue

@@ -33,7 +33,7 @@
           <EditIcon />
           <span>{{ $t('menu.edit-item') }}</span>
         </li>
-        <li v-if="isEditMode">
+        <li v-if="isEditMode" @click="openMoveMenu()">
           <MoveIcon />
           <span>{{ $t('menu.move-item') }}</span>
         </li>
@@ -51,7 +51,6 @@
 import EditIcon from '@/assets/interface-icons/config-edit-json.svg';
 import BinIcon from '@/assets/interface-icons/interactive-editor-remove.svg';
 import MoveIcon from '@/assets/interface-icons/interactive-editor-move-to.svg';
-
 import SameTabOpenIcon from '@/assets/interface-icons/open-current-tab.svg';
 import NewTabOpenIcon from '@/assets/interface-icons/open-new-tab.svg';
 import IframeOpenIcon from '@/assets/interface-icons/open-iframe.svg';
@@ -90,6 +89,9 @@ export default {
     openSettings() {
       this.$emit('openItemSettings');
     },
+    openMoveMenu() {
+      this.$emit('openMoveItemMenu');
+    },
   },
 };
 </script>

src/components/LinkItems/Section.vue

@@ -16,7 +16,7 @@
     </div>
     <div v-else
       :class="`there-are-items ${isGridLayout? 'item-group-grid': ''} inner-size-${itemSize}`"
-      :style="gridStyle"
+      :style="gridStyle" :id="`section-${groupId}`"
     >
       <Item
         v-for="(item) in sortedItems"
@@ -73,7 +73,11 @@ import EditSection from '@/components/InteractiveEditor/EditSection.vue';
 import ContextMenu from '@/components/LinkItems/SectionContextMenu.vue';
 import ErrorHandler from '@/utils/ErrorHandler';
 import StoreKeys from '@/utils/StoreMutations';
-import { sortOrder as defaultSortOrder, localStorageKeys, modalNames } from '@/utils/defaults';
+import {
+  sortOrder as defaultSortOrder,
+  localStorageKeys,
+  modalNames,
+} from '@/utils/defaults';
 
 export default {
   name: 'Section',