admin/config: better ux on max_kbps field

Massimo Melina committed Mar 12, 2022 at 18:19 UTC 09ae7a39f140b0b49c60002602d892cfe5444a89
2 files changed +15 -5
admin/src/ConfigPage.ts
+8 -2
@@ -24,6 +24,12 @@ export default function ConfigPage() {
24 return res
25 const { changes } = snap
26 const config = (loaded !== res) ? (state.config = loaded = res) : snap.config
27 + const maxSpeedDefaults = {
28 + comp: NumberField,
29 + min: 1,
30 + placeholder: "no limit",
31 + onChange: (v: any) => v < 1 ? '' : v
32 + }
33 return h(Form, {
34 sx: { maxWidth: '90em' },
35 values: config,
@@ -55,8 +61,8 @@ export default function ConfigPage() {
61 { k: 'https_port', comp: ServerPort, label: "HTTPS port", status: status?.https||true, suggestedPort: 443 },
62 config.https_port >= 0 && { k: 'cert', comp: StringField, label: "HTTPS certificate file" },
63 config.https_port >= 0 && { k: 'private_key', comp: StringField, label: "HTTPS private key file" },
58 - { k: 'max_kbps', comp: NumberField, label: 'Max KB/s', helperText: "Limit output bandwidth" },
59 - { k: 'max_kbps_per_ip', comp: NumberField, label: "Max KB/s per-ip" },
64 + { k: 'max_kbps', ...maxSpeedDefaults, label: "Limit output KB/s" },
65 + { k: 'max_kbps_per_ip', ...maxSpeedDefaults, label: "Limit output KB/s per-ip" },
66 { k: 'log', xl: 4, comp: StringField, label: "Main log file" },
67 { k: 'error_log', xl: 4, comp: StringField, label: "Error log file" },
68 { k: 'log_rotation', xl: 4, comp: SelectField, options: [{ value:'', label:"disabled" }, 'daily', 'weekly', 'monthly' ],
admin/src/Form.ts
+7 -3
@@ -90,12 +90,16 @@ export function Form({ fields, values, set, defaults, save, stickyBar, addToBar=
90 if (isValidElement(row))
91 return h(Grid, { key: idx, item: true, xs: 12 }, row)
92 let field = row
93 - const { k } = field
93 + const { k, onChange } = field
94 if (k) {
95 field = {
96 value: values?.[k],
97 - onChange(v:any) { set(v, field) },
97 ...field,
98 + onChange(v:any) {
99 + if (onChange)
100 + v = onChange(v)
101 + set(v, field)
102 + },
103 }
104 if (field.label === undefined)
105 field.label = _.capitalize(k.replaceAll('_', ' '))
@@ -136,9 +140,9 @@ export function StringField({ value, onChange, fromField=_.identity, toField=_.i
140 }, [value, toField])
141 return h(TextField, {
142 fullWidth: true,
143 + InputLabelProps: state || props.placeholder ? { shrink: true } : undefined,
144 ...props,
145 value: state,
141 - InputLabelProps: state ? { shrink: true } : undefined,
146 onChange(event) {
147 setState(event.target.value)
148 },