fix(site): fix workspace parameters update when having immutable parameters (#9500)

BrunoQuaresma · web-flow · commit b9f604c58dcf · 2023-09-03T21:56:25.000-03:00
diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx
@@ -36,7 +36,7 @@ export const LoadingBuildLogs: Story = {
 
 const failedBuild = {
   ...MockFailedWorkspaceBuild("delete"),
-  build_number: new Date().getDate(),
+  build_number: 123123123123,
 }
 
 export const FailedDelete: Story = {
diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx
@@ -13,25 +13,27 @@ import {
   MockWorkspaceBuildParameter1,
   MockWorkspaceBuildParameter2,
   MockWorkspaceBuild,
+  MockTemplateVersionParameter4,
+  MockWorkspaceBuildParameter4,
 } from "testHelpers/entities"
 
 test("Submit the workspace settings page successfully", async () => {
   // Mock the API calls that loads data
   jest
     .spyOn(api, "getWorkspaceByOwnerAndName")
     .mockResolvedValueOnce(MockWorkspace)
-  jest
-    .spyOn(api, "getTemplateVersionRichParameters")
-    .mockResolvedValueOnce([
-      MockTemplateVersionParameter1,
-      MockTemplateVersionParameter2,
-    ])
-  jest
-    .spyOn(api, "getWorkspaceBuildParameters")
-    .mockResolvedValueOnce([
-      MockWorkspaceBuildParameter1,
-      MockWorkspaceBuildParameter2,
-    ])
+  jest.spyOn(api, "getTemplateVersionRichParameters").mockResolvedValueOnce([
+    MockTemplateVersionParameter1,
+    MockTemplateVersionParameter2,
+    // Immutable parameters
+    MockTemplateVersionParameter4,
+  ])
+  jest.spyOn(api, "getWorkspaceBuildParameters").mockResolvedValueOnce([
+    MockWorkspaceBuildParameter1,
+    MockWorkspaceBuildParameter2,
+    // Immutable value
+    MockWorkspaceBuildParameter4,
+  ])
   // Mock the API calls that submit data
   const postWorkspaceBuildSpy = jest
     .spyOn(api, "postWorkspaceBuild")
diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx
@@ -14,19 +14,20 @@ import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"
 import { FC } from "react"
 import { isApiValidationError } from "api/errors"
 import { ErrorAlert } from "components/Alert/ErrorAlert"
+import { WorkspaceBuildParameter } from "api/typesGenerated"
 
 const WorkspaceParametersPage = () => {
   const { workspace } = useWorkspaceSettingsContext()
-  const query = useQuery({
+  const parameters = useQuery({
     queryKey: ["workspace", workspace.id, "parameters"],
     queryFn: () => getWorkspaceParameters(workspace),
   })
   const navigate = useNavigate()
-  const mutation = useMutation({
-    mutationFn: (formValues: WorkspaceParametersFormValues) =>
+  const updateParameters = useMutation({
+    mutationFn: (buildParameters: WorkspaceBuildParameter[]) =>
       postWorkspaceBuild(workspace.id, {
         transition: "start",
-        rich_parameter_values: formValues.rich_parameter_values,
+        rich_parameter_values: buildParameters,
       }),
     onSuccess: () => {
       navigate(`/${workspace.owner_name}/${workspace.name}`)
@@ -40,10 +41,20 @@ const WorkspaceParametersPage = () => {
       </Helmet>
 
       <WorkspaceParametersPageView
-        data={query.data}
-        submitError={mutation.error}
-        isSubmitting={mutation.isLoading}
-        onSubmit={mutation.mutate}
+        data={parameters.data}
+        submitError={updateParameters.error}
+        isSubmitting={updateParameters.isLoading}
+        onSubmit={(values) => {
+          // When updating the parameters, the API does not accept immutable
+          // values so we need to filter them
+          const onlyMultableValues = parameters
+            .data!.templateVersionRichParameters.filter((p) => p.mutable)
+            .map(
+              (p) =>
+                values.rich_parameter_values.find((v) => v.name === p.name)!,
+            )
+          updateParameters.mutate(onlyMultableValues)
+        }}
         onCancel={() => {
           navigate("../..")
         }}
diff --git a/site/src/testHelpers/entities.ts b/site/src/testHelpers/entities.ts
@@ -2078,6 +2078,11 @@ export const MockWorkspaceBuildParameter3: TypesGen.WorkspaceBuildParameter = {
   value: "my-database",
 }
 
+export const MockWorkspaceBuildParameter4: TypesGen.WorkspaceBuildParameter = {
+  name: MockTemplateVersionParameter4.name,
+  value: "immutable-value",
+}
+
 export const MockWorkspaceBuildParameter5: TypesGen.WorkspaceBuildParameter = {
   name: MockTemplateVersionParameter5.name,
   value: "5",

Original file line number	Diff line number	Diff line change
`@@ -36,7 +36,7 @@ export const LoadingBuildLogs: Story = {`
`36`	`36`
`37`	`37`	`const failedBuild = {`
`38`	`38`	`...MockFailedWorkspaceBuild("delete"),`
`39`		`- build_number: new Date().getDate(),`
	`39`	`+ build_number: 123123123123,`
`40`	`40`	`}`
`41`	`41`
`42`	`42`	`export const FailedDelete: Story = {`