coder · BrunoQuaresma · Mar 16, 2023 · Mar 14, 2023 · Mar 15, 2023 · Mar 15, 2023
diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
@@ -7,7 +7,6 @@ import GroupsPage from "pages/GroupsPage/GroupsPage"
 import LoginPage from "pages/LoginPage/LoginPage"
 import { SetupPage } from "pages/SetupPage/SetupPage"
 import { TemplateSettingsPage } from "pages/TemplateSettingsPage/TemplateSettingsPage"
-import { WorkspaceBuildParametersPage } from "pages/WorkspaceBuildParametersPage/WorkspaceBuildParametersPage"
 import TemplatesPage from "pages/TemplatesPage/TemplatesPage"
 import UsersPage from "pages/UsersPage/UsersPage"
 import WorkspacesPage from "pages/WorkspacesPage/WorkspacesPage"
@@ -126,6 +125,9 @@ const CreateTemplatePage = lazy(
 const TemplateVariablesPage = lazy(
   () => import("./pages/TemplateVariablesPage/TemplateVariablesPage"),
 )
+const WorkspaceSettingsPage = lazy(
+  () => import("./pages/WorkspaceSettingsPage/WorkspaceSettingsPage"),
+)
 
 export const AppRouter: FC = () => {
   return (
@@ -230,10 +232,7 @@ export const AppRouter: FC = () => {
                     path="change-version"
                     element={<WorkspaceChangeVersionPage />}
                   />
-                  <Route
-                    path="build-parameters"
-                    element={<WorkspaceBuildParametersPage />}
-                  />
+                  <Route path="settings" element={<WorkspaceSettingsPage />} />
                 </Route>
               </Route>
             </Route>

diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -506,6 +506,13 @@ export const createWorkspace = async (
   return response.data
 }
 
+export const patchWorkspace = async (
+  workspaceId: string,
+  data: TypesGen.UpdateWorkspaceRequest,
+) => {
+  await axios.patch(`/api/v2/workspaces/${workspaceId}`, data)
+}
+
 export const getBuildInfo = async (): Promise<TypesGen.BuildInfoResponse> => {
   const response = await axios.get("/api/v2/buildinfo")
   return response.data

diff --git a/site/src/components/DropdownButton/ActionCtas.tsx b/site/src/components/DropdownButton/ActionCtas.tsx
@@ -54,9 +54,9 @@ export const ChangeVersionButton: FC<
   )
 }
 
-export const BuildParametersButton: FC<
-  React.PropsWithChildren<WorkspaceAction>
-> = ({ handleAction }) => {
+export const SettingsButton: FC<React.PropsWithChildren<WorkspaceAction>> = ({
+  handleAction,
+}) => {
   const styles = useStyles()
   const { t } = useTranslation("workspacePage")
 
@@ -67,7 +67,7 @@ export const BuildParametersButton: FC<
       startIcon={<SettingsOutlined />}
       onClick={handleAction}
     >
-      {t("actionButton.buildParameters")}
+      {t("actionButton.settings")}
     </Button>
   )
 }

diff --git a/site/src/components/Form/Form.tsx b/site/src/components/Form/Form.tsx
@@ -24,7 +24,7 @@ type FormProps = HTMLProps<HTMLFormElement> & {
 }
 
 export const Form: FC<FormProps> = ({ direction, className, ...formProps }) => {
-  const styles = useStyles()
+  const styles = useStyles({ direction })
 
   return (
     <FormContext.Provider value={{ direction }}>
@@ -136,6 +136,7 @@ const useStyles = makeStyles((theme) => ({
   },
 
   formSectionInfo: {
+    width: "100%",
     maxWidth: ({ direction }: FormContextValue = {}) =>
       direction === "horizontal" ? 312 : undefined,
     flexShrink: 0,

diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx
@@ -43,7 +43,7 @@ export interface WorkspaceProps {
   handleUpdate: () => void
   handleCancel: () => void
   handleChangeVersion: () => void
-  handleBuildParameters: () => void
+  handleSettings: () => void
   isUpdating: boolean
   workspace: TypesGen.Workspace
   resources?: TypesGen.WorkspaceResource[]
@@ -55,7 +55,6 @@ export interface WorkspaceProps {
   buildInfo?: TypesGen.BuildInfoResponse
   applicationsHost?: string
   template?: TypesGen.Template
-  templateParameters?: TypesGen.TemplateVersionParameter[]
   quota_budget?: number
 }
 
@@ -70,7 +69,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
   handleUpdate,
   handleCancel,
   handleChangeVersion,
-  handleBuildParameters,
+  handleSettings,
   workspace,
   isUpdating,
   resources,
@@ -82,7 +81,6 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
   buildInfo,
   applicationsHost,
   template,
-  templateParameters,
   quota_budget,
 }) => {
   const styles = useStyles()
@@ -126,17 +124,14 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
             />
             <WorkspaceActions
               workspaceStatus={workspace.latest_build.status}
-              hasTemplateParameters={
-                templateParameters ? templateParameters.length > 0 : false
-              }
               isOutdated={workspace.outdated}
               handleStart={handleStart}
               handleStop={handleStop}
               handleDelete={handleDelete}
               handleUpdate={handleUpdate}
               handleCancel={handleCancel}
               handleChangeVersion={handleChangeVersion}
-              handleBuildParameters={handleBuildParameters}
+              handleSettings={handleSettings}
               isUpdating={isUpdating}
             />
           </Stack>

diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.test.tsx
@@ -12,15 +12,14 @@ const renderComponent = async (props: Partial<WorkspaceActionsProps> = {}) => {
       workspaceStatus={
         props.workspaceStatus ?? Mocks.MockWorkspace.latest_build.status
       }
-      hasTemplateParameters={props.hasTemplateParameters ?? false}
       isOutdated={props.isOutdated ?? false}
       handleStart={jest.fn()}
       handleStop={jest.fn()}
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
       handleChangeVersion={jest.fn()}
-      handleBuildParameters={jest.fn()}
+      handleSettings={jest.fn()}
       isUpdating={false}
     />,
   )
@@ -32,15 +31,14 @@ const renderAndClick = async (props: Partial<WorkspaceActionsProps> = {}) => {
       workspaceStatus={
         props.workspaceStatus ?? Mocks.MockWorkspace.latest_build.status
       }
-      hasTemplateParameters={props.hasTemplateParameters ?? false}
       isOutdated={props.isOutdated ?? false}
       handleStart={jest.fn()}
       handleStop={jest.fn()}
       handleDelete={jest.fn()}
       handleUpdate={jest.fn()}
       handleCancel={jest.fn()}
       handleChangeVersion={jest.fn()}
-      handleBuildParameters={jest.fn()}
+      handleSettings={jest.fn()}
       isUpdating={false}
     />,
   )
@@ -91,20 +89,6 @@ describe("WorkspaceActions", () => {
       )
     })
   })
-  describe("when the workspace with rich parameters is started", () => {
-    it("primary is stop; secondary is build parameters", async () => {
-      await renderAndClick({
-        workspaceStatus: Mocks.MockWorkspace.latest_build.status,
-        hasTemplateParameters: true,
-      })
-      expect(screen.getByTestId("primary-cta")).toHaveTextContent(
-        t("actionButton.stop", { ns: "workspacePage" }),
-      )
-      expect(screen.getByTestId("secondary-ctas")).toHaveTextContent(
-        t("actionButton.buildParameters", { ns: "workspacePage" }),
-      )
-    })
-  })
   describe("when the workspace is stopping", () => {
     it("primary is stopping; cancel is available; no secondary", async () => {
       await renderComponent({

diff --git a/site/src/components/WorkspaceActions/WorkspaceActions.tsx b/site/src/components/WorkspaceActions/WorkspaceActions.tsx
@@ -7,7 +7,7 @@ import {
   ChangeVersionButton,
   DeleteButton,
   DisabledButton,
-  BuildParametersButton,
+  SettingsButton,
   StartButton,
   StopButton,
   UpdateButton,
@@ -16,37 +16,32 @@ import { ButtonMapping, ButtonTypesEnum, buttonAbilities } from "./constants"
 
 export interface WorkspaceActionsProps {
   workspaceStatus: WorkspaceStatus
-  hasTemplateParameters: boolean
   isOutdated: boolean
   handleStart: () => void
   handleStop: () => void
   handleDelete: () => void
   handleUpdate: () => void
   handleCancel: () => void
   handleChangeVersion: () => void
-  handleBuildParameters: () => void
+  handleSettings: () => void
   isUpdating: boolean
   children?: ReactNode
 }
 
 export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
   workspaceStatus,
-  hasTemplateParameters,
   isOutdated,
   handleStart,
   handleStop,
   handleDelete,
   handleUpdate,
   handleCancel,
   handleChangeVersion,
-  handleBuildParameters,
+  handleSettings,
   isUpdating,
 }) => {
   const { t } = useTranslation("workspacePage")
-  const { canCancel, canAcceptJobs, actions } = buttonAbilities(
-    workspaceStatus,
-    hasTemplateParameters,
-  )
+  const { canCancel, canAcceptJobs, actions } = buttonAbilities(workspaceStatus)
   const canBeUpdated = isOutdated && canAcceptJobs
 
   // A mapping of button type to the corresponding React component
@@ -58,8 +53,8 @@ export const WorkspaceActions: FC<WorkspaceActionsProps> = ({
     [ButtonTypesEnum.changeVersion]: (
       <ChangeVersionButton handleAction={handleChangeVersion} />
     ),
-    [ButtonTypesEnum.buildParameters]: (
-      <BuildParametersButton handleAction={handleBuildParameters} />
+    [ButtonTypesEnum.settings]: (
+      <SettingsButton handleAction={handleSettings} />
     ),
     [ButtonTypesEnum.start]: <StartButton handleAction={handleStart} />,
     [ButtonTypesEnum.starting]: (

diff --git a/site/src/components/WorkspaceActions/constants.ts b/site/src/components/WorkspaceActions/constants.ts
@@ -12,7 +12,7 @@ export enum ButtonTypesEnum {
   update = "update",
   updating = "updating",
   changeVersion = "changeVersion",
-  buildParameters = "buildParameters",
+  settings = "settings",
   // disabled buttons
   canceling = "canceling",
   deleted = "deleted",
@@ -31,19 +31,8 @@ interface WorkspaceAbilities {
 
 export const buttonAbilities = (
   status: WorkspaceStatus,
-  hasTemplateParameters: boolean,
 ): WorkspaceAbilities => {
-  if (hasTemplateParameters) {
-    return statusToAbilities[status]
-  }
-
-  const all = statusToAbilities[status]
-  return {
-    ...all,
-    actions: all.actions.filter(
-      (action) => action !== ButtonTypesEnum.buildParameters,
-    ),
-  }
+  return statusToAbilities[status]
 }
 
 const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
@@ -55,7 +44,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
   running: {
     actions: [
       ButtonTypesEnum.stop,
-      ButtonTypesEnum.buildParameters,
+      ButtonTypesEnum.settings,
       ButtonTypesEnum.changeVersion,
       ButtonTypesEnum.delete,
     ],
@@ -70,7 +59,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
   stopped: {
     actions: [
       ButtonTypesEnum.start,
-      ButtonTypesEnum.buildParameters,
+      ButtonTypesEnum.settings,
       ButtonTypesEnum.changeVersion,
       ButtonTypesEnum.delete,
     ],
@@ -81,7 +70,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
     actions: [
       ButtonTypesEnum.start,
       ButtonTypesEnum.stop,
-      ButtonTypesEnum.buildParameters,
+      ButtonTypesEnum.settings,
       ButtonTypesEnum.changeVersion,
       ButtonTypesEnum.delete,
     ],
@@ -92,7 +81,7 @@ const statusToAbilities: Record<WorkspaceStatus, WorkspaceAbilities> = {
   failed: {
     actions: [
       ButtonTypesEnum.start,
-      ButtonTypesEnum.buildParameters,
+      ButtonTypesEnum.settings,
       ButtonTypesEnum.changeVersion,
       ButtonTypesEnum.delete,
     ],

diff --git a/site/src/i18n/en/index.ts b/site/src/i18n/en/index.ts
@@ -12,7 +12,6 @@ import templateSettingsPage from "./templateSettingsPage.json"
 import templateVariablesPage from "./templateVariablesPage.json"
 import templateVersionPage from "./templateVersionPage.json"
 import loginPage from "./loginPage.json"
-import workspaceBuildParametersPage from "./workspaceBuildParametersPage.json"
 import workspaceChangeVersionPage from "./workspaceChangeVersionPage.json"
 import workspaceSchedulePage from "./workspaceSchedulePage.json"
 import appearanceSettings from "./appearanceSettings.json"
@@ -21,6 +20,7 @@ import starterTemplatePage from "./starterTemplatePage.json"
 import createTemplatePage from "./createTemplatePage.json"
 import userSettingsPage from "./userSettingsPage.json"
 import tokensPage from "./tokensPage.json"
+import workspaceSettingsPage from "./workspaceSettingsPage.json"
 
 export const en = {
   common,
@@ -37,7 +37,6 @@ export const en = {
   templateVariablesPage,
   templateVersionPage,
   loginPage,
-  workspaceBuildParametersPage,
   workspaceChangeVersionPage,
   workspaceSchedulePage,
   appearanceSettings,
@@ -46,4 +45,5 @@ export const en = {
   createTemplatePage,
   userSettingsPage,
   tokensPage,
+  workspaceSettingsPage,
 }
diff --git a/site/src/i18n/en/workspaceBuildParametersPage.json b/site/src/i18n/en/workspaceBuildParametersPage.json
diff --git a/site/src/i18n/en/workspacePage.json b/site/src/i18n/en/workspacePage.json
@@ -29,7 +29,7 @@
     "stopping": "Stopping...",
     "deleting": "Deleting...",
     "changeVersion": "Change version",
-    "buildParameters": "Build parameters"
+    "settings": "Settings"
   },
   "disabledButton": {
     "canceling": "Canceling",

diff --git a/site/src/i18n/en/workspaceSettingsPage.json b/site/src/i18n/en/workspaceSettingsPage.json
@@ -0,0 +1,9 @@
+{
+  "title": "Workspace Settings",
+  "defaultErrorMessage": "Error on update workspace settings",
+  "nameLabel": "Name",
+  "generalInfo": "General info",
+  "generalInfoDescription": "The name of your new workspace.",
+  "parameters": "Parameters",
+  "parametersDescription": "Those values are provided by your template's Terraform configuration. Values can be changed after creating the workspace."
+}
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -24,6 +24,7 @@ import { makeStyles } from "@material-ui/core/styles"
 import {
   selectInitialRichParametersValues,
   useValidationSchemaForRichParameters,
+  workspaceBuildParameterValue,
 } from "util/richParameters"
 
 export enum CreateWorkspaceErrors {
@@ -401,13 +402,3 @@ const useStyles = makeStyles((theme) => ({
     marginRight: -theme.spacing(10),
   },
 }))
-
-export const workspaceBuildParameterValue = (
-  workspaceBuildParameters: TypesGen.WorkspaceBuildParameter[],
-  parameter: TypesGen.TemplateVersionParameter,
-): string => {
-  const buildParameter = workspaceBuildParameters.find((buildParameter) => {
-    return buildParameter.name === parameter.name
-  })
-  return (buildParameter && buildParameter.value) || ""
-}