fix(ui): use pushState for folder navigation in public share links
All checks were successful
Automated Container Build / build-and-push (push) Successful in 36s
All checks were successful
Automated Container Build / build-and-push (push) Successful in 36s
This commit is contained in:
parent
e00fac24cb
commit
755c791af5
1 changed files with 26 additions and 3 deletions
|
|
@ -26,6 +26,29 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
|
|||
const [fileInfo, setFileInfo] = useState<FileInfo | null>(null);
|
||||
const [currentPath, setCurrentPath] = useState('');
|
||||
|
||||
useEffect(() => {
|
||||
const handlePopState = (e: PopStateEvent) => {
|
||||
if (e.state && e.state.path !== undefined) {
|
||||
setCurrentPath(e.state.path);
|
||||
} else {
|
||||
setCurrentPath(new URLSearchParams(window.location.search).get('path') || '');
|
||||
}
|
||||
};
|
||||
window.addEventListener('popstate', handlePopState);
|
||||
|
||||
// Initial sync
|
||||
const urlPath = new URLSearchParams(window.location.search).get('path');
|
||||
if (urlPath && urlPath !== currentPath) {
|
||||
setCurrentPath(urlPath);
|
||||
}
|
||||
return () => window.removeEventListener('popstate', handlePopState);
|
||||
}, []);
|
||||
|
||||
const navigateTo = (path: string) => {
|
||||
setCurrentPath(path);
|
||||
window.history.pushState({ path }, '', path ? `?path=${encodeURIComponent(path)}` : window.location.pathname);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (lockoutTime <= 0) return;
|
||||
const timer = setInterval(() => {
|
||||
|
|
@ -199,7 +222,7 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
|
|||
{fileInfo?.is_dir && (
|
||||
<div className="flex items-center justify-between mb-8 pb-6 border-b border-white/10">
|
||||
<div className="flex items-center gap-2 text-white/80 overflow-x-auto whitespace-nowrap scrollbar-hide">
|
||||
<button onClick={() => setCurrentPath('')} className="hover:text-white transition-colors flex items-center gap-2">
|
||||
<button onClick={() => navigateTo('')} className="hover:text-white transition-colors flex items-center gap-2">
|
||||
<Home className="w-5 h-5" />
|
||||
<span className="font-medium">Shared Folder</span>
|
||||
</button>
|
||||
|
|
@ -209,7 +232,7 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
|
|||
<div key={pathToHere} className="flex items-center gap-2">
|
||||
<ChevronRight className="w-4 h-4 text-white/40" />
|
||||
<button
|
||||
onClick={() => setCurrentPath(pathToHere)}
|
||||
onClick={() => navigateTo(pathToHere)}
|
||||
className="hover:text-white transition-colors font-medium truncate max-w-[150px]"
|
||||
>
|
||||
{part}
|
||||
|
|
@ -292,7 +315,7 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
|
|||
className={`group transition-colors ${f.is_dir ? 'cursor-pointer hover:bg-white/5' : 'hover:bg-white/5'}`}
|
||||
onClick={() => {
|
||||
if (f.is_dir) {
|
||||
setCurrentPath(currentPath ? `${currentPath}/${f.name}` : f.name);
|
||||
navigateTo(currentPath ? `${currentPath}/${f.name}` : f.name);
|
||||
}
|
||||
}}
|
||||
>
|
||||
|
|
|
|||
Reference in a new issue