admin: added some helper text
Massimo Melina committed
Feb 12, 2022 at 20:17 UTC
628b2b00de0da5cc18000668357711a01d6d81e4
5 files changed
+34
-22
admin/src/AccountsPage.ts
+6
-3
@@ -145,9 +145,12 @@ function AccountForm({ account, done, groups }: { account: Account, groups: stri
145
{ k: 'username', label: group ? 'Group name' : undefined, autoComplete: 'off' },
146
!group && { k: 'password', comp: StringField, md: 6, type: 'password', autoComplete: 'new-password', label: add ? 'Password' : 'Change password' },
147
!group && { k: 'password2', comp: StringField, md: 6, type: 'password', autoComplete: 'off', label: 'Repeat password' },
148
- { k: 'ignore_limits', comp: BoolField },
149
- { k: 'redirect', comp: StringField },
150
- { k: 'belongs', comp: SelectField, multiple: true, label: "Inherits from", options: belongsOptions }
148
+ { k: 'ignore_limits', comp: BoolField,
149
+ helperText: values.ignore_limits ? "Speed limits don't apply to this account" : "Speed limits apply to this account" },
150
+ { k: 'redirect', comp: StringField, helperText: "If you want this account to be redirected to a specific folder/address at login time" },
151
+ { k: 'belongs', comp: SelectField, multiple: true, label: "Inherits from", options: belongsOptions,
152
+ helperText: "Options and permissions of the selected groups will be applied to this account. "
153
+ + (belongsOptions.length ? '' : "There are no groups available, create one first.") }
154
],
155
save: {
156
disabled: isEqualLax(values, account),
admin/src/ConfigPage.ts
+3
-2
@@ -54,13 +54,14 @@ export default function ConfigPage() {
54
{ value: '0.0.0.0', label: 'any network' }
55
]
56
},
57
- { k: 'max_kbps', comp: NumberField, label: 'Max KB/s' },
57
+ { k: 'max_kbps', comp: NumberField, label: 'Max KB/s', helperText: "Limit output bandwidth" },
58
{ k: 'max_kbps_per_ip', comp: NumberField, label: 'Max KB/s per-ip' },
59
{ k: 'log', comp: StringField, label: 'Main log file' },
60
{ k: 'error_log', comp: StringField, label: 'Error log file' },
61
{ k: 'accounts', comp: StringField, label: 'Accounts file' },
62
{ k: 'open_browser_at_start', comp: BoolField },
63
- { k: 'zip_calculate_size_for_seconds', comp: NumberField, label: 'Calculate ZIP size for seconds' },
63
+ { k: 'zip_calculate_size_for_seconds', comp: NumberField, label: 'Calculate ZIP size for seconds',
64
+ helperText: "If time is not enough the browser will not show download percentage" },
65
{ k: 'mime', comp: StringStringField,
66
keyLabel: 'Files', keyWidth: 7,
67
valueLabel: 'Mime type', valueWidth: 4
admin/src/FileCard.ts
+18
-12
@@ -9,6 +9,7 @@ import { reloadVfs } from './VfsPage'
9
import { alertDialog } from './dialog'
10
import PermField from './PermField'
11
import { Lock, LockOpen } from '@mui/icons-material'
12
+import md from './md'
13
14
export default function FileCard() {
15
const { selectedFiles: files } = useSnapState()
@@ -27,9 +28,11 @@ export default function FileCard() {
28
29
function FileForm({ file }:any) {
30
file = _.omit(file, ['parent', 'children'])
31
+ const { source } = file
32
useEffect(() => setValues(file), [JSON.stringify(file)]) //eslint-disable-line
33
const [values, setValues] = useState(file)
32
- const realFolder = file.source && file.type === 'folder'
34
+ const isDir = file.type === 'folder'
35
+ const realFolder = source && isDir
36
return h(Form, {
37
values,
38
set(v, { k }) {
@@ -53,20 +56,23 @@ function FileForm({ file }:any) {
56
}
57
},
58
fields: [
56
- { k: 'name' },
57
- { k: 'source', comp: DisplayField },
58
- realFolder && { k: 'hide', xl: values.hide ? 12: 6, label: "Hide elements read from the source" },
59
- realFolder && { k: 'remove', xl: values.hide ? 12: 6, label: "Remove/skip elements read from the source" },
60
- { k: 'size', comp: DisplayField, map: formatBytes },
61
- { k: 'ctime', comp: DisplayField, md: 6, label: 'Created', map: (x:string) => x && new Date(x).toLocaleString() },
62
- { k: 'mtime', comp: DisplayField, md: 6, label: 'Modified', map: (x:string) => x && new Date(x).toLocaleString() },
63
- { k: 'hidden', comp: BoolField, md: 6 },
64
- { k: 'forbid', comp: BoolField, md: 6 },
59
+ { k: 'name', helperText: source && "You can decide a name that's different from the one on your disk" },
60
+ source && { k: 'source', comp: DisplayField },
61
+ realFolder && { k: 'hide', xl: values.hide ? 12: 6, label: "Hide elements read from the source",
62
+ helperText: "Entering a file mask you can decide that people won't see some elements in this list, but still can download if they have a direct link to them" },
63
+ realFolder && { k: 'remove', xl: values.hide ? 12: 6, label: "Remove/skip elements read from the source",
64
+ helperText: "Elements matching the specified file mask won't be neither listed nor downloadable, like they don't exist" },
65
+ source && !realFolder && { k: 'size', comp: DisplayField, map: formatBytes },
66
+ source && { k: 'ctime', comp: DisplayField, md: 6, label: 'Created', map: (x:string) => x && new Date(x).toLocaleString() },
67
+ source && { k: 'mtime', comp: DisplayField, md: 6, label: 'Modified', map: (x:string) => x && new Date(x).toLocaleString() },
68
+ { k: 'hidden', comp: BoolField, md: 6, helperText: "If you hide this element will not be listed, but will still be accessible if you have a direct link" },
69
+ isDir && { k: 'forbid', comp: BoolField, md: 6, helperText: "Forbid listing the content of this folder, but elements inside will still be accessible if you have a direct link" },
70
{ k: 'perm', comp: PermField,
71
label: h(Box, { display:'flex', gap:1 }, ...values.perm ? [h(Lock), 'Access restricted'] : [h(LockOpen), 'Access not restricted'])
72
},
68
- { k: 'mime', lg: 6, label:"MIME type" },
69
- realFolder && { k: 'default', lg: 6, label:"Serve file instead of list" },
73
+ { k: 'mime', lg: 6, label:"MIME type", helperText: isDir && "Will be applied for all files in this folder" },
74
+ realFolder && { k: 'default', lg: 6, label:"Serve file instead of list",
75
+ helperText: md("If you have a website that you want to serve in this folder, specify `index.html`") },
76
]
77
})
78
}
admin/src/Form.ts
+6
-4
@@ -3,7 +3,7 @@ import {
3
Box,
4
Button,
5
FormControl,
6
- FormControlLabel,
6
+ FormControlLabel, FormHelperText,
7
FormLabel,
8
Grid,
9
MenuItem, Radio,
@@ -168,7 +168,7 @@ export function NumberField({ value, onChange, ...props }: FieldProps<number | n
168
})
169
}
170
171
-export function BoolField({ label, value, onChange, ...props }: FieldProps<boolean>) {
171
+export function BoolField({ label='', value, onChange, helperText, ...props }: FieldProps<boolean>) {
172
const [state, setState] = useState(() => value ?? false)
173
useEffect(() => setState(() => value ?? false),
174
[value])
@@ -179,8 +179,10 @@ export function BoolField({ label, value, onChange, ...props }: FieldProps<boole
179
onChange(event.target.checked, { event, was: value })
180
}
181
})
182
- return label ? h(FormControlLabel, { label, control, labelPlacement: 'top' })
183
- : control
182
+ return h(Box, { ml: 1 },
183
+ h(FormControlLabel, { label, control, labelPlacement: 'end' }),
184
+ helperText && h(FormHelperText,{},helperText)
185
+ )
186
}
187
188
export function RadioField<T>({ label, options, value, onChange }: FieldProps<T> & { options:SelectPair<T>[] }) {
todo.md
+1
-1
@@ -1,7 +1,7 @@
1
# To do
2
+- admin: add virtual folders
3
- admin: warn in case of items with same name
4
- password protect admin
4
-- explain fields in admin
5
- allowed referer
6
- admin/plugins
7
- download-counter: expose results on admin