fix: wrong focus/tab order
Massimo Melina committed
Jul 29, 2023 at 15:25 UTC
2e4a349e710e720b3f9ee6c09449846c7cb8b2e2
2 files changed
+6
-3
frontend/src/BrowseFiles.ts
+3
-3
@@ -206,8 +206,8 @@ const Entry = memo(({ entry, midnight, separator }: EntryProps) => {
206
menuOnLink && h('button', { className: 'popup-menu-button', onClick: fileMenu }, hIcon('menu'), t`Menu`)
207
)
208
: containerDir ? h(Fragment, {},
209
- h('a', { href: uri, onClick }, ico),
210
- h(Link, { to: containerDir, className:'container-folder' }, containerName),
209
+ h('a', { href: uri, onClick, tabIndex: -1 }, ico),
210
+ h(Link, { to: containerDir, className:'container-folder', tabIndex: -1 }, containerName),
211
h('a', { href: uri, onClick }, entry.name)
212
) : h('a', { href: uri, onClick }, ico, entry.name),
213
),
@@ -245,7 +245,7 @@ export const EntryDetails = memo(({ entry, midnight }: { entry: DirEntry, midnig
245
const shortTs = useWindowSize().width < 800
246
const {t} = useI18N()
247
const dd = '2-digit'
248
- return h('div', { className: 'entry-props entry-details' }, // entry-props is legacy
248
+ return h('div', { className: 'entry-details' },
249
h(CustomCode, { name: 'additionalEntryDetails', props: { entry } }),
250
entry.p?.match(entry.isFolder ? /l/i : /r/i) && hIcon('password', { className: 'miss-perm', title: t(MISSING_PERM) }),
251
h(EntrySize, { s }),
frontend/src/FilterBar.ts
+3
@@ -17,9 +17,11 @@ export function FilterBar() {
17
18
const sel = Object.keys(selected).length
19
const fil = filteredList?.length
20
+ const tabIndex = showFilter ? undefined : -1
21
return h('div', { id: 'filter-bar', className: showFilter ? 'show-sliding' : 'before-sliding' },
22
h(Checkbox, {
23
value: all,
24
+ tabIndex,
25
onContextMenu(ev) {
26
ev.preventDefault()
27
select(undefined)
@@ -34,6 +36,7 @@ export function FilterBar() {
36
placeholder: t('filter_placeholder', "Type here to filter the list below"),
37
autoComplete: 'off',
38
value: filter,
39
+ tabIndex,
40
autoFocus: true,
41
onChange(ev) {
42
setFilter(ev.target.value)