sync: update from private repo (9a86f49b)

ui/src/components/settings/LlmWorkersForm.tsx

@@ -5,7 +5,7 @@ import { EnvOverrideWarning, FieldLabel, FieldInput } from './formUtils';
 import { SecretInput } from './SecretInput';
 import { ModelSelect } from './ModelSelect';
 import { StringArrayEditor } from './StringArrayEditor';
-import type { SectionFormProps } from './types';
+import { settingsFieldId, type SectionFormProps } from './types';
 
 /**
  * Worker entry shape used by the v2 `llm.workers[]` config block. The
@@ -127,6 +127,8 @@ function ExtraBodyField({ value, onChange, fieldKey, onValidityChange }: {
   const { t } = useTranslation('settings');
   const [text, setText] = useState(() => (value === undefined ? '' : JSON.stringify(value, null, 2)));
   const [error, setError] = useState<string | null>(null);
+  const inputId = settingsFieldId(fieldKey);
+  const errorId = `${inputId}-error`;
   // Last value WE pushed via onChange. If the prop diverges from it, the
   // change came from outside (discard / row shift) → re-sync the draft.
   const lastEmitted = useRef(value);
@@ -175,7 +177,10 @@ function ExtraBodyField({ value, onChange, fieldKey, onValidityChange }: {
     <div className="col-span-2">
       <FieldLabel>extra_body</FieldLabel>
       <textarea
+        id={inputId}
         aria-label="extra_body"
+        aria-invalid={error !== null}
+        aria-describedby={error ? errorId : undefined}
         value={text}
         onChange={e => handleChange(e.target.value)}
         rows={4}
@@ -184,7 +189,7 @@ function ExtraBodyField({ value, onChange, fieldKey, onValidityChange }: {
           error ? 'border-red-400 focus:border-red-400' : 'border-hairline focus:border-accent'
         }`}
       />
-      {error && <p className="text-2xs text-red-600 mt-1">{error}</p>}
+      {error && <p id={errorId} role="alert" className="text-2xs text-red-600 mt-1">{error}</p>}
       <HelpText>{t('llmWorkers.extraBodyHelp')}</HelpText>
     </div>
   );
@@ -554,8 +559,9 @@ export function LlmWorkersForm({ config, onChange, overriddenByEnv, onValidityCh
       </h3>
 
       <div>
-        <FieldLabel>Timeout (minutes)</FieldLabel>
+        <FieldLabel htmlFor={settingsFieldId('llm.timeoutMinutes')}>Timeout (minutes)</FieldLabel>
         <FieldInput
+          id={settingsFieldId('llm.timeoutMinutes')}
           type="number"
           value={llm.timeoutMinutes ?? 10}
           onChange={v => onChange('llm.timeoutMinutes', Number(v))}
@@ -564,8 +570,9 @@ export function LlmWorkersForm({ config, onChange, overriddenByEnv, onValidityCh
       </div>
 
       <div>
-        <FieldLabel>Max Stream (minutes)</FieldLabel>
+        <FieldLabel htmlFor={settingsFieldId('llm.maxStreamMinutes')}>Max Stream (minutes)</FieldLabel>
         <FieldInput
+          id={settingsFieldId('llm.maxStreamMinutes')}
           type="number"
           value={llm.maxStreamMinutes ?? ''}
           onChange={v => onChange('llm.maxStreamMinutes', v === '' ? undefined : Number(v))}