diff --git a/components/dashboard/src/components/SelectIDEComponent.tsx b/components/dashboard/src/components/SelectIDEComponent.tsx
index d5addce6ec3bde..88111bb23271ea 100644
--- a/components/dashboard/src/components/SelectIDEComponent.tsx
+++ b/components/dashboard/src/components/SelectIDEComponent.tsx
@@ -4,7 +4,7 @@
* See License.AGPL.txt in the project root for license information.
*/
-import { IDEOption, IDEOptions } from "@gitpod/gitpod-protocol/lib/ide-protocol";
+import { IDEOption, IDEOptions, makeIdeVersionHumanReadable } from "@gitpod/gitpod-protocol";
import { useCallback, useEffect, useState } from "react";
import { getGitpodService } from "../service/service";
import { DropDown2, DropDown2Element } from "./DropDown2";
@@ -149,7 +149,7 @@ function IdeOptionElementInDropDown(p: IdeOptionElementProps): JSX.Element {
{version && (
<>
·
- {version}
+ {makeIdeVersionHumanReadable(version)}
>
)}
{label && (
diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx
index 9dede2e9c420fe..cfe08670635c57 100644
--- a/components/dashboard/src/user-settings/SelectIDE.tsx
+++ b/components/dashboard/src/user-settings/SelectIDE.tsx
@@ -12,7 +12,7 @@ import Tooltip from "../components/Tooltip";
import { getGitpodService } from "../service/service";
import { UserContext } from "../user-context";
import CheckBox from "../components/CheckBox";
-import { User } from "@gitpod/gitpod-protocol";
+import { User, makeIdeVersionHumanReadable } from "@gitpod/gitpod-protocol";
import PillLabel from "../components/PillLabel";
export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences";
@@ -94,7 +94,12 @@ export default function SelectIDE(props: SelectIDEProps) {
const selected = defaultIde === id;
const version = useLatestVersion ? option.latestImageVersion : option.imageVersion;
const onSelect = () => actuallySetDefaultIde(id);
- return renderIdeOption(option, selected, version, onSelect);
+ return renderIdeOption(
+ option,
+ selected,
+ makeIdeVersionHumanReadable(version),
+ onSelect,
+ );
})}
{ideOptions.options[defaultIde]?.notes && (
diff --git a/components/gitpod-protocol/src/ide-protocol.spec.ts b/components/gitpod-protocol/src/ide-protocol.spec.ts
new file mode 100644
index 00000000000000..9166111de4f5b3
--- /dev/null
+++ b/components/gitpod-protocol/src/ide-protocol.spec.ts
@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) 2020 Gitpod GmbH. All rights reserved.
+ * Licensed under the GNU Affero General Public License (AGPL).
+ * See License-AGPL.txt in the project root for license information.
+ */
+
+import { suite, test } from "mocha-typescript";
+import * as chai from "chai";
+import { makeIdeVersionHumanReadable } from ".";
+
+const expect = chai.expect;
+
+@suite
+class TestIdeProtocol {
+ @test public testSuffixedIdeVersion() {
+ const versionString = "v1.74.0-insider";
+
+ expect(makeIdeVersionHumanReadable(versionString)).to.deep.equal("v1.74.0 Insider");
+ }
+ @test public testUnsuffixedIdeVersion() {
+ const versionString = "v1.74.0";
+
+ expect(makeIdeVersionHumanReadable(versionString)).to.deep.equal("v1.74.0");
+ }
+}
+module.exports = new TestIdeProtocol(); // Only to circumvent no usage warning :-/
diff --git a/components/gitpod-protocol/src/ide-protocol.ts b/components/gitpod-protocol/src/ide-protocol.ts
index 8c8685b80e679b..85bfe44d7b1157 100644
--- a/components/gitpod-protocol/src/ide-protocol.ts
+++ b/components/gitpod-protocol/src/ide-protocol.ts
@@ -145,3 +145,27 @@ export interface IDEOption {
*/
latestImageVersion?: string;
}
+
+/**
+ * Takes a version string of the form `X.Y.Z-` and returns a human-readable version string
+ * where the pre-release tag is capitalized and separated from the version number by a space.
+ *
+ * @example
+ * makeIdeVersionHumanReadable("1.74.0-insider") // returns "1.74.0 Insider"
+ *
+ * @param [versionString] - The version string to convert to human-readable format
+ * @returns A human-readable version string, or `undefined` if `versionString` is falsy
+ */
+export const makeIdeVersionHumanReadable = (versionString?: string): string | undefined => {
+ if (!versionString) {
+ return undefined;
+ }
+
+ let [version, pre] = versionString.split("-");
+ if (pre) {
+ // Capitalize the string, so that 1.74.0-insider becomes 1.74.0 Insider
+ pre = pre[0].toUpperCase() + pre.slice(1);
+ }
+
+ return [version, pre].join(" ").trim();
+};
diff --git a/components/gitpod-protocol/src/index.ts b/components/gitpod-protocol/src/index.ts
index 02c93b1dc0b839..18f64bef36b3ac 100644
--- a/components/gitpod-protocol/src/index.ts
+++ b/components/gitpod-protocol/src/index.ts
@@ -20,3 +20,4 @@ export * from "./snapshot-url";
export * from "./oss-allowlist";
export * from "./installation-admin-protocol";
export * from "./webhook-event";
+export * from "./ide-protocol";