Update Ports View to bring ability to change port forward protocol IDE-150

gitpod-remote/esbuild.js

@@ -42,6 +42,7 @@ build().catch((e) => {
 });
 
 if (isWatch) {
+    const srcDir = path.join(__dirname, '../gitpod-shared/portsview')
     const watcher = require('@parcel/watcher');
     watcher.subscribe(srcDir, () => {
         return build();

gitpod-remote/package.json

@@ -144,6 +144,16 @@
         "title": "%makePublic%",
         "icon": "$(lock)"
       },
+      {
+        "command": "gitpod.ports.makeHTTPS",
+        "title": "%makeHTTPS%",
+        "icon": "$(workspace-untrusted)"
+      },
+      {
+        "command": "gitpod.ports.makeHTTP",
+        "title": "%makeHTTP%",
+        "icon": "$(workspace-trusted)"
+      },
       {
         "command": "gitpod.ports.tunnelNetwork",
         "title": "%tunnelNetwork%",
@@ -303,6 +313,14 @@
           "command": "gitpod.ports.makePrivate",
           "when": "false"
         },
+        {
+          "command": "gitpod.ports.makeHTTPS",
+          "when": "false"
+        },
+        {
+          "command": "gitpod.ports.makeHTTP",
+          "when": "false"
+        },
         {
           "command": "gitpod.ports.tunnelNetwork",
           "when": "false"

gitpod-remote/src/portViewProvider.ts

@@ -3,7 +3,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as vscode from 'vscode';
 import { GitpodExtensionContext, ExposedServedGitpodWorkspacePort, GitpodWorkspacePort, isExposedServedGitpodWorkspacePort, isExposedServedPort, PortInfo, TunnelDescriptionI } from 'gitpod-shared';
-import { PortsStatus } from '@gitpod/supervisor-api-grpc/lib/status_pb';
+import { PortsStatus, PortProtocol, PortVisibility } from '@gitpod/supervisor-api-grpc/lib/status_pb';
 import { TunnelVisiblity } from '@gitpod/supervisor-api-grpc/lib/port_pb';
 
 const PortCommands = <const>['tunnelNetwork', 'tunnelHost', 'makePublic', 'makePrivate', 'preview', 'openBrowser', 'retryAutoExpose', 'urlCopy', 'queryPortData'];
@@ -34,14 +34,28 @@ export class GitpodPortViewProvider implements vscode.WebviewViewProvider {
 				...context.getWorkspaceTelemetryProperties(),
 				action: 'private'
 			});
-			context?.setPortVisibility(port.status.localPort, 'private');
+			context.controlPort(port.status.localPort, port.status.exposed, { visibility: PortVisibility.PRIVATE });
 		}));
 		context.subscriptions.push(vscode.commands.registerCommand('gitpod.ports.makePublic', ({ port }: PortItem) => {
 			context.telemetryService.sendTelemetryEvent('vscode_execute_command_gitpod_ports', {
 				...context.getWorkspaceTelemetryProperties(),
 				action: 'public'
 			});
-			context?.setPortVisibility(port.status.localPort, 'public');
+			context.controlPort(port.status.localPort, port.status.exposed, { visibility: PortVisibility.PUBLIC });
+		}));
+		context.subscriptions.push(vscode.commands.registerCommand('gitpod.ports.makeHTTPS', ({ port }: PortItem) => {
+			context.telemetryService.sendTelemetryEvent('vscode_execute_command_gitpod_ports', {
+				...context.getWorkspaceTelemetryProperties(),
+				action: 'https'
+			});
+			context.controlPort(port.status.localPort, port.status.exposed, { protocol: PortProtocol.HTTPS });
+		}));
+		context.subscriptions.push(vscode.commands.registerCommand('gitpod.ports.makeHTTP', ({ port }: PortItem) => {
+			context.telemetryService.sendTelemetryEvent('vscode_execute_command_gitpod_ports', {
+				...context.getWorkspaceTelemetryProperties(),
+				action: 'http'
+			});
+			context.controlPort(port.status.localPort, port.status.exposed, { protocol: PortProtocol.HTTP });
 		}));
 		context.subscriptions.push(vscode.commands.registerCommand('gitpod.ports.preview', ({ port }: PortItem) => {
 			context.telemetryService.sendTelemetryEvent('vscode_execute_command_gitpod_ports', {

gitpod-remote/yarn.lock

@@ -132,10 +132,10 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@gitpod/gitpod-protocol@main":
-  version "0.1.5-main.6379"
-  resolved "https://registry.yarnpkg.com/@gitpod/gitpod-protocol/-/gitpod-protocol-0.1.5-main.6379.tgz#8c654e9d1658a62648ec4a1bc837f3d5756f8a14"
-  integrity sha512-QLScSNODhMle/w23HSr3RihIh7S+ZE46JRbOqbFgR9+a0FBoxPtHi6kqUmeNgqvt+hfyjgdPG5/yddU7j0uznA==
+"@gitpod/gitpod-protocol@0.1.5-main-gha.10852":
+  version "0.1.5-main-gha.10852"
+  resolved "https://registry.yarnpkg.com/@gitpod/gitpod-protocol/-/gitpod-protocol-0.1.5-main-gha.10852.tgz#4792be291ba7021e939aa1e78200b1bd228a2a54"
+  integrity sha512-n0Ga2Mzjdt/1Gze0SOWpk+xpG2/S1Yi0/hOmRtCFo3MUWA3cFvNQzdP5TByHKUMOxW3pKMZr4dBl9+LYrLvnzQ==
   dependencies:
     "@types/react" "17.0.32"
     abort-controller-x "^0.4.0"
@@ -150,6 +150,7 @@
     js-yaml "^3.10.0"
     nice-grpc-common "^2.0.0"
     opentracing "^0.14.5"
+    parse-duration "^1.0.3"
     prom-client "^13.2.0"
     random-number-csprng "^1.0.2"
     react "17.0.2"
@@ -164,10 +165,10 @@
     vscode-ws-jsonrpc "^0.2.0"
     ws "^7.4.6"
 
-"@gitpod/supervisor-api-grpc@ak-rebuild-debug":
-  version "0.1.5-ak-rebuild-debug.65"
-  resolved "https://registry.yarnpkg.com/@gitpod/supervisor-api-grpc/-/supervisor-api-grpc-0.1.5-ak-rebuild-debug.65.tgz#fe295c15a3b58d340d9111207c9eef1564bfff3c"
-  integrity sha512-tuR/kEalT4/02ZDuO9OgkVg54+Fw3ZIfaQHHyanEZq52tPgSW0/sezoPN0TAJxg+D8mbd1NsiDeQZx/0Xg7TGA==
+"@gitpod/supervisor-api-grpc@0.1.5-main-gha.10852":
+  version "0.1.5-main-gha.10852"
+  resolved "https://registry.yarnpkg.com/@gitpod/supervisor-api-grpc/-/supervisor-api-grpc-0.1.5-main-gha.10852.tgz#83755a5c0539fe9482a141351a7441057e7d352c"
+  integrity sha512-/OWTpEVZMYut0IbAH50sx6yVYeQB9TKZu+3kgkGiwT6LihgrH98BXteFT77yrlpKTHmAuvdoN3XJCGGPhfePRA==
   dependencies:
     "@grpc/grpc-js" "^1.3.7"
     google-protobuf "^3.19.1"
@@ -2328,6 +2329,11 @@ parent-module@^1.0.0:
   dependencies:
     callsites "^3.0.0"
 
+parse-duration@^1.0.3:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/parse-duration/-/parse-duration-1.1.0.tgz#5192084c5d8f2a3fd676d04a451dbd2e05a1819c"
+  integrity sha512-z6t9dvSJYaPoQq7quMzdEagSFtpGu+utzHqqxmpVWNNZRIXnvqyCvn9XsTdh7c/w0Bqmdz3RB3YnRaKtpRtEXQ==
+
 parseurl@~1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"

gitpod-shared/package.json

@@ -30,8 +30,8 @@
   },
   "dependencies": {
     "configcat-node": "^8.0.0",
-    "@gitpod/gitpod-protocol": "main",
-    "@gitpod/supervisor-api-grpc": "ak-rebuild-debug",
+    "@gitpod/gitpod-protocol": "0.1.5-main-gha.10852",
+    "@gitpod/supervisor-api-grpc": "0.1.5-main-gha.10852",
     "@vscode/codicons": "^0.0.31",
     "@vscode/webview-ui-toolkit": "^1.0.0",
     "bufferutil": "^4.0.1",

gitpod-shared/portsview/src/porttable/PortTable.svelte

@@ -14,6 +14,7 @@
 	import PortLocalAddress from "./PortLocalAddress.svelte";
 	import { vscode } from "../utils/vscodeApi";
 	import type { GitpodPortObject, PortCommand } from "../protocol/gitpod";
+	import { PortProtocol } from "../protocol/gitpod";
 	import { getNLSTitle, getSplitCommands } from "../utils/commands";
 	import type { MenuOption } from "../protocol/components";
 	import PortHoverActions from './PortHoverActions.svelte';
@@ -76,9 +77,9 @@
 	let innerWidth = 0
 
 	const responsiveMap: Record<number, {layout: string; headers: string[]; options?: { allInPort?: boolean; }}> = {
-		850: {
-			layout: "50px 180px 1fr 180px 180px",
-			headers: ["", "Port", "Address", "Description", "State"],
+		950: {
+			layout: "50px 180px 1fr 90px 180px 180px",
+			headers: ["", "Port", "Address", "Protocol", "Description", "State"],
 		},
 		700: {
 			layout: "50px 180px 1fr 180px",
@@ -92,7 +93,7 @@
 
 	const sortedResponsiveKeys = Object.keys(responsiveMap).map(e => Number(e)).sort((a, b) => b - a)
 
-	$: useResponsive = responsiveMap[sortedResponsiveKeys.find(e => innerWidth > e) ?? 850]
+	$: useResponsive = responsiveMap[sortedResponsiveKeys.find(e => innerWidth > e) ?? 950]
 
 	//#endregion
 
@@ -162,6 +163,12 @@
 					</vscode-data-grid-cell>
 				{/if}
 
+				{#if useResponsive.headers.includes("Protocol")}
+					<vscode-data-grid-cell grid-column={useResponsive.headers.indexOf("Protocol") + 1} class="td">
+						<span title="Forward Protocol">{port.status.exposed?.protocol === PortProtocol.HTTPS ? 'HTTPS' : 'HTTP'}</span>
+					</vscode-data-grid-cell>
+				{/if}
+
 				{#if useResponsive.headers.includes("Description")}
 					<vscode-data-grid-cell grid-column={useResponsive.headers.indexOf("Description") + 1} class="td">
 						<span title={port.status.description}>{port.status.description}</span>

gitpod-shared/portsview/src/protocol/gitpod.ts

@@ -25,6 +25,11 @@ export enum PortVisibility {
 	PUBLIC = 1,
 }
 
+export enum PortProtocol {
+    HTTP = 0,
+    HTTPS = 1,
+}
+
 export enum OnPortExposedAction {
 	IGNORE = 0,
 	OPEN_BROWSER = 1,
@@ -49,6 +54,7 @@ export enum TaskState {
 export namespace ExposedPortInfo {
 	export type AsObject = {
 		visibility: PortVisibility;
+		protocol: PortProtocol;
 		url: string;
 		onExposed: OnPortExposedAction;
 	};
@@ -81,6 +87,6 @@ export interface GitpodPortObject {
 	status: PortsStatus.AsObject & { remotePort?: number };
 }
 
-export const PortCommands = <const>['tunnelNetwork', 'tunnelHost', 'makePublic', 'makePrivate', 'preview', 'openBrowser', 'retryAutoExpose', 'urlCopy', 'queryPortData'];
+export const PortCommands = <const>['tunnelNetwork', 'tunnelHost', 'makePublic', 'makePrivate', 'preview', 'openBrowser', 'retryAutoExpose', 'urlCopy', 'queryPortData', 'makeHTTP', 'makeHTTPS'];
 
 export type PortCommand = typeof PortCommands[number];

gitpod-shared/portsview/src/utils/commands.ts

@@ -22,6 +22,8 @@ export const commandIconMap: Record<PortCommand, string> = {
 	tunnelHost: 'eye-closed',
 	makePublic: 'lock',
 	makePrivate: 'unlock',
+	makeHTTP: 'workspace-trusted',
+	makeHTTPS: 'workspace-untrusted',
 	preview: 'open-preview',
 	openBrowser: 'globe',
 	retryAutoExpose: 'refresh',
@@ -37,7 +39,7 @@ window.addEventListener('message', (event) => {
 });
 
 export function getCommands(port: GitpodPortObject): PortCommand[] {
-	return getSplitCommands(port).filter(e => !!e) as PortCommand[];
+	return getSplitCommands(port).filter(e => !!e && e !== 'makeHTTP' && e !== 'makeHTTPS') as PortCommand[];
 }
 
 export function getSplitCommands(port: GitpodPortObject) {
@@ -68,6 +70,14 @@ export function getSplitCommands(port: GitpodPortObject) {
 		}
 		opts.push('retryAutoExpose');
 	}
+	if (opts.length > 0) {
+		opts.push(null);
+	}
+	if (viewItem.includes('https')) {
+		opts.push('makeHTTP');
+	} else {
+		opts.push('makeHTTPS');
+	}
 	if (supportedCommands.length > 0) {
 		return opts.filter(e => e === null || supportedCommands.includes(e));
 	}

gitpod-shared/src/gitpodContext.ts

@@ -5,7 +5,6 @@
 import { GitpodClient, GitpodServer, GitpodServiceImpl, WorkspaceInstanceUpdateListener } from '@gitpod/gitpod-protocol/lib/gitpod-service';
 import { User } from '@gitpod/gitpod-protocol/lib/protocol';
 import { Team } from '@gitpod/gitpod-protocol/lib/teams-projects-protocol';
-import { PortVisibility } from '@gitpod/gitpod-protocol/lib/workspace-instance';
 import { ControlServiceClient } from '@gitpod/supervisor-api-grpc/lib/control_grpc_pb';
 import { ExposePortRequest } from '@gitpod/supervisor-api-grpc/lib/control_pb';
 import { InfoServiceClient } from '@gitpod/supervisor-api-grpc/lib/info_grpc_pb';
@@ -14,7 +13,7 @@ import { NotificationServiceClient } from '@gitpod/supervisor-api-grpc/lib/notif
 import { PortServiceClient } from '@gitpod/supervisor-api-grpc/lib/port_grpc_pb';
 import { CloseTunnelRequest, RetryAutoExposeRequest, TunnelPortRequest, TunnelVisiblity } from '@gitpod/supervisor-api-grpc/lib/port_pb';
 import { StatusServiceClient } from '@gitpod/supervisor-api-grpc/lib/status_grpc_pb';
-import { PortsStatus, PortsStatusRequest, PortsStatusResponse } from '@gitpod/supervisor-api-grpc/lib/status_pb';
+import { ExposedPortInfo, PortProtocol, PortVisibility, PortsStatus, PortsStatusRequest, PortsStatusResponse } from '@gitpod/supervisor-api-grpc/lib/status_pb';
 import { TerminalServiceClient } from '@gitpod/supervisor-api-grpc/lib/terminal_grpc_pb';
 import { TokenServiceClient } from '@gitpod/supervisor-api-grpc/lib/token_grpc_pb';
 import { GetTokenRequest } from '@gitpod/supervisor-api-grpc/lib/token_pb';
@@ -311,10 +310,14 @@ export class GitpodExtensionContext implements vscode.ExtensionContext {
 		}
 	}
 
-	async setPortVisibility(port: number, visibility: PortVisibility): Promise<void> {
+	async controlPort(port: number, prevStatus: ExposedPortInfo.AsObject | undefined, updateOptions: Partial<Pick<ExposedPortInfo.AsObject, 'visibility' | 'protocol'>>): Promise<void> {
+		const protocol = updateOptions.protocol ?? prevStatus?.protocol ?? PortProtocol.HTTP;
+		const visibility = updateOptions.visibility ?? prevStatus?.visibility ?? PortVisibility.PRIVATE;
+
 		await this.gitpod.server.openPort(this.info.workspaceId, {
 			port,
-			visibility
+			protocol: protocol === PortProtocol.HTTPS ? 'https' : 'http',
+			visibility: visibility === PortVisibility.PUBLIC ? 'public' : 'private',
 		});
 	}
 

gitpod-shared/src/workspacePort.ts

@@ -2,7 +2,7 @@
  *  Copyright (c) Gitpod. All rights reserved.
  *--------------------------------------------------------------------------------------------*/
 
-import { PortsStatus, PortAutoExposure, PortVisibility, ExposedPortInfo } from '@gitpod/supervisor-api-grpc/lib/status_pb';
+import { PortsStatus, PortAutoExposure, PortVisibility, ExposedPortInfo, PortProtocol } from '@gitpod/supervisor-api-grpc/lib/status_pb';
 import { URL } from 'url';
 
 export interface ExposedPort extends PortsStatus.AsObject {
@@ -153,6 +153,9 @@ export class GitpodWorkspacePort {
 		if (!accessible && portStatus.autoExposure === PortAutoExposure.FAILED) {
 			port.contextValue = 'failed-' + port.contextValue;
 		}
+		if (exposed?.protocol && exposed.protocol === PortProtocol.HTTPS) {
+			port.contextValue = 'https-' + port.contextValue;
+		}
 		return port;
 	}
 

gitpod-shared/yarn.lock

@@ -2,10 +2,10 @@
 # yarn lockfile v1
 
 
-"@gitpod/gitpod-protocol@main":
-  version "0.1.5-main.6559"
-  resolved "https://registry.yarnpkg.com/@gitpod/gitpod-protocol/-/gitpod-protocol-0.1.5-main.6559.tgz#e771beee25447b12dce79fea4abad4caed8db9fc"
-  integrity sha512-v6E5AnpiTkWEBhyuBT8/gXVYzSKHUK1IUoa9CCr3q5jsdgG0egGzotcsu1OTmDZ68R1UKCvu4RddQZgU5ZGTjg==
+"@gitpod/gitpod-protocol@0.1.5-main-gha.10852":
+  version "0.1.5-main-gha.10852"
+  resolved "https://registry.yarnpkg.com/@gitpod/gitpod-protocol/-/gitpod-protocol-0.1.5-main-gha.10852.tgz#4792be291ba7021e939aa1e78200b1bd228a2a54"
+  integrity sha512-n0Ga2Mzjdt/1Gze0SOWpk+xpG2/S1Yi0/hOmRtCFo3MUWA3cFvNQzdP5TByHKUMOxW3pKMZr4dBl9+LYrLvnzQ==
   dependencies:
     "@types/react" "17.0.32"
     abort-controller-x "^0.4.0"
@@ -20,6 +20,7 @@
     js-yaml "^3.10.0"
     nice-grpc-common "^2.0.0"
     opentracing "^0.14.5"
+    parse-duration "^1.0.3"
     prom-client "^13.2.0"
     random-number-csprng "^1.0.2"
     react "17.0.2"
@@ -34,10 +35,10 @@
     vscode-ws-jsonrpc "^0.2.0"
     ws "^7.4.6"
 
-"@gitpod/supervisor-api-grpc@ak-rebuild-debug":
-  version "0.1.5-ak-rebuild-debug.65"
-  resolved "https://registry.yarnpkg.com/@gitpod/supervisor-api-grpc/-/supervisor-api-grpc-0.1.5-ak-rebuild-debug.65.tgz#fe295c15a3b58d340d9111207c9eef1564bfff3c"
-  integrity sha512-tuR/kEalT4/02ZDuO9OgkVg54+Fw3ZIfaQHHyanEZq52tPgSW0/sezoPN0TAJxg+D8mbd1NsiDeQZx/0Xg7TGA==
+"@gitpod/supervisor-api-grpc@0.1.5-main-gha.10852":
+  version "0.1.5-main-gha.10852"
+  resolved "https://registry.yarnpkg.com/@gitpod/supervisor-api-grpc/-/supervisor-api-grpc-0.1.5-main-gha.10852.tgz#83755a5c0539fe9482a141351a7441057e7d352c"
+  integrity sha512-/OWTpEVZMYut0IbAH50sx6yVYeQB9TKZu+3kgkGiwT6LihgrH98BXteFT77yrlpKTHmAuvdoN3XJCGGPhfePRA==
   dependencies:
     "@grpc/grpc-js" "^1.3.7"
     google-protobuf "^3.19.1"
@@ -1430,6 +1431,11 @@ parent-module@^1.0.0:
   dependencies:
     callsites "^3.0.0"
 
+parse-duration@^1.0.3:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/parse-duration/-/parse-duration-1.1.0.tgz#5192084c5d8f2a3fd676d04a451dbd2e05a1819c"
+  integrity sha512-z6t9dvSJYaPoQq7quMzdEagSFtpGu+utzHqqxmpVWNNZRIXnvqyCvn9XsTdh7c/w0Bqmdz3RB3YnRaKtpRtEXQ==
+
 parseurl@~1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"

gitpod-web/esbuild.js

@@ -42,6 +42,7 @@ build().catch((e) => {
 });
 
 if (isWatch) {
+    const srcDir = path.join(__dirname, '../gitpod-shared/portsview')
     const watcher = require('@parcel/watcher');
     watcher.subscribe(srcDir, () => {
         return build();

gitpod-web/package.json

@@ -148,6 +148,16 @@
         "title": "%makePublic%",
         "icon": "$(lock)"
       },
+      {
+        "command": "gitpod.ports.makeHTTPS",
+        "title": "%makeHTTPS%",
+        "icon": "$(workspace-untrusted)"
+      },
+      {
+        "command": "gitpod.ports.makeHTTP",
+        "title": "%makeHTTP%",
+        "icon": "$(workspace-trusted)"
+      },
       {
         "command": "gitpod.ports.tunnelNetwork",
         "title": "%tunnelNetwork%",
@@ -341,6 +351,14 @@
           "command": "gitpod.ports.makePrivate",
           "when": "false"
         },
+        {
+          "command": "gitpod.ports.makeHTTPS",
+          "when": "false"
+        },
+        {
+          "command": "gitpod.ports.makeHTTP",
+          "when": "false"
+        },
         {
           "command": "gitpod.ports.tunnelNetwork",
           "when": "false"

gitpod-web/package.nls.json

@@ -5,6 +5,8 @@
 	"openPreview": "Open Preview",
 	"makePrivate": "Make Private",
 	"makePublic": "Make Public",
+	"makeHTTPS": "Use HTTPS Protocol",
+	"makeHTTP": "Use HTTP Protocol",
 	"tunnelNetwork": "Tunnel on all interfaces",
 	"tunnelHost": "Tunnel on localhost",
 	"addToConfig": "Add to .gitpod.yml",