Skip to content

Commit 107ae55

Browse files
feat(site): Add workspace settings page (#6612)
1 parent 854bcce commit 107ae55

27 files changed

+458
-1068
lines changed

site/src/AppRouter.tsx

+4-5
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import GroupsPage from "pages/GroupsPage/GroupsPage"
77
import LoginPage from "pages/LoginPage/LoginPage"
88
import { SetupPage } from "pages/SetupPage/SetupPage"
99
import { TemplateSettingsPage } from "pages/TemplateSettingsPage/TemplateSettingsPage"
10-
import { WorkspaceBuildParametersPage } from "pages/WorkspaceBuildParametersPage/WorkspaceBuildParametersPage"
1110
import TemplatesPage from "pages/TemplatesPage/TemplatesPage"
1211
import UsersPage from "pages/UsersPage/UsersPage"
1312
import WorkspacesPage from "pages/WorkspacesPage/WorkspacesPage"
@@ -126,6 +125,9 @@ const CreateTemplatePage = lazy(
126125
const TemplateVariablesPage = lazy(
127126
() => import("./pages/TemplateVariablesPage/TemplateVariablesPage"),
128127
)
128+
const WorkspaceSettingsPage = lazy(
129+
() => import("./pages/WorkspaceSettingsPage/WorkspaceSettingsPage"),
130+
)
129131

130132
export const AppRouter: FC = () => {
131133
return (
@@ -230,10 +232,7 @@ export const AppRouter: FC = () => {
230232
path="change-version"
231233
element={<WorkspaceChangeVersionPage />}
232234
/>
233-
<Route
234-
path="build-parameters"
235-
element={<WorkspaceBuildParametersPage />}
236-
/>
235+
<Route path="settings" element={<WorkspaceSettingsPage />} />
237236
</Route>
238237
</Route>
239238
</Route>

site/src/api/api.ts

+7
Original file line numberDiff line numberDiff line change
@@ -506,6 +506,13 @@ export const createWorkspace = async (
506506
return response.data
507507
}
508508

509+
export const patchWorkspace = async (
510+
workspaceId: string,
511+
data: TypesGen.UpdateWorkspaceRequest,
512+
) => {
513+
await axios.patch(`/api/v2/workspaces/${workspaceId}`, data)
514+
}
515+
509516
export const getBuildInfo = async (): Promise<TypesGen.BuildInfoResponse> => {
510517
const response = await axios.get("/api/v2/buildinfo")
511518
return response.data

site/src/components/DropdownButton/ActionCtas.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -54,9 +54,9 @@ export const ChangeVersionButton: FC<
5454
)
5555
}
5656

57-
export const BuildParametersButton: FC<
58-
React.PropsWithChildren<WorkspaceAction>
59-
> = ({ handleAction }) => {
57+
export const SettingsButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
58+
handleAction,
59+
}) => {
6060
const styles = useStyles()
6161
const { t } = useTranslation("workspacePage")
6262

@@ -67,7 +67,7 @@ export const BuildParametersButton: FC<
6767
startIcon={<SettingsOutlined />}
6868
onClick={handleAction}
6969
>
70-
{t("actionButton.buildParameters")}
70+
{t("actionButton.settings")}
7171
</Button>
7272
)
7373
}

site/src/components/Form/Form.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ type FormProps = HTMLProps<HTMLFormElement> & {
2424
}
2525

2626
export const Form: FC<FormProps> = ({ direction, className, ...formProps }) => {
27-
const styles = useStyles()
27+
const styles = useStyles({ direction })
2828

2929
return (
3030
<FormContext.Provider value={{ direction }}>
@@ -136,6 +136,7 @@ const useStyles = makeStyles((theme) => ({
136136
},
137137

138138
formSectionInfo: {
139+
width: "100%",
139140
maxWidth: ({ direction }: FormContextValue = {}) =>
140141
direction === "horizontal" ? 312 : undefined,
141142
flexShrink: 0,

site/src/components/Workspace/Workspace.tsx

+3-8
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export interface WorkspaceProps {
4343
handleUpdate: () => void
4444
handleCancel: () => void
4545
handleChangeVersion: () => void
46-
handleBuildParameters: () => void
46+
handleSettings: () => void
4747
isUpdating: boolean
4848
workspace: TypesGen.Workspace
4949
resources?: TypesGen.WorkspaceResource[]
@@ -55,7 +55,6 @@ export interface WorkspaceProps {
5555
buildInfo?: TypesGen.BuildInfoResponse
5656
applicationsHost?: string
5757
template?: TypesGen.Template
58-
templateParameters?: TypesGen.TemplateVersionParameter[]
5958
quota_budget?: number
6059
}
6160

@@ -70,7 +69,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
7069
handleUpdate,
7170
handleCancel,
7271
handleChangeVersion,
73-
handleBuildParameters,
72+
handleSettings,
7473
workspace,
7574
isUpdating,
7675
resources,
@@ -82,7 +81,6 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
8281
buildInfo,
8382
applicationsHost,
8483
template,
85-
templateParameters,
8684
quota_budget,
8785
}) => {
8886
const styles = useStyles()
@@ -126,17 +124,14 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
126124
/>
127125
<WorkspaceActions
128126
workspaceStatus={workspace.latest_build.status}
129-
hasTemplateParameters={
130-
templateParameters ? templateParameters.length > 0 : false
131-
}
132127
isOutdated={workspace.outdated}
133128
handleStart={handleStart}
134129
handleStop={handleStop}
135130
handleDelete={handleDelete}
136131
handleUpdate={handleUpdate}
137132
handleCancel={handleCancel}
138133
handleChangeVersion={handleChangeVersion}
139-
handleBuildParameters={handleBuildParameters}
134+
handleSettings={handleSettings}
140135
isUpdating={isUpdating}
141136
/>
142137
</Stack>

site/src/components/WorkspaceActions/WorkspaceActions.test.tsx

+2-18
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,14 @@ const renderComponent = async (props: Partial<WorkspaceActionsProps> = {}) => {
1212
workspaceStatus={
1313
props.workspaceStatus ?? Mocks.MockWorkspace.latest_build.status
1414
}
15-
hasTemplateParameters={props.hasTemplateParameters ?? false}
1615
isOutdated={props.isOutdated ?? false}
1716
handleStart={jest.fn()}
1817
handleStop={jest.fn()}
1918
handleDelete={jest.fn()}
2019
handleUpdate={jest.fn()}
2120
handleCancel={jest.fn()}
2221
handleChangeVersion={jest.fn()}
23-
handleBuildParameters={jest.fn()}
22+
handleSettings={jest.fn()}
2423
isUpdating={false}
2524
/>,
2625
)
@@ -32,15 +31,14 @@ const renderAndClick = async (props: Partial<WorkspaceActionsProps> = {}) => {
3231
workspaceStatus={
3332
props.workspaceStatus ?? Mocks.MockWorkspace.latest_build.status
3433
}
35-
hasTemplateParameters={props.hasTemplateParameters ?? false}
3634
isOutdated={props.isOutdated ?? false}
3735
handleStart={jest.fn()}
3836
handleStop={jest.fn()}
3937
handleDelete={jest.fn()}
4038
handleUpdate={jest.fn()}
4139
handleCancel={jest.fn()}
4240
handleChangeVersion={jest.fn()}
43-
handleBuildParameters={jest.fn()}
41+
handleSettings={jest.fn()}
4442
isUpdating={false}
4543
/>,
4644
)
@@ -91,20 +89,6 @@ describe("WorkspaceActions", () => {
9189
)
9290
})
9391
})
94-
describe("when the workspace with rich parameters is started", () => {
95-
it("primary is stop; secondary is build parameters", async () => {
96-
await renderAndClick({
97-
workspaceStatus: Mocks.MockWorkspace.latest_build.status,
98-
hasTemplateParameters: true,
99-
})
100-
expect(screen.getByTestId("primary-cta")).toHaveTextContent(
101-
t("actionButton.stop", { ns: "workspacePage" }),
102-
)
103-
expect(screen.getByTestId("secondary-ctas")).toHaveTextContent(
104-
t("actionButton.buildParameters", { ns: "workspacePage" }),
105-
)
106-
})
107-
})
10892
describe("when the workspace is stopping", () => {
10993
it("primary is stopping; cancel is available; no secondary", async () => {
11094
await renderComponent({

site/src/components/WorkspaceActions/WorkspaceActions.tsx

+6-11
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
ChangeVersionButton,
88
DeleteButton,
99
DisabledButton,
10-
BuildParametersButton,
10+
SettingsButton,
1111
StartButton,
1212
StopButton,
1313
UpdateButton,
@@ -16,37 +16,32 @@ import { ButtonMapping, ButtonTypesEnum, buttonAbilities } from "./constants"
1616

1717
export interface WorkspaceActionsProps {
1818
workspaceStatus: WorkspaceStatus
19-
hasTemplateParameters: boolean
2019
isOutdated: boolean
2120
handleStart: () => void
2221
handleStop: () => void
2322
handleDelete: () => void
2423
handleUpdate: () => void
2524
handleCancel: () => void
2625
handleChangeVersion: () => void
27-
handleBuildParameters: () => void
26+
handleSettings: () => void
2827
isUpdating: boolean
2928
children?: ReactNode
3029
}
3130

3231
export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
3332
workspaceStatus,
34-
hasTemplateParameters,
3533
isOutdated,
3634
handleStart,
3735
handleStop,
3836
handleDelete,
3937
handleUpdate,
4038
handleCancel,
4139
handleChangeVersion,
42-
handleBuildParameters,
40+
handleSettings,
4341
isUpdating,
4442
}) => {
4543
const { t } = useTranslation("workspacePage")
46-
const { canCancel, canAcceptJobs, actions } = buttonAbilities(
47-
workspaceStatus,
48-
hasTemplateParameters,
49-
)
44+
const { canCancel, canAcceptJobs, actions } = buttonAbilities(workspaceStatus)
5045
const canBeUpdated = isOutdated && canAcceptJobs
5146

5247
// A mapping of button type to the corresponding React component
@@ -58,8 +53,8 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
5853
[ButtonTypesEnum.changeVersion]: (
5954
<ChangeVersionButton handleAction={handleChangeVersion} />
6055
),
61-
[ButtonTypesEnum.buildParameters]: (
62-
<BuildParametersButton handleAction={handleBuildParameters} />
56+
[ButtonTypesEnum.settings]: (
57+
<SettingsButton handleAction={handleSettings} />
6358
),
6459
[ButtonTypesEnum.start]: <StartButton handleAction={handleStart} />,
6560
[ButtonTypesEnum.starting]: (

site/src/components/WorkspaceActions/constants.ts

+6-17
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export enum ButtonTypesEnum {
1212
update = "update",
1313
updating = "updating",
1414
changeVersion = "changeVersion",
15-
buildParameters = "buildParameters",
15+
settings = "settings",
1616
// disabled buttons
1717
canceling = "canceling",
1818
deleted = "deleted",
@@ -31,19 +31,8 @@ interface WorkspaceAbilities {
3131

3232
export const buttonAbilities = (
3333
status: WorkspaceStatus,
34-
hasTemplateParameters: boolean,
3534
): WorkspaceAbilities => {
36-
if (hasTemplateParameters) {
37-
return statusToAbilities[status]
38-
}
39-
40-
const all = statusToAbilities[status]
41-
return {
42-
...all,
43-
actions: all.actions.filter(
44-
(action) => action !== ButtonTypesEnum.buildParameters,
45-
),
46-
}
35+
return statusToAbilities[status]
4736
}
4837

4938
const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
@@ -55,7 +44,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
5544
running: {
5645
actions: [
5746
ButtonTypesEnum.stop,
58-
ButtonTypesEnum.buildParameters,
47+
ButtonTypesEnum.settings,
5948
ButtonTypesEnum.changeVersion,
6049
ButtonTypesEnum.delete,
6150
],
@@ -70,7 +59,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
7059
stopped: {
7160
actions: [
7261
ButtonTypesEnum.start,
73-
ButtonTypesEnum.buildParameters,
62+
ButtonTypesEnum.settings,
7463
ButtonTypesEnum.changeVersion,
7564
ButtonTypesEnum.delete,
7665
],
@@ -81,7 +70,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
8170
actions: [
8271
ButtonTypesEnum.start,
8372
ButtonTypesEnum.stop,
84-
ButtonTypesEnum.buildParameters,
73+
ButtonTypesEnum.settings,
8574
ButtonTypesEnum.changeVersion,
8675
ButtonTypesEnum.delete,
8776
],
@@ -92,7 +81,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
9281
failed: {
9382
actions: [
9483
ButtonTypesEnum.start,
95-
ButtonTypesEnum.buildParameters,
84+
ButtonTypesEnum.settings,
9685
ButtonTypesEnum.changeVersion,
9786
ButtonTypesEnum.delete,
9887
],

site/src/i18n/en/index.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ import templateSettingsPage from "./templateSettingsPage.json"
1212
import templateVariablesPage from "./templateVariablesPage.json"
1313
import templateVersionPage from "./templateVersionPage.json"
1414
import loginPage from "./loginPage.json"
15-
import workspaceBuildParametersPage from "./workspaceBuildParametersPage.json"
1615
import workspaceChangeVersionPage from "./workspaceChangeVersionPage.json"
1716
import workspaceSchedulePage from "./workspaceSchedulePage.json"
1817
import appearanceSettings from "./appearanceSettings.json"
@@ -21,6 +20,7 @@ import starterTemplatePage from "./starterTemplatePage.json"
2120
import createTemplatePage from "./createTemplatePage.json"
2221
import userSettingsPage from "./userSettingsPage.json"
2322
import tokensPage from "./tokensPage.json"
23+
import workspaceSettingsPage from "./workspaceSettingsPage.json"
2424

2525
export const en = {
2626
common,
@@ -37,7 +37,6 @@ export const en = {
3737
templateVariablesPage,
3838
templateVersionPage,
3939
loginPage,
40-
workspaceBuildParametersPage,
4140
workspaceChangeVersionPage,
4241
workspaceSchedulePage,
4342
appearanceSettings,
@@ -46,4 +45,5 @@ export const en = {
4645
createTemplatePage,
4746
userSettingsPage,
4847
tokensPage,
48+
workspaceSettingsPage,
4949
}

site/src/i18n/en/workspaceBuildParametersPage.json

-10
This file was deleted.

site/src/i18n/en/workspacePage.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
"stopping": "Stopping...",
3030
"deleting": "Deleting...",
3131
"changeVersion": "Change version",
32-
"buildParameters": "Build parameters"
32+
"settings": "Settings"
3333
},
3434
"disabledButton": {
3535
"canceling": "Canceling",
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"title": "Workspace Settings",
3+
"defaultErrorMessage": "Error on update workspace settings",
4+
"nameLabel": "Name",
5+
"generalInfo": "General info",
6+
"generalInfoDescription": "The name of your new workspace.",
7+
"parameters": "Parameters",
8+
"parametersDescription": "Those values are provided by your template's Terraform configuration. Values can be changed after creating the workspace."
9+
}

site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx

+1-10
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import { makeStyles } from "@material-ui/core/styles"
2424
import {
2525
selectInitialRichParametersValues,
2626
useValidationSchemaForRichParameters,
27+
workspaceBuildParameterValue,
2728
} from "util/richParameters"
2829

2930
export enum CreateWorkspaceErrors {
@@ -401,13 +402,3 @@ const useStyles = makeStyles((theme) => ({
401402
marginRight: -theme.spacing(10),
402403
},
403404
}))
404-
405-
export const workspaceBuildParameterValue = (
406-
workspaceBuildParameters: TypesGen.WorkspaceBuildParameter[],
407-
parameter: TypesGen.TemplateVersionParameter,
408-
): string => {
409-
const buildParameter = workspaceBuildParameters.find((buildParameter) => {
410-
return buildParameter.name === parameter.name
411-
})
412-
return (buildParameter && buildParameter.value) || ""
413-
}

0 commit comments

Comments
 (0)