coder · BrunoQuaresma · Mar 27, 2023 · Mar 21, 2023 · Mar 23, 2023 · Mar 23, 2023
diff --git a/coderd/templateversions.go b/coderd/templateversions.go
@@ -123,6 +123,9 @@ func (api *API) patchTemplateVersion(rw http.ResponseWriter, r *http.Request) {
 	if errors.Is(err, errTemplateVersionNameConflict) {
 		httpapi.Write(ctx, rw, http.StatusBadRequest, codersdk.Response{
 			Message: err.Error(),
+			Validations: []codersdk.ValidationError{
+				{Field: "name", Detail: "Name is already used"},
+			},
 		})
 		return
 	}

diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -373,6 +373,17 @@ export const updateActiveTemplateVersion = async (
   return response.data
 }
 
+export const patchTemplateVersion = async (
+  templateVersionId: string,
+  data: TypesGen.PatchTemplateVersionRequest,
+) => {
+  const response = await axios.patch<TypesGen.TemplateVersion>(
+    `/api/v2/templateversions/${templateVersionId}`,
+    data,
+  )
+  return response.data
+}
+
 export const updateTemplateMeta = async (
   templateId: string,
   data: TypesGen.UpdateTemplateMeta,
@@ -1020,3 +1031,26 @@ const getMissingParameters = (
 
   return missingParameters
 }
+
+export const watchBuildLogs = (
+  versionId: string,
+  onMessage: (log: TypesGen.ProvisionerJobLog) => void,
+) => {
+  return new Promise<void>((resolve, reject) => {
+    const proto = location.protocol === "https:" ? "wss:" : "ws:"
+    const socket = new WebSocket(
+      `${proto}//${location.host}/api/v2/templateversions/${versionId}/logs?follow=true`,
+    )
+    socket.binaryType = "blob"
+    socket.addEventListener("message", (event) =>
+      onMessage(JSON.parse(event.data) as TypesGen.ProvisionerJobLog),
+    )
+    socket.addEventListener("error", () => {
+      reject(new Error("Connection for logs failed."))
+    })
+    socket.addEventListener("close", () => {
+      // When the socket closes, logs have finished streaming!
+      resolve()
+    })
+  })
+}
diff --git a/site/src/components/TemplateVersionEditor/PublishTemplateVersionDialog.tsx b/site/src/components/TemplateVersionEditor/PublishTemplateVersionDialog.tsx
@@ -0,0 +1,98 @@
+import { DialogProps } from "components/Dialogs/Dialog"
+import { FC } from "react"
+import { getFormHelpers } from "util/formUtils"
+import { FormFields } from "components/Form/Form"
+import { useFormik } from "formik"
+import * as Yup from "yup"
+import { PublishVersionData } from "pages/TemplateVersionPage/TemplateVersionEditorPage/types"
+import TextField from "@material-ui/core/TextField"
+import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"
+import Checkbox from "@material-ui/core/Checkbox"
+import FormControlLabel from "@material-ui/core/FormControlLabel"
+import { Stack } from "components/Stack/Stack"
+
+export type PublishTemplateVersionDialogProps = DialogProps & {
+  defaultName: string
+  isPublishing: boolean
+  publishingError?: unknown
+  onClose: () => void
+  onConfirm: (data: PublishVersionData) => void
+}
+
+export const PublishTemplateVersionDialog: FC<
+  PublishTemplateVersionDialogProps
+> = ({
+  onConfirm,
+  isPublishing,
+  onClose,
+  defaultName,
+  publishingError,
+  ...dialogProps
+}) => {
+  const form = useFormik({
+    initialValues: {
+      name: defaultName,
+      isActiveVersion: false,
+    },
+    validationSchema: Yup.object({
+      name: Yup.string().required(),
+      isActiveVersion: Yup.boolean(),
+    }),
+    onSubmit: onConfirm,
+  })
+  const getFieldHelpers = getFormHelpers(form, publishingError)
+  const handleClose = () => {
+    form.resetForm()
+    onClose()
+  }
+
+  return (
+    <ConfirmDialog
+      {...dialogProps}
+      confirmLoading={isPublishing}
+      onClose={handleClose}
+      onConfirm={async () => {
+        await form.submitForm()
+      }}
+      hideCancel={false}
+      type="success"
+      cancelText="Cancel"
+      confirmText="Publish"
+      title="Publish new version"
+      description={
+        <Stack>
+          <p>You are about to publish a new version of this template.</p>
+          <FormFields>
+            <TextField
+              {...getFieldHelpers("name")}
+              label="Version name"
+              autoFocus
+              disabled={isPublishing}
+              InputLabelProps={{
+                shrink: true,
+              }}
+            />
+
+            <FormControlLabel
+              label="Promote to default version"
+              control={
+                <Checkbox
+                  size="small"
+                  checked={form.values.isActiveVersion}
+                  onChange={async (e) => {
+                    await form.setFieldValue(
+                      "isActiveVersion",
+                      e.target.checked,
+                    )
+                  }}
+                  name="isActiveVersion"
+                  color="primary"
+                />
+              }
+            />
+          </FormFields>
+        </Stack>
+      }
+    />
+  )
+}