Skip to content

Commit 8012a41

Browse files
kylecarbskylecarbs
committed
Add new frontend for rendering parameters
1 parent bc6c788 commit 8012a41

File tree

5 files changed

+426
-0
lines changed

5 files changed

+426
-0
lines changed

‎codersdk/templateversions.go

+1
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ type TemplateVersionParameter struct {
3434
DefaultValue string `json:"default_value"`
3535
Icon string `json:"icon"`
3636
Options []TemplateVersionParameterOption `json:"options"`
37+
ValidationError string `json:"validation_error"`
3738
ValidationRegex string `json:"validation_regex"`
3839
ValidationMin int32 `json:"validation_min"`
3940
ValidationMax int32 `json:"validation_max"`

‎site/src/api/typesGenerated.ts

+1
Original file line numberDiff line numberDiff line change
@@ -459,6 +459,7 @@ export interface TemplateVersionParameter {
459459
readonly default_value: string
460460
readonly icon: string
461461
readonly options: TemplateVersionParameterOption[]
462+
readonly validation_error: string
462463
readonly validation_regex: string
463464
readonly validation_min: number
464465
readonly validation_max: number

‎site/src/components/WorkspaceParameter/WorkspaceParameter.stories.tsx

+169
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,169 @@
1+
import { Story } from "@storybook/react"
2+
import { WorkspaceParameter, WorkspaceParameterProps } from "./WorkspaceParameter"
3+
4+
export default {
5+
title: "components/WorkspaceParameter",
6+
component: WorkspaceParameter,
7+
}
8+
9+
const Template: Story<WorkspaceParameterProps> = (args) => <WorkspaceParameter {...args} />
10+
11+
export const Region = Template.bind({})
12+
Region.args = {
13+
templateParameter: {
14+
name: "Region",
15+
default_value: "canada",
16+
description: "Select a location for your workspace to live.",
17+
icon: "/emojis/1f30e.png",
18+
mutable: false,
19+
options: [{
20+
name: "Toronto, Canada",
21+
description: "",
22+
icon: "/emojis/1f1e8-1f1e6.png",
23+
value: "canada"
24+
}, {
25+
name: "Hamina, Finland",
26+
description: "",
27+
icon: "/emojis/1f1eb-1f1ee.png",
28+
value: "finland"
29+
}, {
30+
name: "Warsaw, Poland",
31+
description: "",
32+
icon: "/emojis/1f1f5-1f1f1.png",
33+
value: "poland"
34+
}, {
35+
name: "Madrid, Spain",
36+
description: "",
37+
icon: "/emojis/1f1ea-1f1f8.png",
38+
value: "spain"
39+
}, {
40+
name: "London, England",
41+
description: "",
42+
icon: "/emojis/1f1ec-1f1e7.png",
43+
value: "england"
44+
}, {
45+
name: "Dallas, Texas",
46+
description: "",
47+
icon: "/emojis/1f920.png",
48+
value: "texas"
49+
}],
50+
type: "string",
51+
validation_max: 0,
52+
validation_min: 0,
53+
validation_regex: "",
54+
validation_error: "",
55+
},
56+
workspaceBuildParameter: {
57+
name: "Region",
58+
value: "canada",
59+
},
60+
}
61+
62+
export const Repo = Template.bind({})
63+
Repo.args = {
64+
templateParameter: {
65+
name: "Repo",
66+
default_value: "coder",
67+
description: "Select a repository to work on. This will automatically be cloned.",
68+
icon: "/icon/github.svg",
69+
mutable: false,
70+
options: [{
71+
name: "coder/coder",
72+
description: "Remote development environments on your infrastructure provisioned with Terraform",
73+
icon: "",
74+
value: "https://github.com/coder/coder"
75+
}, {
76+
name: "coder/v1",
77+
description: "The home for Coder v1!",
78+
icon: "",
79+
value: "https://github.com/coder/v1"
80+
}],
81+
type: "string",
82+
validation_max: 0,
83+
validation_min: 0,
84+
validation_regex: "",
85+
validation_error: "",
86+
},
87+
workspaceBuildParameter: {
88+
name: "Repo",
89+
value: "https://github.com/coder/coder",
90+
},
91+
}
92+
93+
export const Size = Template.bind({})
94+
Size.args = {
95+
templateParameter: {
96+
name: "Instance Size",
97+
default_value: "8",
98+
description: "",
99+
icon: "/emojis/1f916.png",
100+
mutable: true,
101+
options: [{
102+
name: "Small",
103+
description: "A tiny 4 core machine for small projects.",
104+
icon: "/emojis/1f90f.png",
105+
value: "4"
106+
}, {
107+
name: "Medium",
108+
description: "A larger 8 core machine for heavy-ish workloads.",
109+
icon: "/emojis/1f44c.png",
110+
value: "8"
111+
}, {
112+
name: "Large",
113+
description: "A beefy 16 core machine that can power most workloads.",
114+
icon: "/emojis/1f4aa.png",
115+
value: "16",
116+
}],
117+
type: "string",
118+
validation_max: 0,
119+
validation_min: 0,
120+
validation_regex: "",
121+
validation_error: "",
122+
},
123+
workspaceBuildParameter: {
124+
name: "Instance Size",
125+
value: "8",
126+
},
127+
}
128+
129+
export const Dotfiles = Template.bind({})
130+
Dotfiles.args = {
131+
templateParameter: {
132+
name: "Dotfiles URL",
133+
default_value: "https://github.com/ammario/dotfiles",
134+
description: "A Git URL that points to your personal dotfiles! These will be automatically cloned at start.",
135+
icon: "/emojis/1f3a8.png",
136+
mutable: true,
137+
type: "string",
138+
options: [],
139+
validation_max: 0,
140+
validation_min: 0,
141+
validation_regex: "((git|ssh|http(s)?)|(git@[w.]+))(:(//)?)([w.@:/-~]+)(/)?",
142+
validation_error: "Must be a valid Git URL!",
143+
},
144+
workspaceBuildParameter: {
145+
name: "Dotfiles URL",
146+
value: "",
147+
},
148+
}
149+
150+
export const DiskSize = Template.bind({})
151+
DiskSize.args = {
152+
templateParameter: {
153+
name: "Disk Size",
154+
default_value: "10",
155+
description: "The number of gigabytes for your persistent home volume.",
156+
icon: "",
157+
mutable: true,
158+
type: "number",
159+
options: [],
160+
validation_max: 200,
161+
validation_min: 10,
162+
validation_regex: "",
163+
validation_error: "Some GB",
164+
},
165+
workspaceBuildParameter: {
166+
name: "Dotfiles URL",
167+
value: "",
168+
},
169+
}

0 commit comments

Comments
 (0)