From b90fff3d388e57e18feeef64e70744c1d53bee82 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 16:30:46 +0000 Subject: [PATCH 01/19] Replace `` with `` --- components/dashboard/src/user-settings/Preferences.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index 5035bc771ce4a9..b9c262ea8fde01 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -8,7 +8,8 @@ import { useCallback, useContext, useState } from "react"; import { getGitpodService } from "../service/service"; import { UserContext } from "../user-context"; import { trackEvent } from "../Analytics"; -import SelectIDE from "./SelectIDE"; +import SelectIDEComponent from "../components/SelectIDEComponent"; +import { updateUserIDEInfo } from "./SelectIDE"; import { PageWithSettingsSubMenu } from "./PageWithSettingsSubMenu"; import { ThemeSelector } from "../components/ThemeSelector"; import Alert from "../components/Alert"; @@ -74,7 +75,11 @@ export default function Preferences() { Learn more - + { + await updateUserIDEInfo(user!, ide, latest, "preferences"); + }} + /> From 189af1c6b8d3a284739be4cad324bf6f9342a467 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 17:50:48 +0000 Subject: [PATCH 02/19] The latest checkbox --- .../src/components/SelectIDEComponent.tsx | 4 +- .../src/user-settings/Preferences.tsx | 57 ++++++++++++++++++- 2 files changed, 57 insertions(+), 4 deletions(-) diff --git a/components/dashboard/src/components/SelectIDEComponent.tsx b/components/dashboard/src/components/SelectIDEComponent.tsx index d5addce6ec3bde..cc92d3ab2642b4 100644 --- a/components/dashboard/src/components/SelectIDEComponent.tsx +++ b/components/dashboard/src/components/SelectIDEComponent.tsx @@ -37,7 +37,7 @@ export default function SelectIDEComponent(props: SelectIDEComponentProps) { element: , isSelectable: true, }); - if (ide.latestImage) { + if (props.useLatest && ide.latestImage) { result.push({ id: ide.id + "-latest", element: , @@ -47,7 +47,7 @@ export default function SelectIDEComponent(props: SelectIDEComponentProps) { } return result; }, - [ideOptions], + [ideOptions, props.useLatest], ); const internalOnSelectionChange = (id: string) => { const { ide, useLatest } = parseId(id); diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index b9c262ea8fde01..f46196949a34c2 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -17,6 +17,8 @@ import { Link } from "react-router-dom"; import { Heading2, Subheading } from "../components/typography/headings"; import { useUserMaySetTimeout } from "../data/current-user/may-set-timeout-query"; import { Button } from "../components/Button"; +import CheckBox from "../components/CheckBox"; +import { User } from "@gitpod/gitpod-protocol"; export default function Preferences() { const { user, setUser } = useContext(UserContext); @@ -25,6 +27,26 @@ export default function Preferences() { const [dotfileRepo, setDotfileRepo] = useState(user?.additionalData?.dotfileRepo || ""); const [workspaceTimeout, setWorkspaceTimeout] = useState(user?.additionalData?.workspaceTimeout ?? ""); + const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); + + const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { + const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, "preferences"); + setUser({ ...newUserData }); + }; + + const actuallySetDefaultIde = async (value: string) => { + await actualUpdateUserIDEInfo(user!, value, useLatestVersion); + setDefaultIde(value); + }; + + const [useLatestVersion, setUseLatestVersion] = useState( + user?.additionalData?.ideSettings?.useLatestVersion ?? false, + ); + const actuallySetUseLatestVersion = async (value: boolean) => { + await actualUpdateUserIDEInfo(user!, defaultIde, value); + setUseLatestVersion(value); + }; + const saveDotfileRepo = useCallback( async (e) => { e.preventDefault(); @@ -76,9 +98,40 @@ export default function Preferences() { { - await updateUserIDEInfo(user!, ide, latest, "preferences"); + onSelectionChange={async (ide) => { + await actuallySetDefaultIde(ide); }} + selectedIdeOption={defaultIde} + useLatest={useLatestVersion} + /> + + + Use the latest version for each editor.{" "} + + Insiders + {" "} + for VS Code,{" "} + + EAP + {" "} + for JetBrains IDEs. + + } + checked={useLatestVersion} + onChange={(e) => actuallySetUseLatestVersion(e.target.checked)} /> From 0b71102a0d4f996f222357cb012b71fce9226455 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 18:28:32 +0000 Subject: [PATCH 03/19] Don't show stable IDEs when latest is selected --- .../dashboard/src/components/SelectIDEComponent.tsx | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/components/dashboard/src/components/SelectIDEComponent.tsx b/components/dashboard/src/components/SelectIDEComponent.tsx index cc92d3ab2642b4..9c953de377ebfe 100644 --- a/components/dashboard/src/components/SelectIDEComponent.tsx +++ b/components/dashboard/src/components/SelectIDEComponent.tsx @@ -32,12 +32,13 @@ export default function SelectIDEComponent(props: SelectIDEComponentProps) { for (const ide of options.filter((ide) => `${ide.label}${ide.title}${ide.notes}${ide.id}`.toLowerCase().includes(search.toLowerCase()), )) { - result.push({ - id: ide.id, - element: , - isSelectable: true, - }); - if (props.useLatest && ide.latestImage) { + if (!props.useLatest) { + result.push({ + id: ide.id, + element: , + isSelectable: true, + }); + } else if (ide.latestImage) { result.push({ id: ide.id + "-latest", element: , From 93745c172a0ce0bc4844ca04d5c70a3223bb56cc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 20:07:02 +0000 Subject: [PATCH 04/19] Limit width --- .../dashboard/src/user-settings/Preferences.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index f46196949a34c2..232d1aa9c50a1f 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -97,13 +97,15 @@ export default function Preferences() { Learn more - { - await actuallySetDefaultIde(ide); - }} - selectedIdeOption={defaultIde} - useLatest={useLatestVersion} - /> +
+ { + await actuallySetDefaultIde(ide); + }} + selectedIdeOption={defaultIde} + useLatest={useLatestVersion} + /> +
Date: Tue, 14 Mar 2023 20:28:34 +0000 Subject: [PATCH 05/19] Enlarge --- components/dashboard/src/user-settings/Preferences.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index 232d1aa9c50a1f..6a524abfc80ac5 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -97,7 +97,7 @@ export default function Preferences() { Learn more -
+
{ await actuallySetDefaultIde(ide); From 7c232aa62889dcee9cac8c54d720cebd978c538e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 21:10:08 +0000 Subject: [PATCH 06/19] Remove `` --- .../src/user-settings/Preferences.tsx | 28 ++- .../dashboard/src/user-settings/SelectIDE.tsx | 222 ------------------ 2 files changed, 27 insertions(+), 223 deletions(-) delete mode 100644 components/dashboard/src/user-settings/SelectIDE.tsx diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index 6a524abfc80ac5..702be1b9442d29 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -9,7 +9,6 @@ import { getGitpodService } from "../service/service"; import { UserContext } from "../user-context"; import { trackEvent } from "../Analytics"; import SelectIDEComponent from "../components/SelectIDEComponent"; -import { updateUserIDEInfo } from "./SelectIDE"; import { PageWithSettingsSubMenu } from "./PageWithSettingsSubMenu"; import { ThemeSelector } from "../components/ThemeSelector"; import Alert from "../components/Alert"; @@ -20,6 +19,33 @@ import { Button } from "../components/Button"; import CheckBox from "../components/CheckBox"; import { User } from "@gitpod/gitpod-protocol"; +export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; + +export const updateUserIDEInfo = async ( + user: User, + selectedIde: string, + useLatestVersion: boolean, + location: IDEChangedTrackLocation, +) => { + const additionalData = user?.additionalData ?? {}; + const settings = additionalData.ideSettings ?? {}; + settings.settingVersion = "2.0"; + settings.defaultIde = selectedIde; + settings.useLatestVersion = useLatestVersion; + additionalData.ideSettings = settings; + getGitpodService() + .server.trackEvent({ + event: "ide_configuration_changed", + properties: { + ...settings, + location, + }, + }) + .then() + .catch(console.error); + return getGitpodService().server.updateLoggedInUser({ additionalData }); +}; + export default function Preferences() { const { user, setUser } = useContext(UserContext); const maySetTimeout = useUserMaySetTimeout(); diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx deleted file mode 100644 index 9dede2e9c420fe..00000000000000 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ /dev/null @@ -1,222 +0,0 @@ -/** - * Copyright (c) 2022 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 { IDEOption, IDEOptions } from "@gitpod/gitpod-protocol/lib/ide-protocol"; -import { useContext, useEffect, useState } from "react"; -import InfoBox from "../components/InfoBox"; -import SelectableCardSolid from "../components/SelectableCardSolid"; -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 PillLabel from "../components/PillLabel"; - -export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; -interface SelectIDEProps { - updateUserContext?: boolean; - location: IDEChangedTrackLocation; -} - -export const updateUserIDEInfo = async ( - user: User, - selectedIde: string, - useLatestVersion: boolean, - location: IDEChangedTrackLocation, -) => { - const additionalData = user?.additionalData ?? {}; - const settings = additionalData.ideSettings ?? {}; - settings.settingVersion = "2.0"; - settings.defaultIde = selectedIde; - settings.useLatestVersion = useLatestVersion; - additionalData.ideSettings = settings; - getGitpodService() - .server.trackEvent({ - event: "ide_configuration_changed", - properties: { - ...settings, - location, - }, - }) - .then() - .catch(console.error); - return getGitpodService().server.updateLoggedInUser({ additionalData }); -}; - -export default function SelectIDE(props: SelectIDEProps) { - const { user, setUser } = useContext(UserContext); - - // Only exec once when we access this component - useEffect(() => { - user && User.migrationIDESettings(user); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - - const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { - const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, props.location); - props.updateUserContext && setUser({ ...newUserData }); - }; - - const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); - const actuallySetDefaultIde = async (value: string) => { - await actualUpdateUserIDEInfo(user!, value, useLatestVersion); - setDefaultIde(value); - }; - - const [useLatestVersion, setUseLatestVersion] = useState( - user?.additionalData?.ideSettings?.useLatestVersion ?? false, - ); - const actuallySetUseLatestVersion = async (value: boolean) => { - await actualUpdateUserIDEInfo(user!, defaultIde, value); - setUseLatestVersion(value); - }; - - const [ideOptions, setIdeOptions] = useState(undefined); - useEffect(() => { - (async () => { - setIdeOptions(await getGitpodService().server.getIDEOptions()); - })(); - }, []); - - const allIdeOptions = ideOptions && orderedIdeOptions(ideOptions); - - return ( - <> - {ideOptions && ( - <> - {allIdeOptions && ( - <> -
- {allIdeOptions.map(([id, option]) => { - const selected = defaultIde === id; - const version = useLatestVersion ? option.latestImageVersion : option.imageVersion; - const onSelect = () => actuallySetDefaultIde(id); - return renderIdeOption(option, selected, version, onSelect); - })} -
- {ideOptions.options[defaultIde]?.notes && ( - -
    - {ideOptions.options[defaultIde].notes?.map((x, idx) => ( -
  • 0 ? "mt-2" : ""}>{x}
    • - ))} -
- - )} - -

- JetBrains integration is currently in{" "} - - - Beta - - -  ·  - - Send feedback - -

- - )} - - Use the latest version for each editor.{" "} - - Insiders - {" "} - for VS Code,{" "} - - EAP - {" "} - for JetBrains IDEs. - - } - checked={useLatestVersion} - onChange={(e) => actuallySetUseLatestVersion(e.target.checked)} - /> - - )} - - ); -} - -function orderedIdeOptions(ideOptions: IDEOptions) { - // TODO: Maybe convert orderKey to number before sort? - return Object.entries(ideOptions.options) - .filter(([_, x]) => !x.hidden) - .sort((a, b) => { - const keyA = a[1].orderKey || a[0]; - const keyB = b[1].orderKey || b[0]; - return keyA.localeCompare(keyB); - }); -} - -function renderIdeOption( - option: IDEOption, - selected: boolean, - version: IDEOption["imageVersion"], - onSelect: () => void, -): JSX.Element { - const shouldShowOptionType = option.type !== "desktop" || option.title === "VS Code"; // Force show of "Desktop" in the list for VS Code Desktop - const card = ( - - {version ? ( - - {version} - - ) : ( - - )} -
- logo -
- {shouldShowOptionType ? ( - - {option.type} - - ) : ( - option.label && ( - - {option.label} - - ) - )} - - ); - - if (option.tooltip) { - return {card}; - } - return card; -} From 94741e05d6fbcb60f264d0e047e0d60f1874cc2c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 21:49:25 +0000 Subject: [PATCH 07/19] Back, back to school again --- .../src/user-settings/Preferences.tsx | 10 +- .../dashboard/src/user-settings/SelectIDE.tsx | 112 ++++++++++++++++++ 2 files changed, 114 insertions(+), 8 deletions(-) create mode 100644 components/dashboard/src/user-settings/SelectIDE.tsx diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index 702be1b9442d29..ff23c6fc2609a7 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -8,7 +8,6 @@ import { useCallback, useContext, useState } from "react"; import { getGitpodService } from "../service/service"; import { UserContext } from "../user-context"; import { trackEvent } from "../Analytics"; -import SelectIDEComponent from "../components/SelectIDEComponent"; import { PageWithSettingsSubMenu } from "./PageWithSettingsSubMenu"; import { ThemeSelector } from "../components/ThemeSelector"; import Alert from "../components/Alert"; @@ -18,6 +17,7 @@ import { useUserMaySetTimeout } from "../data/current-user/may-set-timeout-query import { Button } from "../components/Button"; import CheckBox from "../components/CheckBox"; import { User } from "@gitpod/gitpod-protocol"; +import SelectIDE from "./SelectIDE"; export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; @@ -124,13 +124,7 @@ export default function Preferences() {
- { - await actuallySetDefaultIde(ide); - }} - selectedIdeOption={defaultIde} - useLatest={useLatestVersion} - /> +
{ + const additionalData = user?.additionalData ?? {}; + const settings = additionalData.ideSettings ?? {}; + settings.settingVersion = "2.0"; + settings.defaultIde = selectedIde; + settings.useLatestVersion = useLatestVersion; + additionalData.ideSettings = settings; + getGitpodService() + .server.trackEvent({ + event: "ide_configuration_changed", + properties: { + ...settings, + location, + }, + }) + .then() + .catch(console.error); + return getGitpodService().server.updateLoggedInUser({ additionalData }); +}; + +export default function SelectIDE(props: SelectIDEProps) { + const { user, setUser } = useContext(UserContext); + + // Only exec once when we access this component + useEffect(() => { + user && User.migrationIDESettings(user); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { + const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, props.location); + props.updateUserContext && setUser({ ...newUserData }); + }; + + const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); + const actuallySetDefaultIde = async (value: string) => { + await actualUpdateUserIDEInfo(user!, value, useLatestVersion); + setDefaultIde(value); + }; + + const [useLatestVersion, setUseLatestVersion] = useState( + user?.additionalData?.ideSettings?.useLatestVersion ?? false, + ); + const actuallySetUseLatestVersion = async (value: boolean) => { + await actualUpdateUserIDEInfo(user!, defaultIde, value); + setUseLatestVersion(value); + }; + + return ( + <> + { + await actuallySetDefaultIde(ide); + }} + selectedIdeOption={defaultIde} + useLatest={useLatestVersion} + /> + + Use the latest version for each editor.{" "} + + Insiders + {" "} + for VS Code,{" "} + + EAP + {" "} + for JetBrains IDEs. + + } + checked={useLatestVersion} + onChange={(e) => actuallySetUseLatestVersion(e.target.checked)} + /> + + ); +} From 83c805d0a9970a28e95a4e99b296477766b3f09d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 22:03:57 +0000 Subject: [PATCH 08/19] Dead code --- .../src/user-settings/Preferences.tsx | 49 ------------------- 1 file changed, 49 deletions(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index ff23c6fc2609a7..8f6bcfeac59e25 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -53,26 +53,6 @@ export default function Preferences() { const [dotfileRepo, setDotfileRepo] = useState(user?.additionalData?.dotfileRepo || ""); const [workspaceTimeout, setWorkspaceTimeout] = useState(user?.additionalData?.workspaceTimeout ?? ""); - const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); - - const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { - const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, "preferences"); - setUser({ ...newUserData }); - }; - - const actuallySetDefaultIde = async (value: string) => { - await actualUpdateUserIDEInfo(user!, value, useLatestVersion); - setDefaultIde(value); - }; - - const [useLatestVersion, setUseLatestVersion] = useState( - user?.additionalData?.ideSettings?.useLatestVersion ?? false, - ); - const actuallySetUseLatestVersion = async (value: boolean) => { - await actualUpdateUserIDEInfo(user!, defaultIde, value); - setUseLatestVersion(value); - }; - const saveDotfileRepo = useCallback( async (e) => { e.preventDefault(); @@ -127,35 +107,6 @@ export default function Preferences() {
- - Use the latest version for each editor.{" "} - - Insiders - {" "} - for VS Code,{" "} - - EAP - {" "} - for JetBrains IDEs. - - } - checked={useLatestVersion} - onChange={(e) => actuallySetUseLatestVersion(e.target.checked)} - /> - Dotfiles From f7035e61b89fba3e60e0107a845b5a00e618f7d5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Tue, 14 Mar 2023 22:15:56 +0000 Subject: [PATCH 09/19] Fix width --- .../dashboard/src/user-settings/Preferences.tsx | 4 +--- .../dashboard/src/user-settings/SelectIDE.tsx | 16 +++++++++------- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index 8f6bcfeac59e25..ce505c9251711c 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -103,9 +103,7 @@ export default function Preferences() { Learn more -
- -
+ diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx index 3dae3d15a642fc..3c095c503ae3c4 100644 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ b/components/dashboard/src/user-settings/SelectIDE.tsx @@ -72,13 +72,15 @@ export default function SelectIDE(props: SelectIDEProps) { return ( <> - { - await actuallySetDefaultIde(ide); - }} - selectedIdeOption={defaultIde} - useLatest={useLatestVersion} - /> +
+ { + await actuallySetDefaultIde(ide); + }} + selectedIdeOption={defaultIde} + useLatest={useLatestVersion} + /> +
Date: Wed, 15 Mar 2023 12:17:47 +0100 Subject: [PATCH 10/19] Use `width` instead of `max-width` --- components/dashboard/src/user-settings/SelectIDE.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx index 3c095c503ae3c4..7dda954c33a246 100644 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ b/components/dashboard/src/user-settings/SelectIDE.tsx @@ -72,7 +72,7 @@ export default function SelectIDE(props: SelectIDEProps) { return ( <> -
+
{ await actuallySetDefaultIde(ide); From c10b8a00a90601802e3fda0b262bf21a68e061e2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Wed, 15 Mar 2023 11:55:23 +0000 Subject: [PATCH 11/19] Remove unused import --- components/dashboard/src/user-settings/Preferences.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index ce505c9251711c..f12f2e29bac805 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -15,7 +15,6 @@ import { Link } from "react-router-dom"; import { Heading2, Subheading } from "../components/typography/headings"; import { useUserMaySetTimeout } from "../data/current-user/may-set-timeout-query"; import { Button } from "../components/Button"; -import CheckBox from "../components/CheckBox"; import { User } from "@gitpod/gitpod-protocol"; import SelectIDE from "./SelectIDE"; From 3ba2dad2fdd27a03e263879d29fb269259eefac5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Wed, 15 Mar 2023 19:32:01 +0000 Subject: [PATCH 12/19] Show JB beta notice --- .../dashboard/src/user-settings/SelectIDE.tsx | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx index 7dda954c33a246..e571cf958ca21f 100644 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ b/components/dashboard/src/user-settings/SelectIDE.tsx @@ -10,6 +10,7 @@ import { UserContext } from "../user-context"; import CheckBox from "../components/CheckBox"; import { User } from "@gitpod/gitpod-protocol"; import SelectIDEComponent from "../components/SelectIDEComponent"; +import PillLabel from "../components/PillLabel"; export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; interface SelectIDEProps { @@ -70,6 +71,9 @@ export default function SelectIDE(props: SelectIDEProps) { setUseLatestVersion(value); }; + //todo(ft): find a better way to group IDEs by vendor + const shouldShowJetbrainsNotice = !["code", "code-desktop"].includes(defaultIde); // a really hacky way to get just JetBrains IDEs + return ( <>
@@ -81,6 +85,27 @@ export default function SelectIDE(props: SelectIDEProps) { useLatest={useLatestVersion} />
+ + {shouldShowJetbrainsNotice && ( +

+ JetBrains integration is currently in{" "} + + + Beta + + +  ·  + + Send feedback + +

+ )} + Date: Wed, 15 Mar 2023 19:44:56 +0000 Subject: [PATCH 13/19] Add a margin to the selector --- components/dashboard/src/user-settings/SelectIDE.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx index e571cf958ca21f..1ae8e522b04281 100644 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ b/components/dashboard/src/user-settings/SelectIDE.tsx @@ -76,7 +76,7 @@ export default function SelectIDE(props: SelectIDEProps) { return ( <> -
+
{ await actuallySetDefaultIde(ide); From 381770b3d89df49a22f0224ff2c92ba9a7696436 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Thu, 16 Mar 2023 14:40:35 +0000 Subject: [PATCH 14/19] Remove custom modal width Co-authored-by: George Tsiolis --- components/dashboard/src/user-settings/SelectIDEModal.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/components/dashboard/src/user-settings/SelectIDEModal.tsx b/components/dashboard/src/user-settings/SelectIDEModal.tsx index 340d4837b01158..545c078c05f6a0 100644 --- a/components/dashboard/src/user-settings/SelectIDEModal.tsx +++ b/components/dashboard/src/user-settings/SelectIDEModal.tsx @@ -44,7 +44,6 @@ export default function SelectIDEModal(props: SelectIDEModalProps) { visible={visible} onClose={handleContinue} closeable={true} - className="max-w-51.5" buttons={} >

From 6d19d4191821ecf5ef7655a8ec31d270531660fb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Thu, 16 Mar 2023 16:02:13 +0000 Subject: [PATCH 15/19] Finish off the age-old todo :) --- components/dashboard/tailwind.config.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/components/dashboard/tailwind.config.js b/components/dashboard/tailwind.config.js index ec804e8b546e98..169575b206e67e 100644 --- a/components/dashboard/tailwind.config.js +++ b/components/dashboard/tailwind.config.js @@ -46,10 +46,6 @@ module.exports = { 112: "28rem", 128: "32rem", }, - maxWidth: { - // TODO(andreafalzetti): remove custom ide-modal class once we implement https://github.com/gitpod-io/gitpod/issues/13116 - 51.5: "51.5rem", - }, lineHeight: { 64: "64px", }, From 203e3bd8704679cbf9289194b5df38496f8a2708 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Thu, 16 Mar 2023 20:42:16 +0000 Subject: [PATCH 16/19] Remove `` --- components/dashboard/src/app/AppRoutes.tsx | 15 +---- .../src/user-settings/SelectIDEModal.tsx | 59 ------------------- .../dashboard/src/workspaces/Workspaces.tsx | 15 +---- 3 files changed, 3 insertions(+), 86 deletions(-) delete mode 100644 components/dashboard/src/user-settings/SelectIDEModal.tsx diff --git a/components/dashboard/src/app/AppRoutes.tsx b/components/dashboard/src/app/AppRoutes.tsx index db7eebb1d4cef8..f9f75a5dfa49ef 100644 --- a/components/dashboard/src/app/AppRoutes.tsx +++ b/components/dashboard/src/app/AppRoutes.tsx @@ -4,16 +4,14 @@ * See License.AGPL.txt in the project root for license information. */ -import { ContextURL, User } from "@gitpod/gitpod-protocol"; +import { User } from "@gitpod/gitpod-protocol"; import React, { useContext, useState } from "react"; import { Redirect, Route, Switch, useLocation } from "react-router"; import { AppNotifications } from "../AppNotifications"; import Menu from "../menu/Menu"; import OAuthClientApproval from "../OauthClientApproval"; import { projectsPathInstallGitHubApp, projectsPathNew } from "../projects/projects.routes"; -import { StartPage, StartPhase } from "../start/StartPage"; import { parseProps } from "../start/StartWorkspace"; -import SelectIDEModal from "../user-settings/SelectIDEModal"; import { settingsPathAccount, settingsPathBilling, @@ -137,16 +135,7 @@ export const AppRoutes = () => { // TODO: Try and encapsulate this in a route for "/" (check for hash in route component, render or redirect accordingly) const isCreation = location.pathname === "/" && hash !== ""; if (isCreation) { - // Prefix with `/#referrer` will specify an IDE for workspace - // After selection is saved, user will be updated, and this condition will be false - const showIDESelection = User.isOnboardingUser(user) && !hash.startsWith(ContextURL.REFERRER_PREFIX); - if (showIDESelection) { - return ( - - - - ); - } else if (new URLSearchParams(location.search).has("showOptions") || newCreateWsPage) { + if (new URLSearchParams(location.search).has("showOptions") || newCreateWsPage) { return ; } else { return ; diff --git a/components/dashboard/src/user-settings/SelectIDEModal.tsx b/components/dashboard/src/user-settings/SelectIDEModal.tsx deleted file mode 100644 index 545c078c05f6a0..00000000000000 --- a/components/dashboard/src/user-settings/SelectIDEModal.tsx +++ /dev/null @@ -1,59 +0,0 @@ -/** - * Copyright (c) 2022 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 { useState, useContext } from "react"; -import { Link } from "react-router-dom"; -import { User } from "@gitpod/gitpod-protocol"; -import SelectIDE, { IDEChangedTrackLocation, updateUserIDEInfo } from "./SelectIDE"; -import Modal from "../components/Modal"; -import { UserContext } from "../user-context"; - -export interface SelectIDEModalProps { - location: IDEChangedTrackLocation; - onClose?: () => void; -} - -export default function SelectIDEModal(props: SelectIDEModalProps) { - const { user, setUser } = useContext(UserContext); - const [visible, setVisible] = useState(true); - - const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { - const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, props.location); - setUser({ ...newUserData }); - }; - - const handleContinue = async () => { - setVisible(false); - if (!user || User.hasPreferredIde(user)) { - props.onClose && props.onClose(); - return; - } - // TODO: We need to get defaultIde in ideOptions.. - const defaultIde = "code"; - await actualUpdateUserIDEInfo(user, defaultIde, false); - props.onClose && props.onClose(); - }; - - return ( - Continue} - > -

- Choose the editor for opening workspaces. You can always change later the editor in{" "} - - user preferences - - . -

- - - ); -} diff --git a/components/dashboard/src/workspaces/Workspaces.tsx b/components/dashboard/src/workspaces/Workspaces.tsx index 83d46aaa19f418..2ed05825b030c9 100644 --- a/components/dashboard/src/workspaces/Workspaces.tsx +++ b/components/dashboard/src/workspaces/Workspaces.tsx @@ -8,29 +8,22 @@ import { FunctionComponent, useCallback, useMemo, useState } from "react"; import Header from "../components/Header"; import { WorkspaceEntry } from "./WorkspaceEntry"; import { ItemsList } from "../components/ItemsList"; -import { useCurrentUser } from "../user-context"; -import { User, WorkspaceInfo } from "@gitpod/gitpod-protocol"; -import SelectIDEModal from "../user-settings/SelectIDEModal"; +import { WorkspaceInfo } from "@gitpod/gitpod-protocol"; import Arrow from "../components/Arrow"; import ConfirmationModal from "../components/ConfirmationModal"; -import { ProfileState } from "../user-settings/ProfileInformation"; import { useListWorkspacesQuery } from "../data/workspaces/list-workspaces-query"; import { EmptyWorkspacesContent } from "./EmptyWorkspacesContent"; import { WorkspacesSearchBar } from "./WorkspacesSearchBar"; import { hoursBefore, isDateSmallerOrEqual } from "@gitpod/gitpod-protocol/lib/util/timeutil"; import { useDeleteInactiveWorkspacesMutation } from "../data/workspaces/delete-inactive-workspaces-mutation"; -import { useFeatureFlags } from "../contexts/FeatureFlagContext"; const WorkspacesPage: FunctionComponent = () => { - const user = useCurrentUser(); const [limit, setLimit] = useState(50); const [searchTerm, setSearchTerm] = useState(""); const [showInactive, setShowInactive] = useState(false); const [deleteModalVisible, setDeleteModalVisible] = useState(false); const { data, isLoading } = useListWorkspacesQuery({ limit }); - const isOnboardingUser = useMemo(() => user && User.isOnboardingUser(user), [user]); const deleteInactiveWorkspaces = useDeleteInactiveWorkspacesMutation(); - const { newSignupFlow } = useFeatureFlags(); // Sort workspaces into active/inactive groups const { activeWorkspaces, inactiveWorkspaces } = useMemo(() => { @@ -96,12 +89,6 @@ const WorkspacesPage: FunctionComponent = () => { /> )} - {/* TODO: can remove this once newSignupFlow flag is enabled */} - {isOnboardingUser && !newSignupFlow && } - - {/* TODO: can remove this once newSignupFlow flag is enabled */} - {!isOnboardingUser && !newSignupFlow && } - {!isLoading && (activeWorkspaces.length > 0 || inactiveWorkspaces.length > 0 || searchTerm ? ( <> From 4e5b0fe8329ce3004826262d5ab42783aaf8b774 Mon Sep 17 00:00:00 2001 From: Milan Pavlik Date: Fri, 17 Mar 2023 08:11:52 +0000 Subject: [PATCH 17/19] retest From b5668a6f280bee7f9f692cbfaf1fcffa9da7f328 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Thu, 23 Mar 2023 17:17:06 +0000 Subject: [PATCH 18/19] Remove unused code --- .../src/user-settings/Preferences.tsx | 26 ------------------- 1 file changed, 26 deletions(-) diff --git a/components/dashboard/src/user-settings/Preferences.tsx b/components/dashboard/src/user-settings/Preferences.tsx index f12f2e29bac805..72b57143368037 100644 --- a/components/dashboard/src/user-settings/Preferences.tsx +++ b/components/dashboard/src/user-settings/Preferences.tsx @@ -15,36 +15,10 @@ import { Link } from "react-router-dom"; import { Heading2, Subheading } from "../components/typography/headings"; import { useUserMaySetTimeout } from "../data/current-user/may-set-timeout-query"; import { Button } from "../components/Button"; -import { User } from "@gitpod/gitpod-protocol"; import SelectIDE from "./SelectIDE"; export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; -export const updateUserIDEInfo = async ( - user: User, - selectedIde: string, - useLatestVersion: boolean, - location: IDEChangedTrackLocation, -) => { - const additionalData = user?.additionalData ?? {}; - const settings = additionalData.ideSettings ?? {}; - settings.settingVersion = "2.0"; - settings.defaultIde = selectedIde; - settings.useLatestVersion = useLatestVersion; - additionalData.ideSettings = settings; - getGitpodService() - .server.trackEvent({ - event: "ide_configuration_changed", - properties: { - ...settings, - location, - }, - }) - .then() - .catch(console.error); - return getGitpodService().server.updateLoggedInUser({ additionalData }); -}; - export default function Preferences() { const { user, setUser } = useContext(UserContext); const maySetTimeout = useUserMaySetTimeout(); From 896ff389cf8f8e2708f08b6053a2851f582ba73e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Filip=20Tron=C3=AD=C4=8Dek?= Date: Thu, 23 Mar 2023 18:02:59 +0000 Subject: [PATCH 19/19] use `useUpdateCurrentUserMutation` --- .../dashboard/src/user-settings/SelectIDE.tsx | 52 +++++++------------ 1 file changed, 18 insertions(+), 34 deletions(-) diff --git a/components/dashboard/src/user-settings/SelectIDE.tsx b/components/dashboard/src/user-settings/SelectIDE.tsx index 1ae8e522b04281..6d6fdc541f28eb 100644 --- a/components/dashboard/src/user-settings/SelectIDE.tsx +++ b/components/dashboard/src/user-settings/SelectIDE.tsx @@ -5,12 +5,12 @@ */ import { useContext, useEffect, useState } from "react"; -import { getGitpodService } from "../service/service"; import { UserContext } from "../user-context"; import CheckBox from "../components/CheckBox"; import { User } from "@gitpod/gitpod-protocol"; import SelectIDEComponent from "../components/SelectIDEComponent"; import PillLabel from "../components/PillLabel"; +import { useUpdateCurrentUserMutation } from "../data/current-user/update-mutation"; export type IDEChangedTrackLocation = "workspace_list" | "workspace_start" | "preferences"; interface SelectIDEProps { @@ -18,33 +18,9 @@ interface SelectIDEProps { location: IDEChangedTrackLocation; } -export const updateUserIDEInfo = async ( - user: User, - selectedIde: string, - useLatestVersion: boolean, - location: IDEChangedTrackLocation, -) => { - const additionalData = user?.additionalData ?? {}; - const settings = additionalData.ideSettings ?? {}; - settings.settingVersion = "2.0"; - settings.defaultIde = selectedIde; - settings.useLatestVersion = useLatestVersion; - additionalData.ideSettings = settings; - getGitpodService() - .server.trackEvent({ - event: "ide_configuration_changed", - properties: { - ...settings, - location, - }, - }) - .then() - .catch(console.error); - return getGitpodService().server.updateLoggedInUser({ additionalData }); -}; - export default function SelectIDE(props: SelectIDEProps) { const { user, setUser } = useContext(UserContext); + const updateUser = useUpdateCurrentUserMutation(); // Only exec once when we access this component useEffect(() => { @@ -52,22 +28,30 @@ export default function SelectIDE(props: SelectIDEProps) { // eslint-disable-next-line react-hooks/exhaustive-deps }, []); - const actualUpdateUserIDEInfo = async (user: User, selectedIde: string, useLatestVersion: boolean) => { - const newUserData = await updateUserIDEInfo(user, selectedIde, useLatestVersion, props.location); + const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); + const [useLatestVersion, setUseLatestVersion] = useState( + user?.additionalData?.ideSettings?.useLatestVersion ?? false, + ); + + const actualUpdateUserIDEInfo = async (selectedIde: string, useLatestVersion: boolean) => { + const additionalData = user?.additionalData ?? {}; + const settings = additionalData.ideSettings ?? {}; + settings.settingVersion = "2.0"; + settings.defaultIde = selectedIde; + settings.useLatestVersion = useLatestVersion; + additionalData.ideSettings = settings; + + const newUserData = await updateUser.mutateAsync({ additionalData }); props.updateUserContext && setUser({ ...newUserData }); }; - const [defaultIde, setDefaultIde] = useState(user?.additionalData?.ideSettings?.defaultIde || "code"); const actuallySetDefaultIde = async (value: string) => { - await actualUpdateUserIDEInfo(user!, value, useLatestVersion); + await actualUpdateUserIDEInfo(value, useLatestVersion); setDefaultIde(value); }; - const [useLatestVersion, setUseLatestVersion] = useState( - user?.additionalData?.ideSettings?.useLatestVersion ?? false, - ); const actuallySetUseLatestVersion = async (value: boolean) => { - await actualUpdateUserIDEInfo(user!, defaultIde, value); + await actualUpdateUserIDEInfo(defaultIde, value); setUseLatestVersion(value); };