diff --git a/apps/canvas/front/src/Gateways.tsx b/apps/canvas/front/src/Gateways.tsx
index e4785bd..6e02bc1 100644
--- a/apps/canvas/front/src/Gateways.tsx
+++ b/apps/canvas/front/src/Gateways.tsx
@@ -1,5 +1,5 @@
 import { useEnv } from "./lib/state";
-import { Copy, Check } from "lucide-react";
+import { Copy, Check, ExternalLink } from "lucide-react";
 import { Button } from "./components/ui/button";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./components/ui/tooltip";
 import { useCallback, useMemo, useState } from "react";
@@ -68,22 +68,37 @@
 			setOpen(false);
 		}, 1000);
 	}, [content, setClicked, setOpen]);
+	const handleClick = useCallback(() => {
+		if (g.type === "https") {
+			window.open(content, "_blank");
+		} else {
+			copy();
+		}
+	}, [g.type, content, copy]);
+
 	return (
 		<TooltipProvider>
 			<Tooltip delayDuration={100} open={open} onOpenChange={setOpen}>
 				<TooltipTrigger asChild>
-					<Button
-						variant="ghost"
-						onClick={g.type === "https" ? () => window.open(content, "_blank") : copy}
-						className="!gap-1 !p-0 !h-fit"
-					>
+					<Button variant="ghost" className="!gap-1 !p-0 !h-fit" onClick={handleClick}>
 						<AccessType access={g} className="w-4 h-4" />
 						<div className="hover:bg-gray-200 p-x-1">{hidden}</div>
 					</Button>
 				</TooltipTrigger>
-				<TooltipContent side="right" className="!bg-transparent cursor-pointer !p-0" sideOffset={10}>
-					{!clicked && <Copy className="w-4 h-4 !bg-transparent" color="black" />}
-					{clicked && <Check className="w-4 h-4 !bg-transparent" color="black" />}
+				<TooltipContent
+					side="right"
+					className="!bg-transparent cursor-pointer !p-0"
+					sideOffset={10}
+					onClick={copy}
+				>
+					{g.type === "https" ? (
+						<ExternalLink className="w-4 h-4 !bg-transparent" color="black" />
+					) : (
+						<>
+							{!clicked && <Copy className="w-4 h-4 !bg-transparent" color="black" />}
+							{clicked && <Check className="w-4 h-4 !bg-transparent" color="black" />}
+						</>
+					)}
 				</TooltipContent>
 			</Tooltip>
 		</TooltipProvider>
