admin/fs: identify groups with an icon
Massimo Melina committed
Mar 5, 2025 at 23:31 UTC
003c148cf82f4d833eaf13362b1bc711f54f0369
3 files changed
+11
-8
admin/src/AccountsPage.ts
+5
-4
@@ -181,7 +181,8 @@ export default function AccountsPage() {
181
return alertDialog("Following elements couldn't be deleted: " + errors.join(', '), 'error')
182
}
183
184
- function account2icon(ac: Account, props={}) {
185
- return h(ac.isGroup ? Group : Person, props)
186
- }
187
-}
\ No newline at end of file
184
+}
185
+
186
+export function account2icon(ac: Account, props={}) {
187
+ return h(ac.isGroup ? Group : Person, props)
188
+}
admin/src/FileForm.ts
+4
-3
@@ -27,11 +27,10 @@ import addFiles, { addLink, addVirtual } from './addFiles'
27
import { SYS_ICONS } from '@hfs/frontend/src/sysIcons'
28
import { hIcon } from '@hfs/frontend/src/misc'
29
import { TextEditorField } from './TextEditor'
30
+import { Account, account2icon } from './AccountsPage'
31
32
const ACCEPT_LINK = "https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept"
33
33
-export interface Account { username: string }
34
-
34
interface FileFormProps {
35
file: VfsNode
36
addToBar?: ReactNode
@@ -282,7 +281,9 @@ function WhoField({ value, onChange, parent, inherit, accounts, helperText, othe
281
label: accounts?.length ? "Accounts for " + rest.label : "You didn't create any account yet",
282
value: thisValue,
283
onChange,
285
- options: accounts?.map(a => ({ value: a.username, label: a.username })) || [],
284
+ options: accounts?.map(a => ({ value: a.username, label: a.username, a })) || [],
285
+ // show icon only for groups, to save space inside the field (not the list)
286
+ renderOption: (x: any) => h('span', {}, x.a.isGroup && account2icon(x.a), ' ', x.label),
287
}) ),
288
h(FormHelperText, {},
289
helperText,
admin/src/VfsPage.ts
+2
-1
@@ -10,7 +10,8 @@ import { Flex, useBreakpoint } from './mui'
10
import { reactJoin } from '@hfs/shared'
11
import _ from 'lodash'
12
import { AlertProps } from '@mui/material/Alert/Alert'
13
-import FileForm, { Account } from './FileForm'
13
+import { Account } from './AccountsPage'
14
+import FileForm from './FileForm'
15
import { Delete } from '@mui/icons-material'
16
import { alertDialog, confirmDialog } from './dialog'
17
import { PageProps } from './App'