GithubBackup/Foxel
1
0
Fork 0
mirror of https://github.com/DrizzleTime/Foxel.git synced 2026-05-07 07:22:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(Header): add upload folder option to the upload menu

Browse Source
This commit is contained in:
shiyu
2026-03-09 16:44:03 +08:00
parent 066bd67273
commit 072ccea5be
1 changed files with 32 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
web/src/pages/FileExplorerPage/components/Header.tsx
View File

@@ -145,6 +145,12 @@ export const Header: React.FC<HeaderProps> = ({
icon: <FileAddOutlined />,
onClick: onCreateFile,
},
{
key: 'upload-folder',
label: t('Upload Folder'),
icon: <UploadOutlined />,
onClick: onUploadDirectory,
},
{
key: 'sort',
label: t('Sort By') + `: ${t(sortBy === 'mtime' ? 'Modified Time' : sortBy === 'size' ? 'Size' : 'Name')}`,
@@ -162,6 +168,20 @@ export const Header: React.FC<HeaderProps> = ({
},
];
const uploadMenu = {
items: [
{ key: 'file', label: t('Upload Files') },
{ key: 'folder', label: t('Upload Folder') },
],
onClick: ({ key }: { key: string }) => {
if (key === 'folder') {
onUploadDirectory();
} else {
onUploadFile();
}
},
};
return (
<Flex vertical={isMobile} gap={isMobile ? 10 : 12} style={{ padding: isMobile ? '10px 12px' : '10px 16px', borderBottom: `1px solid ${token.colorBorderSecondary}` }}>
<Flex align="center" gap={8} style={{ minWidth: 0 }}>
@@ -179,26 +199,18 @@ export const Header: React.FC<HeaderProps> = ({
<Button size="small" icon={<PlusOutlined />} onClick={onCreateDir} aria-label={t('New Folder')}>
{!isMobile && t('New Folder')}
</Button>
<Dropdown.Button
size="small"
icon={<UploadOutlined />}
onClick={onUploadFile}
menu={{
items: [
{ key: 'file', label: t('Upload Files') },
{ key: 'folder', label: t('Upload Folder') },
],
onClick: ({ key }) => {
if (key === 'folder') {
onUploadDirectory();
} else {
onUploadFile();
}
},
}}
>
{!isMobile && t('Upload')}
</Dropdown.Button>
{isMobile ? (
<Button size="small" icon={<UploadOutlined />} onClick={onUploadFile} aria-label={t('Upload Files')} />
) : (
<Dropdown.Button
size="small"
icon={<UploadOutlined />}
onClick={onUploadFile}
menu={uploadMenu}
>
{t('Upload')}
</Dropdown.Button>
)}
{isMobile && (
<Dropdown menu={{ items: mobileMoreItems }}>
<Button size="small" icon={<MoreOutlined />} aria-label={t('More')} />