css class 'cant-open' for better customization
Massimo Melina committed
Apr 10, 2023 at 23:50 UTC
aa33f10f356f021e072384ac34b7162253eb9347
2 files changed
+11
-7
dev-plugins.md
+3
-1
@@ -185,7 +185,7 @@ This is a list of available frontend-events, with respective object parameter an
185
- output `Html`
186
- `afterEntryName`
187
- you receive each entry of the list, and optionally produce HTML code that will be added after the name of the entry.
188
- - parameter `{ entry: Entry }` (refer above for Entry object)
188
+ - parameter `{ entry: Entry, cantOpen: boolean }` (refer above for Entry object)
189
- output `Html`
190
- `beforeHeader` & `afterHeader`
191
- use this to produce content that should go right before/after the `header` part
@@ -225,6 +225,8 @@ HFS will scan through them in inverted alphabetical order searching for a compat
225
226
## API version history
227
228
+- 8.1 (v0.44.0)
229
+ - afterEntryname.cantOpen
230
- 8 (v0.43.0)
231
- entry.name & .uri
232
- tools.dialogLib
frontend/src/BrowseFiles.ts
+8
-6
@@ -184,8 +184,11 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
184
const base = usePath()
185
const [menuBtn, setMenuBtn] = useState(false)
186
const { showFilter, selected, can_delete } = useSnapState()
187
+ const cantOpen = entry.p?.includes(isFolder ? 'l' : 'r') // to open we need list for folders and read for files
188
const containerDir = isFolder ? '' : uri.substring(0, uri.lastIndexOf('/')+1)
189
let className = isFolder ? 'folder' : 'file'
190
+ if (cantOpen)
191
+ className += ' cant-open'
192
if (separator)
193
className += ' ' + PAGE_SEPARATOR_CLASS
194
const ico = hIcon(isFolder ? 'folder' : 'file')
@@ -214,7 +217,7 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
217
containerDir && h(Link, { to: base + containerDir, className:'container-folder' }, ico, pathDecode(containerDir) ),
218
h('a', { href: uri, onClick }, !containerDir && ico, name)
219
),
217
- h(CustomCode, { name: 'afterEntryName', props: { entry } }),
220
+ h(CustomCode, { name: 'afterEntryName', props: { entry, cantOpen } }),
221
h('div', { className: 'entry-panel' },
222
h(EntryProps, entry),
223
(!menuOnLink || isFolder && mobile) && h('button', { className: 'file-menu-button', onClick: openFileMenu }, hIcon('menu')),
@@ -225,15 +228,14 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
228
function openFileMenu(ev: MouseEvent) {
229
if (ev.altKey || ev.ctrlKey || ev.metaKey) return
230
ev.preventDefault()
231
+ const cantDownload = cantOpen || isFolder && entry.p?.includes('r') // folders needs both list and read
232
const OPEN_ICON = 'play'
233
const OPEN_LABEL = t('file_open', "Open")
230
- const couldOpen = !entry.p?.includes(isFolder ? 'l' : 'r') // to open we need list for folders and read for files
231
- const couldDownload = !entry.p?.includes('r') && (!isFolder || !entry.p?.includes('l')) // folders needs list as well
234
const menu = [
233
- menuOnLink && couldOpen && (
235
+ menuOnLink && !cantOpen && (
236
isFolder ? h(Link, { to: base + uri, onClick: () => close() }, hIcon(OPEN_ICON), OPEN_LABEL)
237
: { label: OPEN_LABEL, href: uri, target: isFolder ? undefined : '_blank', icon: OPEN_ICON }),
236
- couldDownload && { label: t`Download`, href: uri + (isFolder ? '?get=zip' : '?dl'), icon: 'download' },
238
+ !cantDownload && { label: t`Download`, href: uri + (isFolder ? '?get=zip' : '?dl'), icon: 'download' },
239
can_delete && { label: t`Delete`, icon: 'trash', onClick: () => deleteFiles([uri], base) }
240
]
241
const props = [
@@ -257,7 +259,7 @@ const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) =>
259
: null
260
))
261
),
260
- !couldOpen && h(Fragment, {}, hIcon('password', { style: { marginRight: '.5em' } }), t(MISSING_PERM)),
262
+ !cantOpen && h(Fragment, {}, hIcon('password', { style: { marginRight: '.5em' } }), t(MISSING_PERM)),
263
h('div', { className: 'file-menu' },
264
dontBotherWithKeys(menu.map((e: any, i) =>
265
isValidElement(e) ? e