refactor: copy element into lp plugin

Author: abose

src/LiveDevelopment/BrowserScripts/RemoteFunctions.js

@@ -360,27 +360,6 @@ function RemoteFunctions(config = {}) {
         });
     }
 
-    /**
-     * this is for copy button, similar to cut just we don't remove the elements source code
-     * @param {Event} event
-     * @param {DOMElement} element
-     */
-    function _handleCopyOptionClick(event, element) {
-        if (LivePreviewView.isElementEditable(element)) {
-            const tagId = element.getAttribute(GLOBALS.DATA_BRACKETS_ID_ATTR);
-
-            window._Brackets_MessageBroker.send({
-                livePreviewEditEnabled: true,
-                element: element,
-                event: event,
-                tagId: Number(tagId),
-                copy: true
-            });
-        } else {
-            console.error("The TagID might be unavailable or the element tag is directly body or html");
-        }
-    }
-
     /**
      * this is for paste button, this inserts the saved content from clipboard just above this element
      * @param {Event} event
@@ -412,8 +391,6 @@ function RemoteFunctions(config = {}) {
     function handleOptionClick(e, action, element) {
         if (action === "edit-text") {
             startEditing(element);
-        } else if (action === "copy") {
-            _handleCopyOptionClick(e, element);
         } else if (action === "paste") {
             _handlePasteOptionClick(e, element);
         } else if (action === "ai") {
@@ -1031,10 +1008,6 @@ function RemoteFunctions(config = {}) {
 
             let content = `
                 <div class="more-options-dropdown">
-                    <div class="dropdown-item" data-action="copy">
-                        <span class="item-icon">${icons.copy}</span>
-                        <span class="item-label">${strings.copy}</span>
-                    </div>
                     <div class="dropdown-item" data-action="paste">
                         <span class="item-icon">${icons.paste}</span>
                         <span class="item-label">${strings.paste}</span>
@@ -1076,6 +1049,9 @@ function RemoteFunctions(config = {}) {
                     const handler = LivePreviewView.getNodeMoreOptionsHandler(action);
                     if (handler && handler.handleDropdownClick) {
                         handlerHandledIt = handler.handleDropdownClick(event, this.targetElement, this);
+                        if(handlerHandledIt) {
+                            this.remove();
+                        }
                     }
 
                     if (!handlerHandledIt) {

src/extensionsIntegrated/phoenix-pro/browser-context/generic-tools.js

@@ -155,7 +155,7 @@ LivePreviewView.registerNodeMoreOptionsHandler("selectParent", {
 
 function _renderCutDropdown() {
     return {
-        listOrder: proConstants.DROPDOWN_ORDERING.CUT_PASTE_SEPARATOR,
+        listOrder: proConstants.DROPDOWN_ORDERING.CUT,
         htmlContent: `<div class="dropdown-item" data-action="cut">
                         <span class="item-icon">${icons.cut}</span>
                         <span class="item-label">${strings.cut}</span>
@@ -193,6 +193,45 @@ LivePreviewView.registerNodeMoreOptionsHandler("cut", {
 });
 
 
+function _renderCopyDropdown() {
+    return {
+        listOrder: proConstants.DROPDOWN_ORDERING.COPY,
+        htmlContent: `<div class="dropdown-item" data-action="copy">
+                        <span class="item-icon">${icons.copy}</span>
+                        <span class="item-label">${strings.copy}</span>
+                    </div>`
+    };
+}
+
+/**
+ * this is for copy button, similar to cut just we don't remove the elements source code
+ * @param {Event} event
+ * @param {DOMElement} element
+ * @param {DOMElement} _dropdown
+ */
+function _handleCopyOptionClick(event, element, _dropdown) {
+    if (LivePreviewView.isElementEditable(element)) {
+        const tagId = element.getAttribute(GLOBALS.DATA_BRACKETS_ID_ATTR);
+
+        window._Brackets_MessageBroker.send({
+            livePreviewEditEnabled: true,
+            element: element,
+            event: event,
+            tagId: Number(tagId),
+            copy: true
+        });
+    } else {
+        console.error("The TagID might be unavailable or the element tag is directly body or html");
+    }
+    return true;
+}
+
+LivePreviewView.registerNodeMoreOptionsHandler("copy", {
+    renderDropdownItems: _renderCopyDropdown,
+    handleDropdownClick: _handleCopyOptionClick
+});
+
+
 LivePreviewView.registerNodeMoreOptionsHandler("cutPasteSeparator", {
     renderDropdownItems: ()=>{
         return {