1
1
import TextField from "@material-ui/core/TextField"
2
2
import { Template , UpdateTemplateMeta } from "api/typesGenerated"
3
- import { FormikContextType , FormikTouched , useFormik } from "formik"
3
+ import { FormikTouched , useFormik } from "formik"
4
4
import { FC } from "react"
5
5
import { getFormHelpers } from "util/formUtils"
6
6
import * as Yup from "yup"
@@ -11,6 +11,7 @@ import { FormSection, HorizontalForm, FormFooter } from "components/Form/Form"
11
11
import { Stack } from "components/Stack/Stack"
12
12
import { makeStyles } from "@material-ui/core/styles"
13
13
import Link from "@material-ui/core/Link"
14
+ import Checkbox from "@material-ui/core/Checkbox"
14
15
15
16
const TTLHelperText = ( {
16
17
ttl,
@@ -48,6 +49,8 @@ export const getValidationSchema = (): Yup.AnyObjectSchema =>
48
49
24 * MAX_TTL_DAYS /* 7 days in hours */ ,
49
50
i18next . t ( "maxTTLMaxError" , { ns : "templateSettingsPage" } ) ,
50
51
) ,
52
+ allow_user_autostart : Yup . boolean ( ) ,
53
+ allow_user_autostop : Yup . boolean ( ) ,
51
54
} )
52
55
53
56
export interface TemplateScheduleForm {
@@ -72,29 +75,32 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
72
75
} ) => {
73
76
const { t : commonT } = useTranslation ( "common" )
74
77
const validationSchema = getValidationSchema ( )
75
- const form : FormikContextType < UpdateTemplateMeta > =
76
- useFormik < UpdateTemplateMeta > ( {
77
- initialValues : {
78
- // on display, convert from ms => hours
79
- default_ttl_ms : template . default_ttl_ms / MS_HOUR_CONVERSION ,
80
- // the API ignores this value, but to avoid tripping up validation set
81
- // it to zero if the user can't set the field.
82
- max_ttl_ms : canSetMaxTTL ? template . max_ttl_ms / MS_HOUR_CONVERSION : 0 ,
83
- } ,
84
- validationSchema,
85
- onSubmit : ( formData ) => {
86
- // on submit, convert from hours => ms
87
- onSubmit ( {
88
- default_ttl_ms : formData . default_ttl_ms
89
- ? formData . default_ttl_ms * MS_HOUR_CONVERSION
90
- : undefined ,
91
- max_ttl_ms : formData . max_ttl_ms
92
- ? formData . max_ttl_ms * MS_HOUR_CONVERSION
93
- : undefined ,
94
- } )
95
- } ,
96
- initialTouched,
97
- } )
78
+ const form = useFormik < UpdateTemplateMeta > ( {
79
+ initialValues : {
80
+ // on display, convert from ms => hours
81
+ default_ttl_ms : template . default_ttl_ms / MS_HOUR_CONVERSION ,
82
+ // the API ignores this value, but to avoid tripping up validation set
83
+ // it to zero if the user can't set the field.
84
+ max_ttl_ms : canSetMaxTTL ? template . max_ttl_ms / MS_HOUR_CONVERSION : 0 ,
85
+ allow_user_autostart : template . allow_user_autostart ,
86
+ allow_user_autostop : template . allow_user_autostop ,
87
+ } ,
88
+ validationSchema,
89
+ onSubmit : ( formData ) => {
90
+ // on submit, convert from hours => ms
91
+ onSubmit ( {
92
+ default_ttl_ms : formData . default_ttl_ms
93
+ ? formData . default_ttl_ms * MS_HOUR_CONVERSION
94
+ : undefined ,
95
+ max_ttl_ms : formData . max_ttl_ms
96
+ ? formData . max_ttl_ms * MS_HOUR_CONVERSION
97
+ : undefined ,
98
+ allow_user_autostart : formData . allow_user_autostart ,
99
+ allow_user_autostop : formData . allow_user_autostop ,
100
+ } )
101
+ } ,
102
+ initialTouched,
103
+ } )
98
104
const getFieldHelpers = getFormHelpers < UpdateTemplateMeta > ( form , error )
99
105
const { t } = useTranslation ( "templateSettingsPage" )
100
106
const styles = useStyles ( )
@@ -153,13 +159,72 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
153
159
</ Stack >
154
160
</ FormSection >
155
161
162
+ < FormSection
163
+ title = "Allow users scheduling"
164
+ description = "Allow users to set custom auto-start and auto-stop scheduling options for workspaces created from this template."
165
+ >
166
+ < Stack direction = "column" >
167
+ < Stack direction = "row" alignItems = "center" >
168
+ < Checkbox
169
+ id = "allow_user_autostart"
170
+ size = "small"
171
+ color = "primary"
172
+ disabled = { isSubmitting || ! canSetMaxTTL }
173
+ onChange = { async ( ) => {
174
+ await form . setFieldValue (
175
+ "allow_user_autostart" ,
176
+ ! form . values . allow_user_autostart ,
177
+ )
178
+ } }
179
+ name = "allow_user_autostart"
180
+ checked = { form . values . allow_user_autostart }
181
+ />
182
+ < Stack spacing = { 0.5 } >
183
+ < strong >
184
+ Allow users to auto-start workspaces on a schedule.
185
+ </ strong >
186
+ </ Stack >
187
+ </ Stack >
188
+ < Stack direction = "row" alignItems = "center" >
189
+ < Checkbox
190
+ id = "allow-user-autostop"
191
+ size = "small"
192
+ color = "primary"
193
+ disabled = { isSubmitting || ! canSetMaxTTL }
194
+ onChange = { async ( ) => {
195
+ await form . setFieldValue (
196
+ "allow_user_autostop" ,
197
+ ! form . values . allow_user_autostop ,
198
+ )
199
+ } }
200
+ name = "allow_user_autostop"
201
+ checked = { form . values . allow_user_autostop }
202
+ />
203
+ < Stack spacing = { 0.5 } >
204
+ < strong >
205
+ Allow users to customize auto-stop duration for workspaces.
206
+ </ strong >
207
+ < span className = { styles . optionDescription } >
208
+ Workspaces will always use the default TTL if this is set.
209
+ Regardless of this setting, workspaces can only stay on for the
210
+ max lifetime.
211
+ </ span >
212
+ </ Stack >
213
+ </ Stack >
214
+ </ Stack >
215
+ </ FormSection >
216
+
156
217
< FormFooter onCancel = { onCancel } isLoading = { isSubmitting } />
157
218
</ HorizontalForm >
158
219
)
159
220
}
160
221
161
- const useStyles = makeStyles ( ( ) => ( {
222
+ const useStyles = makeStyles ( ( theme ) => ( {
162
223
ttlFields : {
163
224
width : "100%" ,
164
225
} ,
226
+ optionDescription : {
227
+ fontSize : 12 ,
228
+ color : theme . palette . text . secondary ,
229
+ } ,
165
230
} ) )
0 commit comments