link to parent folder in breadcrumbs
Massimo Melina committed
Jan 11, 2022 at 00:08 UTC
c376c4167bf0e886adea85a6735b69915a3a1e3f
3 files changed
+10
-5
frontend/src/Breadcrumbs.ts
+6
-4
@@ -1,5 +1,5 @@
1
import { Link, useLocation } from 'react-router-dom'
2
-import { createElement as h, Fragment, useContext } from 'react'
2
+import { createElement as h, Fragment, ReactElement, useContext } from 'react'
3
import { ListContext } from './BrowseFiles'
4
import { confirmDialog } from './dialog'
5
import { hIcon } from './misc'
@@ -7,8 +7,10 @@ import { hIcon } from './misc'
7
export function Breadcrumbs() {
8
const currentPath = useLocation().pathname.slice(1,-1)
9
let prev = ''
10
+ const parent = currentPath.split('/').slice(0,-1).join('/')+'/'
11
const breadcrumbs = currentPath ? currentPath.split('/').map(x => [prev = prev + x + '/', decodeURIComponent(x)]) : []
12
return h(Fragment, {},
13
+ h(Breadcrumb, { label: hIcon('reply'), path: parent }),
14
h(Breadcrumb),
15
breadcrumbs.map(([path,label]) =>
16
h(Breadcrumb, {
@@ -20,9 +22,9 @@ export function Breadcrumbs() {
22
)
23
}
24
23
-function Breadcrumb({ path, label, current }:{ current: boolean, path?: string, label?: string }) {
24
- const PAD = '\u00A0' // make small elements easier to tap. Don't use min-width 'cause it requires display-inline that breaks word-wrapping
25
- if (label && label.length < 3)
25
+function Breadcrumb({ path, label, current }:{ current?: boolean, path?: string, label?: string | ReactElement }) {
26
+ const PAD = '\u00A0\u00A0' // make small elements easier to tap. Don't use min-width 'cause it requires display-inline that breaks word-wrapping
27
+ if (typeof label === 'string' && label.length < 3)
28
label = PAD+label+PAD
29
const { reload } = useContext(ListContext)
30
return h(Link, {
frontend/src/index.scss
+3
@@ -111,6 +111,9 @@ header {
111
border-top: 1px solid #666;
112
margin-right: -0.1em;
113
}
114
+.breadcrumb:nth-child(-n+3) .icon {
115
+ padding: 0 0.2em;
116
+}
117
#folder-stats {
118
font-size: 90%;
119
margin: 0.4em 0 0 0.5em;
todo.md
+1
-1
@@ -3,6 +3,7 @@
3
- update tests to SRP login
4
- anti-csrf
5
- upload
6
+- delete
7
- https
8
- updater (stop,unzip,start)
9
- search and login dialogs should push to history so that mobile can use back button to close them
@@ -12,7 +13,6 @@
13
- config: bans
14
- config: min disk space
15
- thumbnails support
15
-- link to parent folder in the list (as an option of the frontend? plugin?)
16
- archive for search results
17
- archive only selected files
18
- webdav?