From 68ff6f8ef32262d23052f8b0864d9ec8e67366e4 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Tue, 28 Mar 2023 13:27:49 +0000
Subject: [PATCH 1/8] Add base structure for copy template

---
 .../TemplateLayout/TemplatePageHeader.tsx     |  8 +++
 .../CreateTemplatePage/CreateTemplateForm.tsx | 49 +++++++++----
 .../CreateTemplatePage/CreateTemplatePage.tsx |  2 +
 .../createTemplate/createTemplateXService.ts  | 71 +++++++++++++++++++
 4 files changed, 117 insertions(+), 13 deletions(-)

diff --git a/site/src/components/TemplateLayout/TemplatePageHeader.tsx b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
index 11fc83223a980..ce58134533a08 100644
--- a/site/src/components/TemplateLayout/TemplatePageHeader.tsx
+++ b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
@@ -28,6 +28,7 @@ const Language = {
   createButton: "Create workspace",
   deleteButton: "Delete",
   editFilesButton: "Edit files",
+  duplicateButton: "Duplicate",
 }
 
 const TemplateMenu: FC<{
@@ -67,6 +68,13 @@ const TemplateMenu: FC<{
         >
           {Language.settingsButton}
         </MenuItem>
+        <MenuItem
+          onClick={handleClose}
+          component={RouterLink}
+          to={`/templates/new?copyTemplate=${templateName}`}
+        >
+          {Language.duplicateButton}
+        </MenuItem>
         {canEditFiles && (
           <MenuItem
             component={RouterLink}
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
index b1a0384240aa3..35940f6d21a5c 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
@@ -4,6 +4,7 @@ import TextField from "@material-ui/core/TextField"
 import {
   ParameterSchema,
   ProvisionerJobLog,
+  Template,
   TemplateExample,
   TemplateVersionVariable,
 } from "api/typesGenerated"
@@ -108,7 +109,10 @@ const defaultInitialValues: CreateTemplateData = {
 
 const getInitialValues = (
   canSetMaxTTL: boolean,
-  starterTemplate?: TemplateExample,
+  {
+    fromExample,
+    fromCopy,
+  }: { fromExample?: TemplateExample; fromCopy?: Template },
 ) => {
   let initialValues = defaultInitialValues
   if (!canSetMaxTTL) {
@@ -117,17 +121,27 @@ const getInitialValues = (
       max_ttl_hours: 0,
     }
   }
-  if (!starterTemplate) {
-    return initialValues
+
+  if (fromExample) {
+    return {
+      ...initialValues,
+      name: fromExample.id,
+      display_name: fromExample.name,
+      icon: fromExample.icon,
+      description: fromExample.description,
+    }
   }
 
-  return {
-    ...initialValues,
-    name: starterTemplate.id,
-    display_name: starterTemplate.name,
-    icon: starterTemplate.icon,
-    description: starterTemplate.description,
+  if (fromCopy) {
+    return {
+      ...initialValues,
+      ...fromCopy,
+      name: `${fromCopy.name}-copy`,
+      display_name: `${fromCopy.display_name} Copy`,
+    }
   }
+
+  return initialValues
 }
 
 export interface CreateTemplateFormProps {
@@ -142,12 +156,14 @@ export interface CreateTemplateFormProps {
   jobError?: string
   logs?: ProvisionerJobLog[]
   canSetMaxTTL: boolean
+  copiedTemplate?: Template
 }
 
 export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
   onCancel,
   onSubmit,
   starterTemplate,
+  copiedTemplate,
   parameters,
   variables,
   isSubmitting,
@@ -157,9 +173,13 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
   logs,
   canSetMaxTTL,
 }) => {
+  console.log(copiedTemplate)
   const styles = useStyles()
   const form = useFormik<CreateTemplateData>({
-    initialValues: getInitialValues(canSetMaxTTL, starterTemplate),
+    initialValues: getInitialValues(canSetMaxTTL, {
+      fromExample: starterTemplate,
+      fromCopy: copiedTemplate,
+    }),
     validationSchema,
     onSubmit,
   })
@@ -177,6 +197,8 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
         <FormFields>
           {starterTemplate ? (
             <SelectedTemplate template={starterTemplate} />
+          ) : copiedTemplate ? (
+            <SelectedTemplate template={copiedTemplate} />
           ) : (
             <TemplateUpload
               {...upload}
@@ -329,7 +351,7 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
       </FormSection>
 
       {/* Parameters */}
-      {parameters && (
+      {parameters && parameters.length > 0 && (
         <FormSection
           title={t("form.parameters.title")}
           description={t("form.parameters.description")}
@@ -353,7 +375,7 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
       )}
 
       {/* Variables */}
-      {variables && (
+      {variables && variables.length > 0 && (
         <FormSection
           title="Variables"
           description="Input variables allow you to customize templates without altering their source code."
@@ -361,13 +383,14 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
           <FormFields>
             {variables.map((variable, index) => (
               <VariableInput
+                defaultValue={variable.value}
                 variable={variable}
                 disabled={isSubmitting}
                 key={variable.name}
                 onChange={async (value) => {
                   await form.setFieldValue("user_variable_values." + index, {
                     name: variable.name,
-                    value: value,
+                    value,
                   })
                 }}
               />
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
index 4692bbd346b02..64d214ff62882 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
@@ -24,6 +24,7 @@ const CreateTemplatePage: FC = () => {
     context: {
       organizationId,
       exampleId: searchParams.get("exampleId"),
+      templateNameToCopy: searchParams.get("copyTemplate"),
     },
     actions: {
       onCreate: (_, { data }) => {
@@ -67,6 +68,7 @@ const CreateTemplatePage: FC = () => {
 
           {shouldDisplayForm && (
             <CreateTemplateForm
+              copiedTemplate={state.context.copiedTemplate}
               canSetMaxTTL={canSetMaxTTL}
               error={error}
               starterTemplate={starterTemplate}
diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts
index 96a41575ba261..d4c6677e5a2fe 100644
--- a/site/src/xServices/createTemplate/createTemplateXService.ts
+++ b/site/src/xServices/createTemplate/createTemplateXService.ts
@@ -7,6 +7,7 @@ import {
   uploadTemplateFile,
   getTemplateVersionLogs,
   getTemplateVersionVariables,
+  getTemplateByName,
 } from "api/api"
 import {
   CreateTemplateVersionRequest,
@@ -61,6 +62,9 @@ interface CreateTemplateContext {
   // uploadedFile is the response from the server to use in the API
   file?: File
   uploadResponse?: UploadResponse
+  // When wanting to copy a Template
+  templateNameToCopy: string | null // It can be null because it is passed from query string
+  copiedTemplate?: Template
 }
 
 export const createTemplateMachine =
@@ -106,6 +110,14 @@ export const createTemplateMachine =
           loadVersionLogs: {
             data: ProvisionerJobLog[]
           }
+          copyTemplateData: {
+            data: {
+              template: Template
+              version: TemplateVersion
+              parameters: ParameterSchema[]
+              variables: TemplateVersionVariable[]
+            }
+          }
         },
       },
       tsTypes: {} as import("./createTemplateXService.typegen").Typegen0,
@@ -114,6 +126,10 @@ export const createTemplateMachine =
         starting: {
           always: [
             { target: "loadingStarterTemplate", cond: "isExampleProvided" },
+            {
+              target: "copyingTemplateData",
+              cond: "isTemplateIdToCopyProvided",
+            },
             { target: "idle" },
           ],
           tags: ["loading"],
@@ -132,6 +148,27 @@ export const createTemplateMachine =
           },
           tags: ["loading"],
         },
+        copyingTemplateData: {
+          invoke: {
+            src: "copyTemplateData",
+            onDone: [
+              {
+                target: "creating.promptParametersAndVariables",
+                actions: ["assignCopiedTemplateData"],
+                cond: "hasParametersOrVariables",
+              },
+              {
+                target: "idle",
+                actions: ["assignCopiedTemplateData"],
+              },
+            ],
+            onError: {
+              target: "idle",
+              actions: ["assignError"],
+            },
+          },
+          tags: ["loading"],
+        },
         idle: {
           on: {
             CREATE: {
@@ -292,6 +329,29 @@ export const createTemplateMachine =
           }
           return starterTemplate
         },
+        copyTemplateData: async ({ organizationId, templateNameToCopy }) => {
+          if (!organizationId) {
+            throw new Error("No organization ID provided")
+          }
+          if (!templateNameToCopy) {
+            throw new Error("No template name to copy provided")
+          }
+          const template = await getTemplateByName(
+            organizationId,
+            templateNameToCopy,
+          )
+          const [version, parameters, variables] = await Promise.all([
+            getTemplateVersion(template.active_version_id),
+            getTemplateVersionSchema(template.active_version_id),
+            getTemplateVersionVariables(template.active_version_id),
+          ])
+          return {
+            template,
+            version,
+            parameters,
+            variables,
+          }
+        },
         createFirstVersion: async ({
           organizationId,
           exampleId,
@@ -456,9 +516,17 @@ export const createTemplateMachine =
           uploadResponse: (_) => undefined,
         }),
         assignJobLogs: assign({ jobLogs: (_, { data }) => data }),
+        assignCopiedTemplateData: assign({
+          copiedTemplate: (_, { data }) => data.template,
+          version: (_, { data }) => data.version,
+          parameters: (_, { data }) => data.parameters,
+          variables: (_, { data }) => data.variables,
+        }),
       },
       guards: {
         isExampleProvided: ({ exampleId }) => Boolean(exampleId),
+        isTemplateIdToCopyProvided: ({ templateNameToCopy }) =>
+          Boolean(templateNameToCopy),
         isNotUsingExample: ({ exampleId }) => !exampleId,
         hasFile: ({ file }) => Boolean(file),
         hasFailed: (_, { data }) =>
@@ -469,6 +537,9 @@ export const createTemplateMachine =
           ),
         hasNoParametersOrVariables: (_, { data }) =>
           data.parameters === undefined && data.variables === undefined,
+        hasParametersOrVariables: (_, { data }) => {
+          return data.parameters.length > 0 || data.variables.length > 0
+        },
       },
     },
   )

From def3a368e5bf4c39c45f9c90a2e19dd3b73e219f Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Tue, 28 Mar 2023 16:10:17 +0000
Subject: [PATCH 2/8] Prefill variables

---
 .../CreateTemplatePage/CreateTemplateForm.tsx | 48 ++++++++++++++-----
 .../createTemplate/createTemplateXService.ts  | 14 +++---
 2 files changed, 42 insertions(+), 20 deletions(-)

diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
index 35940f6d21a5c..ac33ad4e6b206 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
@@ -107,14 +107,22 @@ const defaultInitialValues: CreateTemplateData = {
   allow_user_cancel_workspace_jobs: false,
 }
 
-const getInitialValues = (
-  canSetMaxTTL: boolean,
-  {
-    fromExample,
-    fromCopy,
-  }: { fromExample?: TemplateExample; fromCopy?: Template },
-) => {
+type GetInitialValuesParams = {
+  fromExample?: TemplateExample
+  fromCopy?: Template
+  parameters?: ParameterSchema[]
+  variables?: TemplateVersionVariable[]
+  canSetMaxTTL: boolean
+}
+
+const getInitialValues = ({
+  fromExample,
+  fromCopy,
+  canSetMaxTTL,
+  variables,
+}: GetInitialValuesParams) => {
   let initialValues = defaultInitialValues
+
   if (!canSetMaxTTL) {
     initialValues = {
       ...initialValues,
@@ -123,7 +131,7 @@ const getInitialValues = (
   }
 
   if (fromExample) {
-    return {
+    initialValues = {
       ...initialValues,
       name: fromExample.id,
       display_name: fromExample.name,
@@ -133,7 +141,7 @@ const getInitialValues = (
   }
 
   if (fromCopy) {
-    return {
+    initialValues = {
       ...initialValues,
       ...fromCopy,
       name: `${fromCopy.name}-copy`,
@@ -141,6 +149,21 @@ const getInitialValues = (
     }
   }
 
+  if (variables) {
+    variables.forEach((variable) => {
+      if (variable.sensitive) {
+        return
+      }
+      if (!initialValues.user_variable_values) {
+        initialValues.user_variable_values = []
+      }
+      initialValues.user_variable_values.push({
+        name: variable.name,
+        value: variable.value,
+      })
+    })
+  }
+
   return initialValues
 }
 
@@ -173,12 +196,13 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
   logs,
   canSetMaxTTL,
 }) => {
-  console.log(copiedTemplate)
   const styles = useStyles()
   const form = useFormik<CreateTemplateData>({
-    initialValues: getInitialValues(canSetMaxTTL, {
+    initialValues: getInitialValues({
+      canSetMaxTTL,
       fromExample: starterTemplate,
       fromCopy: copiedTemplate,
+      variables,
     }),
     validationSchema,
     onSubmit,
@@ -383,7 +407,7 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
           <FormFields>
             {variables.map((variable, index) => (
               <VariableInput
-                defaultValue={variable.value}
+                defaultValue={form.values.user_variable_values?.[index].value}
                 variable={variable}
                 disabled={isSubmitting}
                 key={variable.name}
diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts
index d4c6677e5a2fe..1e7b3ab97ee2c 100644
--- a/site/src/xServices/createTemplate/createTemplateXService.ts
+++ b/site/src/xServices/createTemplate/createTemplateXService.ts
@@ -114,7 +114,7 @@ export const createTemplateMachine =
             data: {
               template: Template
               version: TemplateVersion
-              parameters: ParameterSchema[]
+
               variables: TemplateVersionVariable[]
             }
           }
@@ -155,7 +155,7 @@ export const createTemplateMachine =
               {
                 target: "creating.promptParametersAndVariables",
                 actions: ["assignCopiedTemplateData"],
-                cond: "hasParametersOrVariables",
+                cond: "hasVariables",
               },
               {
                 target: "idle",
@@ -340,15 +340,14 @@ export const createTemplateMachine =
             organizationId,
             templateNameToCopy,
           )
-          const [version, parameters, variables] = await Promise.all([
+          const [version, variables] = await Promise.all([
             getTemplateVersion(template.active_version_id),
-            getTemplateVersionSchema(template.active_version_id),
+
             getTemplateVersionVariables(template.active_version_id),
           ])
           return {
             template,
             version,
-            parameters,
             variables,
           }
         },
@@ -519,7 +518,6 @@ export const createTemplateMachine =
         assignCopiedTemplateData: assign({
           copiedTemplate: (_, { data }) => data.template,
           version: (_, { data }) => data.version,
-          parameters: (_, { data }) => data.parameters,
           variables: (_, { data }) => data.variables,
         }),
       },
@@ -537,8 +535,8 @@ export const createTemplateMachine =
           ),
         hasNoParametersOrVariables: (_, { data }) =>
           data.parameters === undefined && data.variables === undefined,
-        hasParametersOrVariables: (_, { data }) => {
-          return data.parameters.length > 0 || data.variables.length > 0
+        hasVariables: (_, { data }) => {
+          return data.variables.length > 0
         },
       },
     },

From 03d832c451db8f8fad9ec53fa62d10003b66fe97 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Tue, 28 Mar 2023 16:43:35 +0000
Subject: [PATCH 3/8] Copy from template

---
 site/src/api/api.ts                           |  2 +-
 .../CreateTemplatePage/CreateTemplateForm.tsx | 19 ++++++---
 .../createTemplate/createTemplateXService.ts  | 40 +++++++++++++++----
 3 files changed, 47 insertions(+), 14 deletions(-)

diff --git a/site/src/api/api.ts b/site/src/api/api.ts
index a1763ab75fcb6..209c4f322ccd7 100644
--- a/site/src/api/api.ts
+++ b/site/src/api/api.ts
@@ -335,7 +335,7 @@ export const getTemplateVersionGitAuth = async (
 
 export const getTemplateVersionParameters = async (
   versionId: string,
-): Promise<TypesGen.Parameter[]> => {
+): Promise<TypesGen.ComputedParameter[]> => {
   const response = await axios.get(
     `/api/v2/templateversions/${versionId}/parameters`,
   )
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
index ac33ad4e6b206..ee8c1f1ae272a 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
@@ -120,6 +120,7 @@ const getInitialValues = ({
   fromCopy,
   canSetMaxTTL,
   variables,
+  parameters,
 }: GetInitialValuesParams) => {
   let initialValues = defaultInitialValues
 
@@ -151,19 +152,26 @@ const getInitialValues = ({
 
   if (variables) {
     variables.forEach((variable) => {
-      if (variable.sensitive) {
-        return
-      }
       if (!initialValues.user_variable_values) {
         initialValues.user_variable_values = []
       }
       initialValues.user_variable_values.push({
         name: variable.name,
-        value: variable.value,
+        value: variable.sensitive ? "" : variable.value,
       })
     })
   }
 
+  if (parameters) {
+    parameters.forEach((parameter) => {
+      if (!initialValues.parameter_values_by_name) {
+        initialValues.parameter_values_by_name = {}
+      }
+      initialValues.parameter_values_by_name[parameter.name] =
+        parameter.default_source_value
+    })
+  }
+
   return initialValues
 }
 
@@ -203,6 +211,7 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
       fromExample: starterTemplate,
       fromCopy: copiedTemplate,
       variables,
+      parameters,
     }),
     validationSchema,
     onSubmit,
@@ -407,7 +416,7 @@ export const CreateTemplateForm: FC<CreateTemplateFormProps> = ({
           <FormFields>
             {variables.map((variable, index) => (
               <VariableInput
-                defaultValue={form.values.user_variable_values?.[index].value}
+                defaultValue={variable.value}
                 variable={variable}
                 disabled={isSubmitting}
                 key={variable.name}
diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts
index 1e7b3ab97ee2c..5ba2c1c9d52f1 100644
--- a/site/src/xServices/createTemplate/createTemplateXService.ts
+++ b/site/src/xServices/createTemplate/createTemplateXService.ts
@@ -8,6 +8,7 @@ import {
   getTemplateVersionLogs,
   getTemplateVersionVariables,
   getTemplateByName,
+  getTemplateVersionParameters,
 } from "api/api"
 import {
   CreateTemplateVersionRequest,
@@ -114,7 +115,7 @@ export const createTemplateMachine =
             data: {
               template: Template
               version: TemplateVersion
-
+              parameters: ParameterSchema[]
               variables: TemplateVersionVariable[]
             }
           }
@@ -155,7 +156,7 @@ export const createTemplateMachine =
               {
                 target: "creating.promptParametersAndVariables",
                 actions: ["assignCopiedTemplateData"],
-                cond: "hasVariables",
+                cond: "hasParametersOrVariables",
               },
               {
                 target: "idle",
@@ -340,14 +341,36 @@ export const createTemplateMachine =
             organizationId,
             templateNameToCopy,
           )
-          const [version, variables] = await Promise.all([
-            getTemplateVersion(template.active_version_id),
+          const [version, schemaParameters, computedParameters, variables] =
+            await Promise.all([
+              getTemplateVersion(template.active_version_id),
+              getTemplateVersionSchema(template.active_version_id),
+              getTemplateVersionParameters(template.active_version_id),
+              getTemplateVersionVariables(template.active_version_id),
+            ])
+
+          // Recreate parameters with default_source_value from the already
+          // computed version parameters
+          const parameters: ParameterSchema[] = []
+          computedParameters.forEach((computedParameter) => {
+            const schema = schemaParameters.find(
+              (schema) => schema.name === computedParameter.name,
+            )
+            if (!schema) {
+              throw new Error(
+                `Parameter ${computedParameter.name} not found in schema`,
+              )
+            }
+            parameters.push({
+              ...schema,
+              default_source_value: computedParameter.source_value,
+            })
+          })
 
-            getTemplateVersionVariables(template.active_version_id),
-          ])
           return {
             template,
             version,
+            parameters,
             variables,
           }
         },
@@ -518,6 +541,7 @@ export const createTemplateMachine =
         assignCopiedTemplateData: assign({
           copiedTemplate: (_, { data }) => data.template,
           version: (_, { data }) => data.version,
+          parameters: (_, { data }) => data.parameters,
           variables: (_, { data }) => data.variables,
         }),
       },
@@ -535,8 +559,8 @@ export const createTemplateMachine =
           ),
         hasNoParametersOrVariables: (_, { data }) =>
           data.parameters === undefined && data.variables === undefined,
-        hasVariables: (_, { data }) => {
-          return data.variables.length > 0
+        hasParametersOrVariables: (_, { data }) => {
+          return data.parameters.length > 0 || data.variables.length > 0
         },
       },
     },

From 7cd4101ecea2ae32c3f454df7df14be5e7b1d8c9 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Wed, 29 Mar 2023 18:09:26 +0000
Subject: [PATCH 4/8] Fix copy from file template

---
 .../TemplateLayout/TemplatePageHeader.tsx        | 16 +++++++++-------
 .../CreateTemplatePage/CreateTemplateForm.tsx    |  4 +++-
 .../createTemplate/createTemplateXService.ts     | 15 +++++++++++++++
 3 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/site/src/components/TemplateLayout/TemplatePageHeader.tsx b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
index ce58134533a08..f6e2fadd04c10 100644
--- a/site/src/components/TemplateLayout/TemplatePageHeader.tsx
+++ b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
@@ -68,13 +68,15 @@ const TemplateMenu: FC<{
         >
           {Language.settingsButton}
         </MenuItem>
-        <MenuItem
-          onClick={handleClose}
-          component={RouterLink}
-          to={`/templates/new?copyTemplate=${templateName}`}
-        >
-          {Language.duplicateButton}
-        </MenuItem>
+        {canEditFiles && (
+          <MenuItem
+            onClick={handleClose}
+            component={RouterLink}
+            to={`/templates/new?copyTemplate=${templateName}`}
+          >
+            {Language.duplicateButton}
+          </MenuItem>
+        )}
         {canEditFiles && (
           <MenuItem
             component={RouterLink}
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
index ee8c1f1ae272a..bf743afa29b6c 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
@@ -146,7 +146,9 @@ const getInitialValues = ({
       ...initialValues,
       ...fromCopy,
       name: `${fromCopy.name}-copy`,
-      display_name: `${fromCopy.display_name} Copy`,
+      display_name: fromCopy.display_name
+        ? `${fromCopy.display_name} Copy`
+        : "",
     }
   }
 
diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts
index 5ba2c1c9d52f1..437139a1d789e 100644
--- a/site/src/xServices/createTemplate/createTemplateXService.ts
+++ b/site/src/xServices/createTemplate/createTemplateXService.ts
@@ -376,8 +376,10 @@ export const createTemplateMachine =
         },
         createFirstVersion: async ({
           organizationId,
+          templateNameToCopy,
           exampleId,
           uploadResponse,
+          version,
         }) => {
           if (exampleId) {
             return createTemplateVersion(organizationId, {
@@ -388,6 +390,19 @@ export const createTemplateMachine =
             })
           }
 
+          if (templateNameToCopy) {
+            if (!version) {
+              throw new Error("Not able to copy without having a version")
+            }
+
+            return createTemplateVersion(organizationId, {
+              storage_method: "file",
+              file_id: version.job.file_id,
+              provisioner: "terraform",
+              tags: {},
+            })
+          }
+
           if (uploadResponse) {
             return createTemplateVersion(organizationId, {
               storage_method: "file",

From 7f2b66bbebfe25314e9938db9b87b81e61269be1 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Wed, 29 Mar 2023 20:12:19 +0000
Subject: [PATCH 5/8] Setup missing handlers for test

---
 .../CreateTemplatePage.test.tsx               |  9 ++++--
 site/src/testHelpers/handlers.ts              | 30 ++++++++++++++++++-
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
index c338bc18ced1e..9b2a912ffed8e 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
@@ -14,10 +14,10 @@ import {
   MockProvisionerJob,
 } from "testHelpers/entities"
 
-const renderPage = async () => {
+const renderPage = async (searchParams: URLSearchParams) => {
   // Render with the example ID so we don't need to upload a file
   const view = renderWithAuth(<CreateTemplatePage />, {
-    route: `/templates/new?exampleId=${MockTemplateExample.id}`,
+    route: `/templates/new?${searchParams.toString()}`,
     path: "/templates/new",
     // We need this because after creation, the user will be redirected to here
     extraRoutes: [{ path: "templates/:template", element: <></> }],
@@ -56,7 +56,10 @@ test("Create template with variables", async () => {
     ])
 
   // Render page, fill the name and submit
-  const { router, container } = await renderPage()
+  const searchParams = new URLSearchParams({
+    exampleId: MockTemplateExample.id,
+  })
+  const { router, container } = await renderPage(searchParams)
   const form = container.querySelector("form") as HTMLFormElement
   await userEvent.type(screen.getByLabelText(/Name/), "my-template")
   await userEvent.click(
diff --git a/site/src/testHelpers/handlers.ts b/site/src/testHelpers/handlers.ts
index 9a0bc8f309cfb..ade5c1e06cce3 100644
--- a/site/src/testHelpers/handlers.ts
+++ b/site/src/testHelpers/handlers.ts
@@ -321,7 +321,7 @@ export const handlers = [
     },
   ),
 
-  rest.get("api/v2/files/:fileId", (_, res, ctx) => {
+  rest.get("/api/v2/files/:fileId", (_, res, ctx) => {
     const fileBuffer = fs.readFileSync(
       path.resolve(__dirname, "./templateFiles.tar"),
     )
@@ -333,4 +333,32 @@ export const handlers = [
       ctx.body(fileBuffer),
     )
   }),
+
+  rest.get(
+    "/api/v2/templateversions/:templateVersionId/parameters",
+    (_, res, ctx) => {
+      return res(
+        ctx.status(200),
+        ctx.json([
+          M.MockTemplateVersionParameter1,
+          M.MockTemplateVersionParameter2,
+          M.MockTemplateVersionParameter3,
+        ]),
+      )
+    },
+  ),
+
+  rest.get(
+    "/api/v2/templateversions/:templateVersionId/variables",
+    (_, res, ctx) => {
+      return res(
+        ctx.status(200),
+        ctx.json([
+          M.MockTemplateVersionVariable1,
+          M.MockTemplateVersionVariable2,
+          M.MockTemplateVersionVariable3,
+        ]),
+      )
+    },
+  ),
 ]

From bf8c1bc61a8b5186374a3c8fbe790461bf456aad Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Thu, 30 Mar 2023 11:35:50 +0000
Subject: [PATCH 6/8] Improve verbiage

---
 site/src/components/TemplateLayout/TemplatePageHeader.tsx   | 2 +-
 site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx    | 2 +-
 site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx    | 2 +-
 site/src/xServices/createTemplate/createTemplateXService.ts | 6 ++++--
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/site/src/components/TemplateLayout/TemplatePageHeader.tsx b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
index f6e2fadd04c10..636d3dcb9db77 100644
--- a/site/src/components/TemplateLayout/TemplatePageHeader.tsx
+++ b/site/src/components/TemplateLayout/TemplatePageHeader.tsx
@@ -72,7 +72,7 @@ const TemplateMenu: FC<{
           <MenuItem
             onClick={handleClose}
             component={RouterLink}
-            to={`/templates/new?copyTemplate=${templateName}`}
+            to={`/templates/new?fromTemplate=${templateName}`}
           >
             {Language.duplicateButton}
           </MenuItem>
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
index bf743afa29b6c..53453761053c9 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx
@@ -147,7 +147,7 @@ const getInitialValues = ({
       ...fromCopy,
       name: `${fromCopy.name}-copy`,
       display_name: fromCopy.display_name
-        ? `${fromCopy.display_name} Copy`
+        ? `Copy of ${fromCopy.display_name}`
         : "",
     }
   }
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
index 64d214ff62882..6a420122dd452 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
@@ -24,7 +24,7 @@ const CreateTemplatePage: FC = () => {
     context: {
       organizationId,
       exampleId: searchParams.get("exampleId"),
-      templateNameToCopy: searchParams.get("copyTemplate"),
+      templateNameToCopy: searchParams.get("fromTemplate"),
     },
     actions: {
       onCreate: (_, { data }) => {
diff --git a/site/src/xServices/createTemplate/createTemplateXService.ts b/site/src/xServices/createTemplate/createTemplateXService.ts
index 437139a1d789e..9548e483c8334 100644
--- a/site/src/xServices/createTemplate/createTemplateXService.ts
+++ b/site/src/xServices/createTemplate/createTemplateXService.ts
@@ -63,7 +63,7 @@ interface CreateTemplateContext {
   // uploadedFile is the response from the server to use in the API
   file?: File
   uploadResponse?: UploadResponse
-  // When wanting to copy a Template
+  // When wanting to duplicate a Template
   templateNameToCopy: string | null // It can be null because it is passed from query string
   copiedTemplate?: Template
 }
@@ -392,7 +392,9 @@ export const createTemplateMachine =
 
           if (templateNameToCopy) {
             if (!version) {
-              throw new Error("Not able to copy without having a version")
+              throw new Error(
+                "Can't copy template due to a missing template version",
+              )
             }
 
             return createTemplateVersion(organizationId, {

From bbc10f06009c8294c8db7f89ade5e148507d0a51 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Thu, 30 Mar 2023 11:58:09 +0000
Subject: [PATCH 7/8] Fix tests

---
 .../CreateTemplatePage.test.tsx               | 29 ++++++++++++++
 .../CreateTemplatePage/CreateTemplatePage.tsx |  1 +
 site/src/testHelpers/entities.ts              | 38 ++++++++++---------
 site/src/testHelpers/handlers.ts              | 20 +++++++++-
 4 files changed, 69 insertions(+), 19 deletions(-)

diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
index 9b2a912ffed8e..5d0c7d9abe52c 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx
@@ -106,3 +106,32 @@ test("Create template with variables", async () => {
     ],
   })
 })
+
+test("Create template from another template", async () => {
+  const searchParams = new URLSearchParams({
+    fromTemplate: MockTemplate.name,
+  })
+  const { router } = await renderPage(searchParams)
+  // Name and display name are using copy prefixes
+  expect(screen.getByLabelText(/Name/)).toHaveValue(`${MockTemplate.name}-copy`)
+  expect(screen.getByLabelText(/Display name/)).toHaveValue(
+    `Copy of ${MockTemplate.display_name}`,
+  )
+  // Variables are using the same values
+  expect(
+    screen.getByLabelText(MockTemplateVersionVariable1.description, {
+      exact: false,
+    }),
+  ).toHaveValue(MockTemplateVersionVariable1.value)
+  // Create template
+  jest
+    .spyOn(API, "createTemplateVersion")
+    .mockResolvedValue(MockTemplateVersion)
+  jest.spyOn(API, "createTemplate").mockResolvedValue(MockTemplate)
+  await userEvent.click(
+    screen.getByRole("button", { name: /create template/i }),
+  )
+  expect(router.state.location.pathname).toEqual(
+    `/templates/${MockTemplate.name}`,
+  )
+})
diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
index 6a420122dd452..e6443f48f3bf2 100644
--- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
+++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx
@@ -32,6 +32,7 @@ const CreateTemplatePage: FC = () => {
       },
     },
   })
+
   const {
     starterTemplate,
     parameters,
diff --git a/site/src/testHelpers/entities.ts b/site/src/testHelpers/entities.ts
index 0d866762e48d9..39a1335ef1a4a 100644
--- a/site/src/testHelpers/entities.ts
+++ b/site/src/testHelpers/entities.ts
@@ -1492,27 +1492,31 @@ export const MockWorkspaceBuildParameter5: TypesGen.WorkspaceBuildParameter = {
   value: "5",
 }
 
+export const MockParameterSchema: TypesGen.ParameterSchema = {
+  id: "000000",
+  job_id: "000000",
+  allow_override_destination: false,
+  allow_override_source: true,
+  created_at: "",
+  default_destination_scheme: "none",
+  default_refresh: "",
+  default_source_scheme: "data",
+  default_source_value: "default-value",
+  name: "parameter name",
+  description: "Some description!",
+  redisplay_value: false,
+  validation_condition: "",
+  validation_contains: [],
+  validation_error: "",
+  validation_type_system: "",
+  validation_value_type: "",
+}
+
 export const mockParameterSchema = (
   partial: Partial<TypesGen.ParameterSchema>,
 ): TypesGen.ParameterSchema => {
   return {
-    id: "000000",
-    job_id: "000000",
-    allow_override_destination: false,
-    allow_override_source: true,
-    created_at: "",
-    default_destination_scheme: "none",
-    default_refresh: "",
-    default_source_scheme: "data",
-    default_source_value: "default-value",
-    name: "parameter name",
-    description: "Some description!",
-    redisplay_value: false,
-    validation_condition: "",
-    validation_contains: [],
-    validation_error: "",
-    validation_type_system: "",
-    validation_value_type: "",
+    ...MockParameterSchema,
     ...partial,
   }
 }
diff --git a/site/src/testHelpers/handlers.ts b/site/src/testHelpers/handlers.ts
index ade5c1e06cce3..787c291ff78ca 100644
--- a/site/src/testHelpers/handlers.ts
+++ b/site/src/testHelpers/handlers.ts
@@ -3,7 +3,7 @@ import { WorkspaceBuildTransition } from "../api/types"
 import { CreateWorkspaceBuildRequest } from "../api/typesGenerated"
 import { permissionsToCheck } from "../xServices/auth/authXService"
 import * as M from "./entities"
-import { MockGroup, MockWorkspaceQuota } from "./entities"
+import { MockGroup, mockParameterSchema, MockWorkspaceQuota } from "./entities"
 import fs from "fs"
 import path from "path"
 
@@ -79,7 +79,23 @@ export const handlers = [
   rest.get(
     "/api/v2/templateversions/:templateVersionId/schema",
     async (req, res, ctx) => {
-      return res(ctx.status(200), ctx.json([]))
+      return res(
+        ctx.status(200),
+        ctx.json([
+          mockParameterSchema({
+            id: "1",
+            name: M.MockTemplateVersionParameter1.name,
+          }),
+          mockParameterSchema({
+            id: "2",
+            name: M.MockTemplateVersionParameter2.name,
+          }),
+          mockParameterSchema({
+            id: "3",
+            name: M.MockTemplateVersionParameter3.name,
+          }),
+        ]),
+      )
     },
   ),
   rest.get(

From da0a2c1e36b81ef77f00897e5118d01046c44ab7 Mon Sep 17 00:00:00 2001
From: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
Date: Thu, 30 Mar 2023 12:04:48 +0000
Subject: [PATCH 8/8] Fix test

---
 site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx
index 31740ff193ee6..22ecfe4aafa08 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.test.tsx
@@ -79,6 +79,7 @@ describe("CreateWorkspacePage", () => {
   })
 
   it("succeeds with default owner", async () => {
+    jest.spyOn(API, "getTemplateVersionSchema").mockResolvedValueOnce([])
     jest
       .spyOn(API, "getUsers")
       .mockResolvedValueOnce({ users: [MockUser], count: 1 })

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>pFad - Phonifier reborn</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
</head>
<body>
<h1>Pfad - The Proxy pFad of &#169; 2024 Garber Painting. All rights reserved.</h1>


<!-- Disclaimer -->
<p>Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.</p>
<br>
<p>Alternative Proxies:</p><p><a href="http://rainy.clevelandohioweatherforecast.com/php-proxy/index.php?q=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/6853.patch" target="_blank">Alternative Proxy</a></p><p><a href="http://rainy.clevelandohioweatherforecast.com/pFad/index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/6853.patch" target="_blank">pFad Proxy</a></p><p><a href="http://rainy.clevelandohioweatherforecast.com/pFad/v3index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/6853.patch" target="_blank">pFad v3 Proxy</a></p><p><a href="http://rainy.clevelandohioweatherforecast.com/pFad/v4index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/6853.patch" target="_blank">pFad v4 Proxy</a></p></body>
</html>