diff --git a/CHANGELOG.md b/CHANGELOG.md index 2f16d44f..ce15d93f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ - [#705](https://github.com/estruyf/vscode-front-matter/issues/705): UX improvements for the panel view - [#887](https://github.com/estruyf/vscode-front-matter/issues/887): Added new `frontMatter.global.timezone` setting, by default it is set to `UTC` for date formatting - [#888](https://github.com/estruyf/vscode-front-matter/issues/888): Added the ability to prompt GitHub Copilot from a custom script/action +- [#892](https://github.com/estruyf/vscode-front-matter/issues/892): Added media folder common actions ### 🐞 Fixes diff --git a/l10n/bundle.l10n.json b/l10n/bundle.l10n.json index 929dc82e..2be9bf0a 100644 --- a/l10n/bundle.l10n.json +++ b/l10n/bundle.l10n.json @@ -247,6 +247,7 @@ "dashboard.media.folderItem.contentDirectory": "Content directory", "dashboard.media.folderItem.publicDirectory": "Public directory", + "dashboard.media.folderItem.deleteDescription": "Are you sure you want to delete the folder ({0})?", "dashboard.media.item.buttom.insert.image": "Insert image", "dashboard.media.item.buttom.insert.snippet": "Insert snippet", @@ -775,6 +776,9 @@ "listeners.dashboard.dashboardListener.pinItem.coundNotPin.error": "Could not pin item.", "listeners.dashboard.dashboardListener.pinItem.coundNotUnPin.error": "Could not unpin item.", + "listeners.dashboard.mediaListeners.deleteMediaFolder.progress.title": "Deleting folder...", + "listeners.dashboard.mediaListeners.updateMediaFolder.progress.title": "Updating folder...", + "listeners.dashboard.settingsListener.triggerTemplate.notification": "Template files copied.", "listeners.dashboard.settingsListener.triggerTemplate.progress.title": "Downloading and initializing the template...", "listeners.dashboard.settingsListener.triggerTemplate.download.error": "Failed to download the template.", diff --git a/src/dashboardWebView/DashboardMessage.ts b/src/dashboardWebView/DashboardMessage.ts index 0cdce18f..4fd51a9d 100644 --- a/src/dashboardWebView/DashboardMessage.ts +++ b/src/dashboardWebView/DashboardMessage.ts @@ -42,6 +42,8 @@ export enum DashboardMessage { insertMedia = 'insertMedia', updateMediaMetadata = 'updateMediaMetadata', createMediaFolder = 'createMediaFolder', + updateMediaFolder = 'updateMediaFolder', + deleteMediaFolder = 'deleteMediaFolder', insertFile = 'insertFile', createHexoAssetFolder = 'createHexoAssetFolder', getUnmappedMedia = 'getUnmappedMedia', diff --git a/src/dashboardWebView/components/Media/FolderItem.tsx b/src/dashboardWebView/components/Media/FolderItem.tsx index e0b1b0d4..402f6bab 100644 --- a/src/dashboardWebView/components/Media/FolderItem.tsx +++ b/src/dashboardWebView/components/Media/FolderItem.tsx @@ -1,9 +1,14 @@ -import { FolderIcon } from '@heroicons/react/24/solid'; +import { FolderIcon, PencilIcon, TrashIcon } from '@heroicons/react/24/solid'; import { basename, join } from 'path'; import * as React from 'react'; -import * as l10n from '@vscode/l10n'; -import { LocalizationKey } from '../../../localization'; +import { LocalizationKey, localize } from '../../../localization'; import useMediaFolder from '../../hooks/useMediaFolder'; +import { QuickAction } from '../Menu'; +import { messageHandler } from '@estruyf/vscode/dist/client'; +import { DashboardMessage } from '../../DashboardMessage'; +import { useState } from 'react'; +import { Alert } from '../Modals/Alert'; +import { parseWinPath } from '../../../helpers/parseWinPath'; export interface IFolderItemProps { folder: string; @@ -17,6 +22,7 @@ export const FolderItem: React.FunctionComponent = ({ staticFolder }: React.PropsWithChildren) => { const { updateFolder } = useMediaFolder(); + const [showAlert, setShowAlert] = useState(false); const relFolderPath = wsFolder ? folder.replace(wsFolder, '') : folder; @@ -25,28 +31,73 @@ export const FolderItem: React.FunctionComponent = ({ [relFolderPath, staticFolder] ); + const updateFolderName = React.useCallback(() => { + messageHandler.send(DashboardMessage.updateMediaFolder, { folder, wsFolder, staticFolder }) + }, []); + + const onDelete = React.useCallback(() => { + setShowAlert(true); + }, []); + + const confirmDeletion = React.useCallback(() => { + messageHandler.send(DashboardMessage.deleteMediaFolder, { folder }); + setShowAlert(false); + }, [folder]); + return ( -
  • - -
  • + + + {!isContentFolder && ( +
    + + + + + +
    + )} + + + {showAlert && ( + setShowAlert(false)} + trigger={confirmDeletion} + /> + )} + ); }; diff --git a/src/dashboardWebView/components/Media/FooterActions.tsx b/src/dashboardWebView/components/Media/FooterActions.tsx index 3782b56f..1346e3b7 100644 --- a/src/dashboardWebView/components/Media/FooterActions.tsx +++ b/src/dashboardWebView/components/Media/FooterActions.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; -import * as l10n from '@vscode/l10n'; import { QuickAction } from '../Menu'; -import { LocalizationKey } from '../../../localization'; +import { LocalizationKey, localize } from '../../../localization'; import { ClipboardIcon, CodeBracketIcon, EyeIcon, PencilIcon, PlusIcon, TrashIcon } from '@heroicons/react/24/solid'; import { useRecoilState } from 'recoil'; import { SelectedItemActionAtom } from '../../state'; @@ -36,25 +35,25 @@ export const FooterActions: React.FunctionComponent = ({ return (
    setSelectedItemAction({ path: media.fsPath, action: 'view' })}> setSelectedItemAction({ path: media.fsPath, action: 'edit' })}> {viewData?.filePath ? ( @@ -62,8 +61,8 @@ export const FooterActions: React.FunctionComponent = ({ = ({ {viewData?.position && snippets.length > 0 && (