diff --git a/packages/pl-api/lib/client.ts b/packages/pl-api/lib/client.ts index 55bd5011d..8d0f1089f 100644 --- a/packages/pl-api/lib/client.ts +++ b/packages/pl-api/lib/client.ts @@ -5906,7 +5906,7 @@ class PlApiClient { const response = await this.request('/api/iceshrimp/drive/folder', { method: 'POST', - body: { name, parentId }, + body: { name, parentId: parentId || null }, }); return v.parse(driveFolderSchema, response.json); diff --git a/packages/pl-fe/src/locales/en.json b/packages/pl-fe/src/locales/en.json index c6136e7f1..a331b2af1 100644 --- a/packages/pl-fe/src/locales/en.json +++ b/packages/pl-fe/src/locales/en.json @@ -738,12 +738,18 @@ "drive.file.upload.error": "Failed to upload file.", "drive.file.upload.success": "File uploaded successfully.", "drive.file.view": "View file", + "drive.folder.create": "Create new folder", + "drive.folder.create.confirm": "Create", "drive.folder.delete": "Delete folder", "drive.folder.delete.confirm": "Delete", "drive.folder.delete.error": "Failed to delete folder.", "drive.folder.delete.success": "Folder deleted successfully.", "drive.folder.delete.text": "Are you sure you want to delete this folder? This action cannot be undone.", "drive.folder.dropdown": "Folder menu", + "drive.folder.new": "New folder", + "drive.folder.new.error": "Failed to create folder.", + "drive.folder.new.placeholder": "Folder name", + "drive.folder.new.success": "Folder created successfully.", "drive.folder.rename": "Rename folder", "drive.folder.rename.confirm": "Rename", "drive.folder.rename.error": "Failed to rename folder.", diff --git a/packages/pl-fe/src/pages/drive/drive.tsx b/packages/pl-fe/src/pages/drive/drive.tsx index d5cd89a3d..6c55ee0d5 100644 --- a/packages/pl-fe/src/pages/drive/drive.tsx +++ b/packages/pl-fe/src/pages/drive/drive.tsx @@ -12,7 +12,7 @@ import IconButton from 'pl-fe/components/ui/icon-button'; import { MIMETYPE_ICONS } from 'pl-fe/components/upload'; import ColumnLoading from 'pl-fe/features/ui/components/column-loading'; import { useCreateDriveFileMutation, useDeleteDriveFileMutation, useUpdateDriveFileMutation } from 'pl-fe/queries/drive/use-drive-file'; -import { useDeleteDriveFolderMutation, useDriveFolderQuery, useUpdateDriveFolderMutation } from 'pl-fe/queries/drive/use-drive-folder'; +import { useCreateDriveFolderMutation, useDeleteDriveFolderMutation, useDriveFolderQuery, useUpdateDriveFolderMutation } from 'pl-fe/queries/drive/use-drive-folder'; import { useModalsActions } from 'pl-fe/stores/modals'; import toast from 'pl-fe/toast'; import { download } from 'pl-fe/utils/download'; @@ -54,6 +54,10 @@ const messages = defineMessages({ fileUpload: { id: 'drive.file.upload', defaultMessage: 'Upload file' }, fileUploadSuccess: { id: 'drive.file.upload.success', defaultMessage: 'File uploaded successfully.' }, fileUploadError: { id: 'drive.file.upload.error', defaultMessage: 'Failed to upload file.' }, + newFolder: { id: 'drive.folder.new', defaultMessage: 'New folder' }, + newFolderPlaceholder: { id: 'drive.folder.new.placeholder', defaultMessage: 'Folder name' }, + newFolderSuccess: { id: 'drive.folder.new.success', defaultMessage: 'Folder created successfully.' }, + newFolderError: { id: 'drive.folder.new.error', defaultMessage: 'Failed to create folder.' }, }); interface IFile { @@ -348,8 +352,11 @@ interface IDrivePage { const DrivePage: React.FC = ({ params }) => { const intl = useIntl(); + const { openModal } = useModalsActions(); + const { data, isPending } = useDriveFolderQuery(params?.folderId); const { mutate: uploadFile } = useCreateDriveFileMutation(params?.folderId); + const { mutate: createFolder } = useCreateDriveFolderMutation(); const items: Menu = [ { @@ -362,6 +369,24 @@ const DrivePage: React.FC = ({ params }) => { }); }, }, + { + text: intl.formatMessage(messages.newFolder), + icon: require('@phosphor-icons/core/regular/folder-plus.svg'), + action: () => { + openModal('TEXT_FIELD', { + heading: , + placeholder: intl.formatMessage(messages.newFolderPlaceholder), + confirm: , + singleLine: true, + onConfirm: (value: string) => { + createFolder({ name: value, parentId: params?.folderId }, { + onSuccess: () => toast.success(messages.newFolderSuccess), + onError: () => toast.error(messages.newFolderError), + }); + }, + }); + }, + }, ]; if (isPending) {