@@ -19,7 +19,12 @@ type EditTaskModalProps = {
1919 onSaved ?: ( ) => void ;
2020} ;
2121
22- export default function EditTaskModal ( { open, onClose, task, onSaved = ( ) => { } } : EditTaskModalProps ) {
22+ export default function EditTaskModal ( {
23+ open,
24+ onClose,
25+ task,
26+ onSaved = ( ) => { } ,
27+ } : EditTaskModalProps ) {
2328 const [ title , setTitle ] = React . useState ( '' ) ;
2429 const [ command , setCommand ] = React . useState ( '' ) ;
2530 const [ clusterName , setClusterName ] = React . useState ( '' ) ;
@@ -42,7 +47,10 @@ export default function EditTaskModal({ open, onClose, task, onSaved = () => {}
4247 React . useEffect ( ( ) => {
4348 if ( ! task ) return ;
4449 setTitle ( task . name || '' ) ;
45- const cfg = typeof task . config === 'string' ? safeParse ( task . config ) : task . config || { } ;
50+ const cfg =
51+ typeof task . config === 'string'
52+ ? safeParse ( task . config )
53+ : task . config || { } ;
4654 setClusterName ( cfg . cluster_name || '' ) ;
4755 setCommand ( cfg . command || '' ) ;
4856 setCpus ( cfg . cpus != null ? String ( cfg . cpus ) : '' ) ;
@@ -113,7 +121,9 @@ export default function EditTaskModal({ open, onClose, task, onSaved = () => {}
113121
114122 return (
115123 < Modal open = { open } onClose = { onClose } >
116- < ModalDialog sx = { { maxHeight : '90vh' , width : '70vw' , overflow : 'hidden' } } >
124+ < ModalDialog
125+ sx = { { maxHeight : '90vh' , width : '70vw' , overflow : 'hidden' } }
126+ >
117127 < ModalClose />
118128 < DialogTitle > Edit Task</ DialogTitle >
119129 < form onSubmit = { handleSubmit } >
@@ -140,44 +150,86 @@ export default function EditTaskModal({ open, onClose, task, onSaved = () => {}
140150 marginTop : '16px' ,
141151 } }
142152 >
143- < FormControl sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } } >
153+ < FormControl
154+ sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } }
155+ >
144156 < FormLabel > CPUs</ FormLabel >
145- < Input value = { cpus } onChange = { ( e ) => setCpus ( e . target . value ) } placeholder = "e.g. 2" />
157+ < Input
158+ value = { cpus }
159+ onChange = { ( e ) => setCpus ( e . target . value ) }
160+ placeholder = "e.g. 2"
161+ />
146162 </ FormControl >
147163
148- < FormControl sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } } >
164+ < FormControl
165+ sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } }
166+ >
149167 < FormLabel > Memory (in GB)</ FormLabel >
150- < Input value = { memory } onChange = { ( e ) => setMemory ( e . target . value ) } placeholder = "e.g. 4" />
168+ < Input
169+ value = { memory }
170+ onChange = { ( e ) => setMemory ( e . target . value ) }
171+ placeholder = "e.g. 4"
172+ />
151173 </ FormControl >
152174
153- < FormControl sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } } >
175+ < FormControl
176+ sx = { { flex : '1 1 calc(33.333% - 16px)' , minWidth : '150px' } }
177+ >
154178 < FormLabel > Disk Space (in GB)</ FormLabel >
155- < Input value = { diskSpace } onChange = { ( e ) => setDiskSpace ( e . target . value ) } placeholder = "e.g. 20" />
179+ < Input
180+ value = { diskSpace }
181+ onChange = { ( e ) => setDiskSpace ( e . target . value ) }
182+ placeholder = "e.g. 20"
183+ />
156184 </ FormControl >
157185 </ div >
158186
159187 < FormControl sx = { { mt : 2 } } >
160188 < FormLabel > Accelerators per Node</ FormLabel >
161- < Input value = { accelerators } onChange = { ( e ) => setAccelerators ( e . target . value ) } placeholder = "e.g. RTX3090:1 or H100:8" />
189+ < Input
190+ value = { accelerators }
191+ onChange = { ( e ) => setAccelerators ( e . target . value ) }
192+ placeholder = "e.g. RTX3090:1 or H100:8"
193+ />
162194 </ FormControl >
163195
164196 < FormControl sx = { { mt : 2 } } >
165197 < FormLabel > Number of Nodes</ FormLabel >
166- < Input type = "number" value = { numNodes } onChange = { ( e ) => setNumNodes ( e . target . value ) } placeholder = "e.g. 1" />
198+ < Input
199+ type = "number"
200+ value = { numNodes }
201+ onChange = { ( e ) => setNumNodes ( e . target . value ) }
202+ placeholder = "e.g. 1"
203+ />
167204 </ FormControl >
168205
169206 < FormControl sx = { { mt : 2 } } >
170207 < FormLabel > Setup Command</ FormLabel >
171- < Textarea minRows = { 2 } value = { setup } onChange = { ( e ) => setSetup ( e . target . value ) } placeholder = "Setup commands (optional) that runs before task is run. e.g. pip install -r requirements.txt" />
208+ < Textarea
209+ minRows = { 2 }
210+ value = { setup }
211+ onChange = { ( e ) => setSetup ( e . target . value ) }
212+ placeholder = "Setup commands (optional) that runs before task is run. e.g. pip install -r requirements.txt"
213+ />
172214 </ FormControl >
173215
174216 < FormControl required sx = { { mt : 2 } } >
175217 < FormLabel > Command</ FormLabel >
176- < Textarea minRows = { 4 } value = { command } onChange = { ( e ) => setCommand ( e . target . value ) } placeholder = "e.g. python train.py --epochs 10" />
218+ < Textarea
219+ minRows = { 4 }
220+ value = { command }
221+ onChange = { ( e ) => setCommand ( e . target . value ) }
222+ placeholder = "e.g. python train.py --epochs 10"
223+ />
177224 </ FormControl >
178225 </ DialogContent >
179226 < DialogActions >
180- < Button variant = "plain" color = "neutral" onClick = { onClose } disabled = { saving } >
227+ < Button
228+ variant = "plain"
229+ color = "neutral"
230+ onClick = { onClose }
231+ disabled = { saving }
232+ >
181233 Cancel
182234 </ Button >
183235 < Button type = "submit" variant = "solid" loading = { saving } >
@@ -189,5 +241,3 @@ export default function EditTaskModal({ open, onClose, task, onSaved = () => {}
189241 </ Modal >
190242 ) ;
191243}
192-
193-
0 commit comments