fix: sharing files with # not working

Massimo Melina committed Apr 2, 2023 at 11:46 UTC 2ac687d024f384740b053faa4d7bacc933ef02d5
4 files changed +17 -17
frontend/src/Breadcrumbs.ts
+3 -3
@@ -1,15 +1,15 @@
1 // This file is part of HFS - Copyright 2021-2023, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
2
3 -import { Link, useLocation } from 'react-router-dom'
3 +import { Link } from 'react-router-dom'
4 import { createElement as h, Fragment, ReactElement } from 'react'
5 import { getPrefixUrl, hIcon } from './misc'
6 import { state } from './state'
7 -import { reloadList } from './useFetchList'
7 +import { usePath, reloadList } from './useFetchList'
8 import { useI18N } from './i18n'
9
10 export function Breadcrumbs() {
11 const base = getPrefixUrl() + '/'
12 - const currentPath = useLocation().pathname.slice(base.length,-1)
12 + const currentPath = usePath().slice(base.length,-1)
13 const parent = base + currentPath.slice(0, currentPath.lastIndexOf('/') + 1)
14 let prev = base
15 const breadcrumbs = currentPath ? currentPath.split('/').map(x => [prev += x + '/', decodeURIComponent(x)]) : []
frontend/src/BrowseFiles.ts
+4 -8
@@ -1,6 +1,6 @@
1 // This file is part of HFS - Copyright 2021-2023, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
2
3 -import { Link, useLocation } from 'react-router-dom'
3 +import { Link } from 'react-router-dom'
4 import {
5 createElement as h,
6 Fragment,
@@ -11,22 +11,18 @@ import {
11 useRef,
12 useState
13 } from 'react'
14 -import { domOn, formatBytes, ErrorMsg, hIcon, isMobile, newDialog, hfsEvent, getHFS, wantArray } from './misc'
14 +import { domOn, formatBytes, ErrorMsg, hIcon, isMobile, newDialog, hfsEvent, getHFS } from './misc'
15 import { Checkbox, CustomCode, Spinner } from './components'
16 import { Head } from './Head'
17 import { state, useSnapState } from './state'
18 import { alertDialog } from './dialog'
19 -import useFetchList from './useFetchList'
19 +import useFetchList, { usePath } from './useFetchList'
20 import { useAuthorized } from './login'
21 import { acceptDropFiles, enqueue } from './upload'
22 import _ from 'lodash'
23 import { t, useI18N } from './i18n'
24 import { deleteFiles } from './menu'
25
26 -export function usePath() {
27 - return decodeURI(useLocation().pathname)
28 -}
29 -
26 export interface DirEntry { n:string, s?:number, m?:string, c?:string,
27 ext:string, isFolder:boolean, t?:Date } // we memoize these value for speed
28 export type DirList = DirEntry[]
@@ -182,7 +178,7 @@ const PAGE_SEPARATOR_CLASS = 'page-separator'
178
179 const Entry = memo((entry: DirEntry & { midnight: Date, separator?: string }) => {
180 let { n: relativePath, isFolder, separator } = entry
185 - const base = useLocation().pathname
181 + const base = usePath()
182 const { showFilter, selected, can_delete } = useSnapState()
183 const href = fixUrl(relativePath)
184 const containerDir = isFolder ? '' : relativePath.substring(0, relativePath.lastIndexOf('/')+1)
frontend/src/menu.ts
+3 -3
@@ -7,13 +7,13 @@ import { err2msg, ErrorMsg, hIcon, onlyTruthy, prefix, useStateMounted } from '.
7 import { loginDialog } from './login'
8 import { showOptions } from './options'
9 import showUserPanel from './UserPanel'
10 -import { useLocation, useNavigate } from 'react-router-dom'
10 +import { useNavigate } from 'react-router-dom'
11 import _ from 'lodash'
12 import { closeDialog } from '@hfs/shared/dialogs'
13 import { showUpload, uploadState } from './upload'
14 import { useSnapshot } from 'valtio'
15 import { apiCall } from './api'
16 -import { reloadList } from './useFetchList'
16 +import { reloadList, usePath } from './useFetchList'
17 import { t, useI18N } from './i18n'
18
19 export function MenuPanel() {
@@ -32,7 +32,7 @@ export function MenuPanel() {
32 setStarted1secAgo(false)
33 setTimeout(() => setStarted1secAgo(true), 1000)
34 }, [stopSearch, setStarted1secAgo])
35 - const { pathname } = useLocation()
35 + const pathname = usePath()
36
37 useEffect(() => {
38 if (!can_delete || localStorage.warn_can_delete) return
frontend/src/useFetchList.ts
+7 -3
@@ -3,17 +3,21 @@
3 import { state, useSnapState } from './state'
4 import { useEffect, useRef } from 'react'
5 import { apiEvents } from './api'
6 -import { DirEntry, DirList, usePath } from './BrowseFiles'
6 +import { DirEntry, DirList } from './BrowseFiles'
7 import _ from 'lodash'
8 import { subscribeKey } from 'valtio/utils'
9 import { useIsMounted } from 'usehooks-ts'
10 import { alertDialog } from './dialog'
11 import { ERRORS } from './misc'
12 import { t } from './i18n'
13 -import { useNavigate } from 'react-router-dom'
13 +import { useLocation, useNavigate } from 'react-router-dom'
14
15 const RELOADER_PROP = Symbol('reloader')
16
17 +export function usePath() {
18 + return useLocation().pathname
19 +}
20 +
21 export default function useFetchList() {
22 const snap = useSnapState()
23 const desiredPath = usePath()
@@ -36,7 +40,7 @@ export default function useFetchList() {
40 }
41
42 const baseParams = {
39 - path: encodeURI(desiredPath),
43 + path: desiredPath,
44 search,
45 sse: true,
46 omit: 'c',