mirror of
https://github.com/truewhile/MeBox.git
synced 2026-09-29 03:26:37 +08:00
move file manager parent navigation
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from 'react'
|
||||
import { ChevronUp } from 'lucide-react'
|
||||
import { ChevronUp, Home } from 'lucide-react'
|
||||
|
||||
import { filesAPI, type FileEntry, type FileListing } from '../api/files'
|
||||
import { libraryAPI } from '../api/library'
|
||||
@@ -89,10 +89,7 @@ export function FileManagerPage() {
|
||||
|
||||
<FileManagerToolbar
|
||||
currentPath={data?.path}
|
||||
parentPath={data?.parent}
|
||||
recursive={recursive}
|
||||
onRoot={() => setPath('')}
|
||||
onParent={setPath}
|
||||
onRefresh={refresh}
|
||||
onRecursiveChange={setRecursive}
|
||||
/>
|
||||
@@ -166,16 +163,28 @@ export function FileManagerPage() {
|
||||
<FileBrowserRoots roots={data.roots} onOpen={setPath} />
|
||||
)}
|
||||
|
||||
{!loading && data?.path && data.parent && (
|
||||
{!loading && data?.path && (
|
||||
<div className="flex flex-wrap items-center justify-between gap-3 rounded-lg border border-[var(--app-border)] bg-[var(--app-surface)] px-3 py-2 shadow-sm">
|
||||
<button
|
||||
className="inline-flex h-9 items-center gap-2 rounded-lg border border-[var(--app-border)] bg-[var(--app-surface-strong)] px-3 text-sm font-medium text-[var(--app-text)] transition hover:border-primary-400/50 hover:text-primary-500"
|
||||
onClick={() => setPath(data.parent || '')}
|
||||
title="返回上级目录"
|
||||
>
|
||||
<ChevronUp size={16} />
|
||||
上一级
|
||||
</button>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<button
|
||||
className="inline-flex h-9 items-center gap-2 rounded-lg border border-[var(--app-border)] bg-[var(--app-surface-strong)] px-3 text-sm font-medium text-[var(--app-text)] transition hover:border-primary-400/50 hover:text-primary-500"
|
||||
onClick={() => setPath('')}
|
||||
title="返回根列表"
|
||||
>
|
||||
<Home size={16} />
|
||||
根
|
||||
</button>
|
||||
{data.parent && (
|
||||
<button
|
||||
className="inline-flex h-9 items-center gap-2 rounded-lg border border-[var(--app-border)] bg-[var(--app-surface-strong)] px-3 text-sm font-medium text-[var(--app-text)] transition hover:border-primary-400/50 hover:text-primary-500"
|
||||
onClick={() => setPath(data.parent || '')}
|
||||
title="返回上级目录"
|
||||
>
|
||||
<ChevronUp size={16} />
|
||||
上一级
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<span className="min-w-0 flex-1 truncate text-right font-mono text-xs text-[var(--app-muted)]" title={data.path}>
|
||||
{data.path}
|
||||
</span>
|
||||
|
||||
@@ -1,34 +1,20 @@
|
||||
import { ChevronUp, Home, RefreshCw } from 'lucide-react'
|
||||
import { RefreshCw } from 'lucide-react'
|
||||
|
||||
type FileManagerToolbarProps = {
|
||||
currentPath?: string
|
||||
parentPath?: string
|
||||
recursive: boolean
|
||||
onRoot: () => void
|
||||
onParent: (path: string) => void
|
||||
onRefresh: () => void
|
||||
onRecursiveChange: (value: boolean) => void
|
||||
}
|
||||
|
||||
export function FileManagerToolbar({
|
||||
currentPath,
|
||||
parentPath,
|
||||
recursive,
|
||||
onRoot,
|
||||
onParent,
|
||||
onRefresh,
|
||||
onRecursiveChange,
|
||||
}: FileManagerToolbarProps) {
|
||||
return (
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<button className="neon-button !px-3 !py-1 !text-xs" onClick={onRoot} title="返回根列表">
|
||||
<Home size={14} /> 根
|
||||
</button>
|
||||
{parentPath && (
|
||||
<button className="neon-button !px-3 !py-1 !text-xs" onClick={() => onParent(parentPath)}>
|
||||
<ChevronUp size={14} /> 上一级
|
||||
</button>
|
||||
)}
|
||||
<button className="neon-button !px-3 !py-1 !text-xs" onClick={onRefresh}>
|
||||
<RefreshCw size={14} /> 刷新
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user