#517 - Added frontMatter.panel.actions.disabled setting to define which actions should be hidden

This commit is contained in:
Elio Struyf
2023-10-04 13:37:30 +02:00
parent 93a6df85dd
commit ed00f8f60e
11 changed files with 109 additions and 107 deletions
+1
View File
@@ -13,6 +13,7 @@
### 🎨 Enhancements
- [#517](https://github.com/estruyf/vscode-front-matter/issues/517): Add `contentTypes` property to custom scripts to show/hide custom actions
- [#517](https://github.com/estruyf/vscode-front-matter/issues/517): Added `frontMatter.panel.actions.disabled` setting to define which actions should be hidden
- [#638](https://github.com/estruyf/vscode-front-matter/issues/638): Add Hexo support for the `_drafts` folder
- [#659](https://github.com/estruyf/vscode-front-matter/issues/659): Implement a filter for the taxonomy dashboard
- [#662](https://github.com/estruyf/vscode-front-matter/issues/662): Always show the `all articles` tab with the page counter
-1
View File
@@ -377,7 +377,6 @@
"panel.baseView.initialize": "Initialize project",
"panel.baseView.actions.title": "Actions",
"panel.baseView.action.openDashboard": "Open dashboard",
"panel.baseView.action.openPreview": "Open preview",
"panel.baseView.action.createContent": "Create content",
"panel.baseView.empty": "Open a file to see more actions",
+1
View File
@@ -46,6 +46,7 @@ export const SETTING_TEMPLATES_ENABLED = 'templates.enabled';
export const SETTING_TELEMETRY_DISABLE = 'telemetry.disable';
export const SETTING_PANEL_FREEFORM = 'panel.freeform';
export const SETTING_PANEL_ACTIONS_DISABLED = 'panel.actions.disabled';
export const SETTING_PREVIEW_HOST = 'preview.host';
export const SETTING_PREVIEW_PATHNAME = 'preview.pathName';
+8 -2
View File
@@ -1,4 +1,8 @@
import { SETTING_SPONSORS_AI_ENABLED, SETTING_WEBSITE_URL } from './../constants/settings';
import {
SETTING_PANEL_ACTIONS_DISABLED,
SETTING_SPONSORS_AI_ENABLED,
SETTING_WEBSITE_URL
} from './../constants/settings';
import { workspace } from 'vscode';
import { ContentType, Extension, Settings, TaxonomyHelper } from '.';
import { Dashboard } from '../commands/Dashboard';
@@ -38,6 +42,7 @@ import {
DraftField,
FieldGroup,
PanelSettings as IPanelSettings,
PanelAction,
ScriptType,
TaxonomyType
} from '../models';
@@ -97,7 +102,8 @@ export class PanelSettings {
dataTypes: Settings.get<DataType[]>(SETTING_DATA_TYPES),
fieldGroups: Settings.get<FieldGroup[]>(SETTING_TAXONOMY_FIELD_GROUPS),
contentFolders: Folders.get(),
websiteUrl: Settings.get<string>(SETTING_WEBSITE_URL) || ''
websiteUrl: Settings.get<string>(SETTING_WEBSITE_URL) || '',
disabledActions: Settings.get<PanelAction[]>(SETTING_PANEL_ACTIONS_DISABLED) || []
};
}
+1 -1
View File
@@ -10,7 +10,7 @@ export default function useContentType(
const [contentType, setContentType] = useState<ContentType | null>(null);
useEffect(() => {
if (settings) {
if (settings && metadata) {
let contentTypeName = DEFAULT_CONTENT_TYPE_NAME;
if (metadata?.type) {
-4
View File
@@ -1208,10 +1208,6 @@ export enum LocalizationKey {
* Open dashboard
*/
panelBaseViewActionOpenDashboard = 'panel.baseView.action.openDashboard',
/**
* Open preview
*/
panelBaseViewActionOpenPreview = 'panel.baseView.action.openPreview',
/**
* Create content
*/
+10
View File
@@ -31,8 +31,18 @@ export interface PanelSettings {
aiEnabled: boolean;
contentFolders: ContentFolder[];
websiteUrl: string;
disabledActions: PanelAction[];
}
export type PanelAction =
| 'openDashboard'
| 'createContent'
| 'optimizeSlug'
| 'preview'
| 'openOnWebsite'
| 'startStopServer'
| 'customActions';
export interface FieldGroup {
id: string;
labelField?: string;
+1 -1
View File
@@ -134,7 +134,7 @@ export const ViewPanel: React.FunctionComponent<IViewPanelProps> = (
)}
{settings && metadata && (
<FeatureFlag features={mode?.features || []} flag={FEATURE_FLAG.panel.actions}>
<Actions metadata={metadata} settings={settings} />
<Actions metadata={metadata} settings={settings} scripts={settings.scripts} />
</FeatureFlag>
)}
+82 -27
View File
@@ -1,5 +1,5 @@
import * as React from 'react';
import { PanelSettings } from '../../models/PanelSettings';
import { PanelSettings, CustomScript as ICustomScript } from '../../models';
import { Collapsible } from './Collapsible';
import { CustomScript } from './CustomScript';
import { Preview } from './Preview';
@@ -9,59 +9,114 @@ import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../localization';
import { OpenOnWebsiteAction } from './Actions/OpenOnWebsiteAction';
import useContentType from '../../hooks/useContentType';
import { messageHandler } from '@estruyf/vscode/dist/client';
import { CommandToCode } from '../CommandToCode';
export interface IActionsProps {
metadata: any;
metadata?: any;
settings: PanelSettings;
scripts?: ICustomScript[];
}
const Actions: React.FunctionComponent<IActionsProps> = ({
metadata,
settings
settings,
scripts = []
}: React.PropsWithChildren<IActionsProps>) => {
const contentType = useContentType(settings, metadata);
const disableActions = settings.disabledActions || [];
const openDashboard = () => {
messageHandler.send(CommandToCode.openDashboard);
};
const createContent = () => {
messageHandler.send(CommandToCode.createContent);
};
const actions = React.useMemo(() => {
let allActions: JSX.Element[] = [];
let scripts = settings.scripts || [];
if (contentType?.name) {
scripts = scripts.filter((script) => {
if (script.contentTypes && script.contentTypes.length > 0) {
return script.contentTypes.includes(contentType.name);
}
return true;
});
if (!disableActions.includes(`openDashboard`)) {
allActions.push(
<button
title={l10n.t(LocalizationKey.panelBaseViewActionOpenDashboard)}
onClick={openDashboard}
type={`button`}>
{l10n.t(LocalizationKey.panelBaseViewActionOpenDashboard)}
</button>
);
}
allActions = scripts.map((value, idx) => (
<CustomScript key={value?.title?.replace(/ /g, '') || idx} {...value} />
))
if (metadata?.title && !disableActions.includes(`optimizeSlug`)) {
allActions.push(<SlugAction key="optimizeSlug" />);
}
if (settings?.preview?.host && !disableActions.includes(`preview`)) {
if ((metadata && metadata.slug) || !metadata) {
allActions.push(<Preview key="preview" />);
}
}
if (!disableActions.includes(`openOnWebsite`) && metadata?.slug) {
allActions.push(<OpenOnWebsiteAction key="openOnWebsite" baseUrl={settings.websiteUrl} slug={metadata.slug} />);
}
if (!disableActions.includes(`startStopServer`)) {
allActions.push(<StartServerButton key="startStopServer" settings={settings} />);
}
if (!disableActions.includes(`createContent`)) {
allActions.push(
<button
title={l10n.t(LocalizationKey.panelBaseViewActionCreateContent)}
onClick={createContent}
type={`button`}>
{l10n.t(LocalizationKey.panelBaseViewActionCreateContent)}
</button>
);
}
return allActions;
}, [settings.scripts, contentType]);
}, [metadata, settings, disableActions]);
if (!metadata || Object.keys(metadata).length === 0 || !settings) {
const customActions = React.useMemo(() => {
let allActions: JSX.Element[] = [];
if (!disableActions.includes(`customActions`)) {
if (contentType?.name) {
scripts = scripts.filter((script) => {
if (script.contentTypes && script.contentTypes.length > 0) {
return script.contentTypes.includes(contentType.name);
}
return true;
});
}
allActions = scripts.map((value, idx) => (
<CustomScript key={value?.title?.replace(/ /g, '') || idx} {...value} />
))
}
return allActions;
}, [scripts, contentType, disableActions]);
if (!settings || (customActions.length === 0 && actions.length === 0)) {
return null;
}
return (
<Collapsible id={`actions`} title={l10n.t(LocalizationKey.panelActionsTitle)}>
<div className={`article__actions`}>
{metadata && metadata.title && <SlugAction />}
{...actions}
{settings?.preview?.host && <Preview slug={metadata.slug} />}
<OpenOnWebsiteAction baseUrl={settings.websiteUrl} slug={metadata.slug} />
<StartServerButton settings={settings} />
{settings && settings.scripts && settings.scripts.length > 0 && (
{customActions?.length > 0 && (
<>
<div className="divider py-4 w-full" style={{ height: `1px` }}></div>
{actions?.length > 0 && <div className="divider py-4 w-full" style={{ height: `1px` }}></div>}
{...actions}
{...customActions}
</>
)}
</div>
+3 -61
View File
@@ -1,20 +1,17 @@
import * as React from 'react';
import { CustomScript, FolderInfo, Mode, PanelSettings } from '../../models';
import { CommandToCode } from '../CommandToCode';
import { Collapsible } from './Collapsible';
import { FolderInfo, Mode, PanelSettings } from '../../models';
import { GlobalSettings } from './GlobalSettings';
import { OtherActions } from './OtherActions';
import { FolderAndFiles } from './FolderAndFiles';
import { SponsorMsg } from './SponsorMsg';
import { StartServerButton } from './StartServerButton';
import { FeatureFlag } from '../../components/features/FeatureFlag';
import { FEATURE_FLAG } from '../../constants/Features';
import { Messenger } from '@estruyf/vscode/dist/client';
import { GitAction } from './Git/GitAction';
import { useMemo } from 'react';
import * as l10n from "@vscode/l10n"
import { LocalizationKey } from '../../localization';
import { InitializeAction } from './InitializeAction';
import { Actions } from './Actions';
export interface IBaseViewProps {
settings: PanelSettings | undefined;
@@ -27,25 +24,6 @@ const BaseView: React.FunctionComponent<IBaseViewProps> = ({
folderAndFiles,
mode
}: React.PropsWithChildren<IBaseViewProps>) => {
const openDashboard = () => {
Messenger.send(CommandToCode.openDashboard);
};
const createContent = () => {
Messenger.send(CommandToCode.createContent);
};
const openPreview = () => {
Messenger.send(CommandToCode.openPreview);
};
const runBulkScript = (script: CustomScript) => {
Messenger.send(CommandToCode.runCustomScript, {
title: script.title,
script
});
};
const customActions: any[] = (settings?.scripts || []).filter(
(s) => s.bulk && (s.type === 'content' || !s.type)
);
@@ -83,43 +61,7 @@ const BaseView: React.FunctionComponent<IBaseViewProps> = ({
</FeatureFlag>
<FeatureFlag features={mode?.features || []} flag={FEATURE_FLAG.panel.actions}>
<Collapsible id={`base_actions`} title={l10n.t(LocalizationKey.panelBaseViewActionsTitle)}>
<div className={`base__actions`}>
<button
title={l10n.t(LocalizationKey.panelBaseViewActionOpenDashboard)}
onClick={openDashboard}
type={`button`}>
{l10n.t(LocalizationKey.panelBaseViewActionOpenDashboard)}
</button>
<button
title={l10n.t(LocalizationKey.panelBaseViewActionOpenPreview)}
onClick={openPreview}
disabled={!settings?.preview?.host}
type={`button`}>
{l10n.t(LocalizationKey.panelBaseViewActionOpenPreview)}
</button>
<StartServerButton settings={settings} />
<button
title={l10n.t(LocalizationKey.panelBaseViewActionCreateContent)}
onClick={createContent}
type={`button`}>
{l10n.t(LocalizationKey.panelBaseViewActionCreateContent)}
</button>
{customActions.map((script) => (
<button
key={script.title}
title={script.title}
type={`button`}
onClick={() => runBulkScript(script)}>
{script.title}
</button>
))}
</div>
</Collapsible>
<Actions settings={settings} scripts={customActions} />
</FeatureFlag>
</>
)}
+2 -10
View File
@@ -5,21 +5,13 @@ import { ActionButton } from './ActionButton';
import * as l10n from '@vscode/l10n';
import { LocalizationKey } from '../../localization';
export interface IPreviewProps {
slug: string;
}
export interface IPreviewProps { }
const Preview: React.FunctionComponent<IPreviewProps> = ({
slug
}: React.PropsWithChildren<IPreviewProps>) => {
const Preview: React.FunctionComponent<IPreviewProps> = (_: React.PropsWithChildren<IPreviewProps>) => {
const open = () => {
Messenger.send(CommandToCode.openPreview);
};
if (!slug) {
return null;
}
return <ActionButton onClick={open} title={l10n.t(LocalizationKey.panelPreviewTitle)} />;
};