fix(web): add allowed-values + max-length inputs to custom field editor

When type is 'enum', show a comma-separated input for allowed values. When type is 'string', show a max-length input. Previously these type-specific options were missing from the UI.

fix(web): add allowed-values + max-length inputs to custom field editor
When type is 'enum', show a comma-separated input for allowed values. When type is 'string', show a max-length input. Previously these type-specific options were missing from the UI.
zichun
1 parent da7ebd3c
Showing 1 changed file with 37 additions and 1 deletions
web/src/pages/MetadataAdminPage.tsx
@@ -145,6 +145,8 @@ export function MetadataAdminPage() {
   const [cfPii, setCfPii] = useState(false)
   const [cfLabelEn, setCfLabelEn] = useState('')
   const [cfLabelZh, setCfLabelZh] = useState('')
+  const [cfAllowedValues, setCfAllowedValues] = useState('')
+  const [cfMaxLength, setCfMaxLength] = useState('')
   const [cfSaving, setCfSaving] = useState(false)
   // ── Loaders ───────────────────────────────────────────────────────
@@ -192,6 +194,8 @@ export function MetadataAdminPage() {
     setCfTargetEntity('')
     setCfFieldKey('')
     setCfTypeKind('string')
+    setCfAllowedValues('')
+    setCfMaxLength('')
     setCfRequired(false)
     setCfPii(false)
     setCfLabelEn('')
@@ -222,7 +226,11 @@ export function MetadataAdminPage() {
     const body: Omit<CustomFieldDef, 'source'> = {
       key: cfFieldKey,
       targetEntity: cfTargetEntity,
-      type: { kind: cfTypeKind },
+      type: {
+        kind: cfTypeKind,
+        ...(cfTypeKind === 'enum' && cfAllowedValues ? { allowedValues: cfAllowedValues.split(',').map((v) => v.trim()).filter(Boolean) } : {}),
+        ...(cfTypeKind === 'string' && cfMaxLength ? { maxLength: Number(cfMaxLength) } : {}),
+      },
       required: cfRequired,
       pii: cfPii,
       labelTranslations: {
@@ -613,6 +621,34 @@ export function MetadataAdminPage() {
                       ))}
                     </select>
                   </div>
+                  {cfTypeKind === 'enum' && (
+                    <div>
+                      <label className="block text-xs font-medium text-slate-700">
+                        Allowed values (comma-separated)
+                      </label>
+                      <input
+                        type="text"
+                        value={cfAllowedValues}
+                        onChange={(e) => setCfAllowedValues(e.target.value)}
+                        placeholder="LOW, NORMAL, HIGH, URGENT"
+                        className="mt-1 w-full rounded-md border border-slate-300 px-2 py-1.5 text-sm"
+                      />
+                    </div>
+                  )}
+                  {cfTypeKind === 'string' && (
+                    <div>
+                      <label className="block text-xs font-medium text-slate-700">
+                        Max length
+                      </label>
+                      <input
+                        type="number"
+                        value={cfMaxLength}
+                        onChange={(e) => setCfMaxLength(e.target.value)}
+                        placeholder="255"
+                        className="mt-1 w-full rounded-md border border-slate-300 px-2 py-1.5 text-sm"
+                      />
+                    </div>
+                  )}
                   <div className="flex items-end gap-4 pb-1">
                     <label className="flex items-center gap-1.5 text-sm text-slate-700">
                       <input