add copy link

src/components/Apps/AppViewer.tsx

@@ -43,6 +43,35 @@ export const AppViewer = React.forwardRef(({ app , hide}, iframeRef) => {
     };
   }, [app, path]);
 
+  const removeTrailingSlash = (str) => str.replace(/\/$/, '');
+  const copyLinkFunc = (e) => {
+    const {tabId} = e.detail
+    if(tabId === app?.tabId){
+      let link = 'qortal://' + app?.service + '/' + app?.name 
+      if(path && path.startsWith('/')){
+        link = link +  removeTrailingSlash(path)
+      }
+      if(path && !path.startsWith('/')){
+        link = link + '/' +  removeTrailingSlash(path)
+      }
+      navigator.clipboard.writeText(link)
+      .then(() => {
+        console.log("Path copied to clipboard:", path);
+      })
+      .catch((error) => {
+        console.error("Failed to copy path:", error);
+      });
+    }
+  };
+
+  useEffect(() => {
+    subscribeToEvent("copyLink", copyLinkFunc);
+
+    return () => {
+      unsubscribeFromEvent("copyLink", copyLinkFunc);
+    };
+  }, [app, path]);
+
  // Function to navigate back in iframe
  const navigateBackInIframe = async () => {
   if (iframeRef.current && iframeRef.current.contentWindow && history?.currentIndex > 0) {

src/components/Apps/AppsNavBar.tsx

@@ -7,6 +7,8 @@ import {
 import NavBack from "../../assets/svgs/NavBack.svg";
 import NavAdd from "../../assets/svgs/NavAdd.svg";
 import NavMoreMenu from "../../assets/svgs/NavMoreMenu.svg";
+import ContentCopyIcon from '@mui/icons-material/ContentCopy';
+
 import {
   ButtonBase,
   ListItemIcon,
@@ -341,6 +343,38 @@ export const AppsNavBar = () => {
             primary="Refresh"
           />
         </MenuItem>
+        <MenuItem
+          onClick={() => {
+            executeEvent("copyLink", {
+              tabId: selectedTab?.tabId,
+            });
+            handleClose();
+          }}
+        >
+          <ListItemIcon
+            sx={{
+              minWidth: "24px !important",
+              marginRight: "5px",
+            }}
+          >
+            <ContentCopyIcon
+              height={20}
+              sx={{
+                color: "rgba(250, 250, 250, 0.5)",
+              }}
+            />
+          </ListItemIcon>
+          <ListItemText
+            sx={{
+              "& .MuiTypography-root": {
+                fontSize: "12px",
+                fontWeight: 600,
+                color: "rgba(250, 250, 250, 0.5)",
+              },
+            }}
+            primary="Copy link"
+          />
+        </MenuItem>
       </Menu>
     </AppsNavBarParent>
   );

src/components/Apps/AppsNavBarDesktop.tsx

@@ -7,6 +7,8 @@ import {
 import NavBack from "../../assets/svgs/NavBack.svg";
 import NavAdd from "../../assets/svgs/NavAdd.svg";
 import NavMoreMenu from "../../assets/svgs/NavMoreMenu.svg";
+import ContentCopyIcon from '@mui/icons-material/ContentCopy';
+
 import {
   ButtonBase,
   ListItemIcon,
@@ -366,6 +368,38 @@ export const AppsNavBarDesktop = () => {
             primary="Refresh"
           />
         </MenuItem>
+        <MenuItem
+          onClick={() => {
+            executeEvent("copyLink", {
+              tabId: selectedTab?.tabId,
+            });
+            handleClose();
+          }}
+        >
+          <ListItemIcon
+            sx={{
+              minWidth: "24px !important",
+              marginRight: "5px",
+            }}
+          >
+            <ContentCopyIcon
+              height={20}
+              sx={{
+                color: "rgba(250, 250, 250, 0.5)",
+              }}
+            />
+          </ListItemIcon>
+          <ListItemText
+            sx={{
+              "& .MuiTypography-root": {
+                fontSize: "12px",
+                fontWeight: 600,
+                color: "rgba(250, 250, 250, 0.5)",
+              },
+            }}
+            primary="Copy link"
+          />
+        </MenuItem>
       </Menu>
     </AppsNavBarParent>
   );