Skip to content

Commit 9fb6f93

Browse files
Furistoroboquat
Furisto
authored and
roboquat
committed
[dashboard] Use feature flag
1 parent cd60a4a commit 9fb6f93

File tree

2 files changed

+99
-62
lines changed

2 files changed

+99
-62
lines changed

‎components/dashboard/src/settings/Preferences.tsx

Lines changed: 9 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@ import getSettingsMenu from "./settings-menu";
1414
import { trackEvent } from "../Analytics";
1515
import { PaymentContext } from "../payment-context";
1616
import SelectIDE from "./SelectIDE";
17-
import { WorkspaceClasses } from "@gitpod/gitpod-protocol";
17+
import { getExperimentsClient } from "../experiments/client";
18+
import SelectWorkspaceClass from "./selectClass";
1819

1920
type Theme = "light" | "dark" | "system";
2021
// type WorkspaceClass = "standard" | "XL";
@@ -52,25 +53,12 @@ export default function Preferences() {
5253
}
5354
};
5455

55-
const [workspaceClass, setWorkspaceClass] = useState<string>(
56-
user?.additionalData?.workspaceClasses?.regular || "standard",
57-
);
58-
const actuallySetWorkspaceClass = async (value: string) => {
59-
const additionalData = user?.additionalData || {};
60-
const prevWorkspaceClass = additionalData?.workspaceClasses?.regular || "standard";
61-
const workspaceClasses = (additionalData?.workspaceClasses || {}) as WorkspaceClasses;
62-
workspaceClasses.regular = value;
63-
workspaceClasses.prebuild = value;
64-
additionalData.workspaceClasses = workspaceClasses;
65-
if (value !== prevWorkspaceClass) {
66-
await getGitpodService().server.updateLoggedInUser({ additionalData });
67-
trackEvent("workspace_class_changed", {
68-
previous: prevWorkspaceClass,
69-
current: value,
70-
});
71-
setWorkspaceClass(value);
72-
}
73-
};
56+
const [isShowWorkspaceClasses, setIsShowWorkspaceClasses] = useState<boolean>(false);
57+
(async () => {
58+
const showWorkspaceClasses = await getExperimentsClient().getValueAsync("workspace_classes", false, {});
59+
console.log("is enabled", showWorkspaceClasses);
60+
setIsShowWorkspaceClasses(showWorkspaceClasses);
61+
})();
7462

