Fixed some bugs with ui and lock job name to prevent issues with continuing training.

ui/src/app/jobs/new/page.tsx

@@ -28,6 +28,7 @@ export default function TrainingForm() {
   const { datasets, status: datasetFetchStatus } = useDatasetList();
   const [datasetOptions, setDatasetOptions] = useState<{ value: string; label: string }[]>([]);
 
+
   const [jobConfig, setJobConfig] = useNestedState<JobConfig>(objectCopy(defaultJobConfig));
   const [status, setStatus] = useState<'idle' | 'saving' | 'success' | 'error'>('idle');
 
@@ -54,6 +55,7 @@ export default function TrainingForm() {
         .then(data => {
           setGpuIDs(data.gpu_ids);
           setJobConfig(JSON.parse(data.job_config));
+          // setJobConfig(data.name, 'config.name');
         })
         .catch(error => console.error('Error fetching training:', error));
     }
@@ -111,6 +113,8 @@ export default function TrainingForm() {
     saveJob();
   };
 
+  console.log('jobConfig.config.process[0].network.linear', jobConfig?.config?.process[0].network?.linear);
+
   return (
     <>
       <TopBar>
@@ -142,6 +146,7 @@ export default function TrainingForm() {
                 value={jobConfig.config.name}
                 onChange={value => setJobConfig(value, 'config.name')}
                 placeholder="Enter training name"
+                disabled={runId !== null}
                 required
               />
               <SelectInput
@@ -199,17 +204,18 @@ export default function TrainingForm() {
                 />
               </FormGroup>
             </Card>
-            {jobConfig.config.process[0].network?.linear && (
+            {jobConfig.config.process[0].network?.type && (
               <Card title="LoRA Configuration">
                 <NumberInput
                   label="Linear Rank"
                   value={jobConfig.config.process[0].network.linear}
                   onChange={value => {
+                    console.log('onChange', value);
                     setJobConfig(value, 'config.process[0].network.linear');
                     setJobConfig(value, 'config.process[0].network.linear_alpha');
                   }}
                   placeholder="eg. 16"
-                  min={1}
+                  min={0}
                   max={1024}
                   required
                 />

ui/src/components/formInputs.tsx

@@ -16,20 +16,25 @@ export interface TextInputProps extends InputProps {
   value: string;
   onChange: (value: string) => void;
   type?: 'text' | 'password';
+  disabled?: boolean;
 }
 
 export const TextInput = (props: TextInputProps) => {
-  const { label, value, onChange, placeholder, required } = props;
+  const { label, value, onChange, placeholder, required, disabled } = props;
   return (
     <div className={classNames(props.className)}>
       {label && <label className={labelClasses}>{label}</label>}
       <input
         type={props.type || 'text'}
         value={value}
-        onChange={e => onChange(e.target.value)}
-        className={inputClasses}
+        onChange={e => {
+          if (disabled) return;
+          onChange(e.target.value);
+        }}
+        className={`${inputClasses} ${disabled && 'opacity-30 cursor-not-allowed'}`}
         placeholder={placeholder}
         required={required}
+        disabled={disabled}
       />
     </div>
   );
@@ -50,10 +55,10 @@ export const NumberInput = (props: NumberInputProps) => {
       <input
         type="number"
         value={value}
-        onChange={(e) => {
+        onChange={e => {
           // Use parseFloat instead of Number to properly handle decimal values
           const rawValue = e.target.value;
-          
+
           // Special handling for empty or partial inputs
           if (rawValue === '' || rawValue === '-' || rawValue === '.') {
             // For empty or partial inputs (like just a minus sign or decimal point),
@@ -62,18 +67,18 @@ export const NumberInput = (props: NumberInputProps) => {
             onChange(0);
             return;
           }
-          
-          let value = parseFloat(rawValue);
-          
+
+          let value = Number(rawValue);
+
           // Handle NaN cases
           if (isNaN(value)) {
             value = 0;
           }
-          
+
           // Apply min/max constraints only for valid numbers
           if (min !== undefined && value < min) value = min;
           if (max !== undefined && value > max) value = max;
-          
+
           onChange(value);
         }}
         className={inputClasses}

ui/src/utils/hooks.tsx

@@ -77,6 +77,10 @@ export function useNestedState<T>(initialState: T): [T, (value: any, path?: stri
   const [state, setState] = React.useState<T>(initialState);
 
   const setValue = React.useCallback((value: any, path?: string) => {
+    if (path === undefined) {
+      setState(value);
+      return
+    }
     setState(prevState => setNestedValue(prevState, value, path));
   }, []);