fix: file-menu not opening when clicking on folders
Massimo Melina committed
Apr 3, 2023 at 20:35 UTC
f27e72e05dfdb927c3b9062bacaa023060f506d6
1 file changed
+24
-24
frontend/src/BrowseFiles.ts
+24
-24
@@ -12,7 +12,7 @@ import {
12
useRef,
13
useState
14
} from 'react'
15
-import { domOn, formatBytes, ErrorMsg, hIcon, isMobile, newDialog, hfsEvent, getHFS } from './misc'
15
+import { domOn, formatBytes, ErrorMsg, hIcon, isMobile, newDialog, hfsEvent, getHFS, dontBotherWithKeys } from './misc'
16
import { Checkbox, CustomCode, Spinner } from './components'
17
import { Head } from './Head'
18
import { state, useSnapState } from './state'
@@ -189,6 +189,7 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
189
className += ' ' + PAGE_SEPARATOR_CLASS
190
const ico = hIcon(isFolder ? 'folder' : 'file')
191
const menuOnLink = getHFS().fileMenuOnLink
192
+ const onClick = menuOnLink && openFileMenu || undefined
193
return h('li', { className, label: separator },
194
showFilter && h(Checkbox, {
195
value: selected[uri],
@@ -198,16 +199,10 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
199
delete state.selected[uri]
200
},
201
}),
201
- isFolder ? h(Link, { to: base + uri }, ico, entry.n.slice(0,-1))
202
+ isFolder ? h(Link, { to: base + uri, onClick }, ico, entry.n.slice(0,-1))
203
: h(Fragment, {},
204
containerDir && h(Link, { to: base + containerDir, className:'container-folder' }, ico, pathDecode(containerDir) ),
204
- h('a', {
205
- href: uri,
206
- onClick(ev: MouseEvent) {
207
- if (menuOnLink)
208
- openFileMenu(ev)
209
- }
210
- }, !containerDir && ico, name)
205
+ h('a', { href: uri, onClick }, !containerDir && ico, name)
206
),
207
h(CustomCode, { name: 'afterEntryName', props: { entry } }),
208
h('div', { className: 'entry-panel' },
@@ -220,9 +215,12 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
215
function openFileMenu(ev: MouseEvent) {
216
if (ev.altKey || ev.ctrlKey || ev.metaKey) return
217
ev.preventDefault()
218
+ const OPEN_ICON = 'play'
219
+ const OPEN_LABEL = t('file_open', "Open")
220
const menu = [
224
- menuOnLink && { label: t('file_open', "Open"), href: uri, target: '_blank', icon: 'play' },
225
- { label: t`Download`, href: uri + '?dl', icon: 'download' },
221
+ menuOnLink && (isFolder ? h(Link, { to: base + uri, onClick: () => close() }, hIcon(OPEN_ICON), OPEN_LABEL)
222
+ : { label: OPEN_LABEL, href: uri, target: isFolder ? undefined : '_blank', icon: OPEN_ICON }),
223
+ { label: t`Download`, href: uri + (isFolder ? '?get=zip' : '?dl'), icon: 'download' },
224
can_delete && { label: t`Delete`, icon: 'trash', onClick: () => deleteFiles([uri], base) }
225
]
226
const props = [
@@ -241,24 +239,26 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
239
const {t} = useI18N()
240
return h(Fragment, {},
241
h('dl', { className: 'file-dialog-properties' },
244
- props.map(prop => isValidElement(prop) ? prop
242
+ dontBotherWithKeys(props.map(prop => isValidElement(prop) ? prop
243
: Array.isArray(prop) ? h(Fragment, {}, h('dt', {}, prop[0]), h('dd', {}, prop[1]))
244
: null
247
- )
245
+ ))
246
),
247
entry.p && h(Fragment, {}, hIcon('password', { style: { marginRight: '.5em' } }), t(MISSING_PERM)),
248
h('div', { className: 'file-menu' },
251
- menu.map((e: any, i) => !e?.label ? null :
252
- h('a', {
253
- key: i,
254
- href: e.href || '#',
255
- ..._.omit(e, ['label', 'icon', 'href', 'onClick']),
256
- async onClick() {
257
- if ((await e.onClick?.()) !== false)
258
- close()
259
- }
260
- }, hIcon(e.icon || 'file'), e.label )
261
- )
249
+ dontBotherWithKeys(menu.map((e: any, i) =>
250
+ isValidElement(e) ? e
251
+ : !e?.label ? null :
252
+ h('a', {
253
+ key: i,
254
+ href: e.href || '#',
255
+ ..._.omit(e, ['label', 'icon', 'href', 'onClick']),
256
+ async onClick() {
257
+ if ((await e.onClick?.()) !== false)
258
+ close()
259
+ }
260
+ }, hIcon(e.icon || 'file'), e.label )
261
+ ))
262
)
263
)
264
}