7563
return (
7664
<div>
@@ -161,48 +149,7 @@ export default function Preferences() {
161149
</p>
162150
</div>
163151
</div>
164-
165-
<h3 className="mt-12">Workspaces</h3>
166-
<p className="text-base text-gray-500 dark:text-gray-400">
167-
Choose the workspace machine type for your workspaces.
168-
</p>
169-
<div className="mt-4 space-x-3 flex">
170-
<SelectableCardSolid
171-
className="w-36 h-32"
172-
title="Standard"
173-
selected={workspaceClass === "standard"}
174-
onClick={() => actuallySetWorkspaceClass("standard")}
175-
>
176-
<div className="flex-grow flex items-end p-1">
177-
<svg width="112" height="64" fill="none" xmlns="http://www.w3.org/2000/svg">
178-
<path
179-
d="M0 8a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM0 32a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM0 56a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM40 6a6 6 0 0 1 6-6h60a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H46a6 6 0 0 1-6-6V6Z"
180-
fill="#D6D3D1"
181-
/>
182-
</svg>
183-
</div>
184-
</SelectableCardSolid>
185-
<SelectableCardSolid
186-
className="w-36 h-32"
187-
title="XL"
188-
selected={workspaceClass === "XL"}
189-
onClick={() => actuallySetWorkspaceClass("XL")}
190-
>
191-
<div className="flex-grow flex items-end p-1">
192-
<svg width="112" height="64" fill="none" xmlns="http://www.w3.org/2000/svg">
193-
<path
194-
d="M0 8a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM40 6a6 6 0 0 1 6-6h60a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H46a6 6 0 0 1-6-6V6Z"
195-
fill="#D9D9D9"
196-
/>
197-
<path
198-
d="M84 0h22a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H68L84 0ZM0 32a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8Z"
199-
fill="#78716C"
200-
/>
201-
<path d="M0 56a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8Z" fill="#D9D9D9" />
202-
</svg>
203-
</div>
204-
</SelectableCardSolid>
205-
</div>
152+
<SelectWorkspaceClass enabled={isShowWorkspaceClasses} />
206153
</PageWithSubMenu>
207154
</div>
208155
);

‎components/dashboard/src/settings/selectClass.tsx

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
/**
2+
* Copyright (c) 2022 Gitpod GmbH. All rights reserved.
3+
* Licensed under the GNU Affero General Public License (AGPL).
4+
* See License-AGPL.txt in the project root for license information.
5+
*/
6+
7+
import { useContext, useState } from "react";
8+
import SelectableCardSolid from "../components/SelectableCardSolid";
9+
import { getGitpodService } from "../service/service";
10+
import { UserContext } from "../user-context";
11+
import { trackEvent } from "../Analytics";
12+
import { WorkspaceClasses } from "@gitpod/gitpod-protocol";
13+
14+
interface SelectWorkspaceClassProps {
15+
enabled: boolean;
16+
}
17+
18+
export default function SelectWorkspaceClass(props: SelectWorkspaceClassProps) {
19+
const { user } = useContext(UserContext);
20+
21+
const [workspaceClass, setWorkspaceClass] = useState<string>(
22+
user?.additionalData?.workspaceClasses?.regular || "standard",
23+
);
24+
const actuallySetWorkspaceClass = async (value: string) => {
25+
const additionalData = user?.additionalData || {};
26+
const prevWorkspaceClass = additionalData?.workspaceClasses?.regular || "standard";
27+
const workspaceClasses = (additionalData?.workspaceClasses || {}) as WorkspaceClasses;
28+
workspaceClasses.regular = value;
29+
workspaceClasses.prebuild = value;
30+
additionalData.workspaceClasses = workspaceClasses;
31+
if (value !== prevWorkspaceClass) {
32+
await getGitpodService().server.updateLoggedInUser({ additionalData });
33+
trackEvent("workspace_class_changed", {
34+
previous: prevWorkspaceClass,
35+
current: value,
36+
});
37+
setWorkspaceClass(value);
38+
}
39+
};
40+
41+
if (!props.enabled) {
42+
return <div></div>;
43+
} else {
44+
return (
45+
<div>
46+
<h3 className="mt-12">Workspaces</h3>
47+
<p className="text-base text-gray-500 dark:text-gray-400">
48+
Choose the workspace machine type for your workspaces.
49+
</p>
50+
<div className="mt-4 space-x-3 flex">
51+
<SelectableCardSolid
52+
className="w-36 h-32"
53+
title="Standard"
54+
selected={workspaceClass === "standard"}
55+
onClick={() => actuallySetWorkspaceClass("standard")}
56+
>
57+
<div className="flex-grow flex items-end p-1">
58+
<svg width="112" height="64" fill="none" xmlns="http://www.w3.org/2000/svg">
59+
<path
60+
d="M0 8a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM0 32a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM0 56a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM40 6a6 6 0 0 1 6-6h60a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H46a6 6 0 0 1-6-6V6Z"
61+
fill="#D6D3D1"
62+
/>
63+
</svg>
64+
</div>
65+
</SelectableCardSolid>
66+
<SelectableCardSolid
67+
className="w-36 h-32"
68+
title="XL"
69+
selected={workspaceClass === "XL"}
70+
onClick={() => actuallySetWorkspaceClass("XL")}
71+
>
72+
<div className="flex-grow flex items-end p-1">
73+
<svg width="112" height="64" fill="none" xmlns="http://www.w3.org/2000/svg">
74+
<path
75+
d="M0 8a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8ZM40 6a6 6 0 0 1 6-6h60a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H46a6 6 0 0 1-6-6V6Z"
76+
fill="#D9D9D9"
77+
/>
78+
<path
79+
d="M84 0h22a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H68L84 0ZM0 32a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8Z"
80+
fill="#78716C"
81+
/>
82+
<path d="M0 56a8 8 0 0 1 8-8h16a8 8 0 1 1 0 16H8a8 8 0 0 1-8-8Z" fill="#D9D9D9" />
83+
</svg>
84+
</div>
85+
</SelectableCardSolid>
86+
</div>
87+
</div>
88+
);
89+
}
90+
}

0 commit comments

Comments
 (0)