dev: more runtime-responsive
Massimo Melina committed
Jun 16, 2023 at 12:13 UTC
42c4fa9029f82e7ba54c806143b786d45540fb2d
1 file changed
+5
-4
frontend/src/BrowseFiles.ts
+5
-4
@@ -11,7 +11,8 @@ import {
11
useRef,
12
useState
13
} from 'react'
14
-import { domOn, formatBytes, ErrorMsg, hIcon, isMobile, getHFS } from './misc'
14
+import { useWindowSize } from 'usehooks-ts'
15
+import { domOn, formatBytes, ErrorMsg, hIcon, getHFS } from './misc'
16
import { Checkbox, CustomCode, Spinner } from './components'
17
import { Head } from './Head'
18
import { DirEntry, state, useSnapState } from './state'
@@ -190,7 +191,7 @@ const Entry = memo(({ entry, midnight, separator }: EntryProps) => {
191
const ico = getEntryIcon(entry)
192
const menuOnLink = getHFS().fileMenuOnLink
193
const onClick = menuOnLink && fileMenu || undefined
193
- const mobile = isMobile()
194
+ const small = useWindowSize().width < 800
195
return h('li', { className, label: separator },
196
showFilter && h(Checkbox, {
197
value: selected[uri],
@@ -213,7 +214,7 @@ const Entry = memo(({ entry, midnight, separator }: EntryProps) => {
214
h(CustomCode, { name: 'afterEntryName', props: { entry } }),
215
h('div', { className: 'entry-panel' },
216
h(EntryDetails, { entry, midnight }),
216
- (!menuOnLink || isFolder && mobile) && h('button', { className: 'file-menu-button', onClick: fileMenu }, hIcon('menu')),
217
+ (!menuOnLink || isFolder && small) && h('button', { className: 'file-menu-button', onClick: fileMenu }, hIcon('menu')),
218
),
219
h('div'),
220
)
@@ -242,7 +243,7 @@ export function getEntryIcon(entry: DirEntry) {
243
const EntryDetails = memo(({ entry, midnight }: { entry: DirEntry, midnight: Date }) => {
244
const { t: time, s } = entry
245
const today = time && time > midnight
245
- const shortTs = isMobile()
246
+ const shortTs = useWindowSize().width < 800
247
const {t} = useI18N()
248
const dd = '2-digit'
249
return h('div', { className: 'entry-props entry-details' }, // entry-props is legacy