|
1 | 1 | importLinkfrom"@mui/material/Link"; |
2 | | -importtype{Workspace,WorkspaceAgentDevcontainer}from"api/typesGenerated"; |
| 2 | +importtype{ |
| 3 | +Workspace, |
| 4 | +WorkspaceAgentDevcontainer, |
| 5 | +WorkspaceAgentDevcontainerPort, |
| 6 | +}from"api/typesGenerated"; |
3 | 7 | import{ExternalLinkIcon}from"lucide-react"; |
4 | 8 | importtype{FC}from"react"; |
5 | 9 | import{portForwardURL}from"utils/portForward"; |
6 | 10 | import{AgentButton}from"./AgentButton"; |
7 | 11 | import{AgentDevcontainerSSHButton}from"./SSHButton/SSHButton"; |
8 | 12 | import{TerminalLink}from"./TerminalLink/TerminalLink"; |
| 13 | +importTooltip,{typeTooltipProps}from"@mui/material/Tooltip"; |
9 | 14 |
|
10 | 15 | typeAgentDevcontainerCardProps={ |
11 | 16 | container:WorkspaceAgentDevcontainer; |
@@ -47,25 +52,38 @@ export const AgentDevcontainerCard: FC<AgentDevcontainerCardProps> = ({ |
47 | 52 | /> |
48 | 53 | {wildcardHostname!==""&& |
49 | 54 | container.ports.map((port)=>{ |
| 55 | +letportLabel=`${port.port}/${port.network.toUpperCase()}`; |
| 56 | +lethasHostBind= |
| 57 | +port.host_port!==undefined&& |
| 58 | +port.host_port!==null&& |
| 59 | +port.host_ip!==undefined&& |
| 60 | +port.host_ip!==null; |
| 61 | +lethelperText=hasHostBind |
| 62 | +?`${port.host_ip}:${port.host_port}` |
| 63 | +:"Not bound to host"; |
50 | 64 | return( |
51 | | -<Link |
52 | | -key={port.port} |
53 | | -color="inherit" |
54 | | -component={AgentButton} |
55 | | -underline="none" |
56 | | -startIcon={<ExternalLinkIconclassName="size-icon-sm"/>} |
57 | | -href={portForwardURL( |
58 | | -wildcardHostname, |
59 | | -port.port, |
60 | | -agentName, |
61 | | -workspace.name, |
62 | | -workspace.owner_name, |
63 | | -location.protocol==="https" ?"https" :"http", |
64 | | -)} |
65 | | -> |
66 | | -{port.process_name|| |
67 | | -`${port.port}/${port.network.toUpperCase()}`} |
68 | | -</Link> |
| 65 | +<Tooltipkey={portLabel}title={helperText}> |
| 66 | +<span> |
| 67 | +<Link |
| 68 | +key={portLabel} |
| 69 | +color="inherit" |
| 70 | +component={AgentButton} |
| 71 | +underline="none" |
| 72 | +startIcon={<ExternalLinkIconclassName="size-icon-sm"/>} |
| 73 | +disabled={!hasHostBind} |
| 74 | +href={portForwardURL( |
| 75 | +wildcardHostname, |
| 76 | +port.host_port!, |
| 77 | +agentName, |
| 78 | +workspace.name, |
| 79 | +workspace.owner_name, |
| 80 | +location.protocol==="https" ?"https" :"http", |
| 81 | +)} |
| 82 | +> |
| 83 | +{portLabel} |
| 84 | +</Link> |
| 85 | +</span> |
| 86 | +</Tooltip> |
69 | 87 | ); |
70 | 88 | })} |
71 | 89 | </div> |
|