@wordpress/edit-site 5.32.0 → 5.33.0

package/src/components/page-templates-template-parts/actions.js

@@ -1,277 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { __, sprintf, _n } from '@wordpress/i18n';
-import { useDispatch } from '@wordpress/data';
-import { useState } from '@wordpress/element';
-import { store as coreStore } from '@wordpress/core-data';
-import { store as noticesStore } from '@wordpress/notices';
-import { decodeEntities } from '@wordpress/html-entities';
-import {
-	Button,
-	TextControl,
-	__experimentalText as Text,
-	__experimentalHStack as HStack,
-	__experimentalVStack as VStack,
-} from '@wordpress/components';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../lock-unlock';
-import { store as editSiteStore } from '../../store';
-import isTemplateRevertable from '../../utils/is-template-revertable';
-import isTemplateRemovable from '../../utils/is-template-removable';
-import { TEMPLATE_POST_TYPE } from '../../utils/constants';
-
-export const resetTemplateAction = {
-	id: 'reset-template',
-	label: __( 'Clear customizations' ),
-	isEligible: isTemplateRevertable,
-	supportsBulk: true,
-	hideModalHeader: true,
-	RenderModal: ( { items, closeModal, onPerform } ) => {
-		const { revertTemplate } = useDispatch( editSiteStore );
-		const { saveEditedEntityRecord } = useDispatch( coreStore );
-		const { createSuccessNotice, createErrorNotice } =
-			useDispatch( noticesStore );
-		const onConfirm = async () => {
-			try {
-				for ( const template of items ) {
-					await revertTemplate( template, {
-						allowUndo: false,
-					} );
-					await saveEditedEntityRecord(
-						'postType',
-						template.type,
-						template.id
-					);
-				}
-
-				createSuccessNotice(
-					items.length > 1
-						? sprintf(
-								/* translators: The number of items. */
-								__( '%s items reverted.' ),
-								items.length
-						  )
-						: sprintf(
-								/* translators: The template/part's name. */
-								__( '"%s" reverted.' ),
-								decodeEntities( items[ 0 ].title.rendered )
-						  ),
-					{
-						type: 'snackbar',
-						id: 'edit-site-template-reverted',
-					}
-				);
-			} catch ( error ) {
-				let fallbackErrorMessage;
-				if ( items[ 0 ].type === TEMPLATE_POST_TYPE ) {
-					fallbackErrorMessage =
-						items.length === 1
-							? __(
-									'An error occurred while reverting the template.'
-							  )
-							: __(
-									'An error occurred while reverting the templates.'
-							  );
-				} else {
-					fallbackErrorMessage =
-						items.length === 1
-							? __(
-									'An error occurred while reverting the template part.'
-							  )
-							: __(
-									'An error occurred while reverting the template parts.'
-							  );
-				}
-				const errorMessage =
-					error.message && error.code !== 'unknown_error'
-						? error.message
-						: fallbackErrorMessage;
-
-				createErrorNotice( errorMessage, { type: 'snackbar' } );
-			}
-		};
-		return (
-			<VStack spacing="5">
-				<Text>
-					{ __(
-						'Are you sure you want to clear these customizations?'
-					) }
-				</Text>
-				<HStack justify="right">
-					<Button variant="tertiary" onClick={ closeModal }>
-						{ __( 'Cancel' ) }
-					</Button>
-					<Button
-						variant="primary"
-						onClick={ async () => {
-							await onConfirm( items );
-							onPerform?.();
-							closeModal();
-						} }
-					>
-						{ __( 'Clear' ) }
-					</Button>
-				</HStack>
-			</VStack>
-		);
-	},
-};
-
-export const deleteTemplateAction = {
-	id: 'delete-template',
-	label: __( 'Delete' ),
-	isEligible: isTemplateRemovable,
-	supportsBulk: true,
-	hideModalHeader: true,
-	RenderModal: ( { items: templates, closeModal, onPerform } ) => {
-		const { removeTemplates } = unlock( useDispatch( editSiteStore ) );
-		return (
-			<VStack spacing="5">
-				<Text>
-					{ templates.length > 1
-						? sprintf(
-								// translators: %d: number of items to delete.
-								_n(
-									'Delete %d item?',
-									'Delete %d items?',
-									templates.length
-								),
-								templates.length
-						  )
-						: sprintf(
-								// translators: %s: The template or template part's titles
-								__( 'Delete "%s"?' ),
-								decodeEntities(
-									templates?.[ 0 ]?.title?.rendered
-								)
-						  ) }
-				</Text>
-				<HStack justify="right">
-					<Button variant="tertiary" onClick={ closeModal }>
-						{ __( 'Cancel' ) }
-					</Button>
-					<Button
-						variant="primary"
-						onClick={ async () => {
-							await removeTemplates( templates, {
-								allowUndo: false,
-							} );
-							onPerform?.();
-							closeModal();
-						} }
-					>
-						{ __( 'Delete' ) }
-					</Button>
-				</HStack>
-			</VStack>
-		);
-	},
-};
-
-export const renameTemplateAction = {
-	id: 'rename-template',
-	label: __( 'Rename' ),
-	isEligible: ( template ) => {
-		// We can only remove templates or template parts that can be removed.
-		// Additionally in the case of templates, we can only remove custom templates.
-		if (
-			! isTemplateRemovable( template ) ||
-			( template.type === TEMPLATE_POST_TYPE && ! template.is_custom )
-		) {
-			return false;
-		}
-		return true;
-	},
-	RenderModal: ( { items: templates, closeModal } ) => {
-		const template = templates[ 0 ];
-		const title = decodeEntities( template.title.rendered );
-		const [ editedTitle, setEditedTitle ] = useState( title );
-		const {
-			editEntityRecord,
-			__experimentalSaveSpecifiedEntityEdits: saveSpecifiedEntityEdits,
-		} = useDispatch( coreStore );
-		const { createSuccessNotice, createErrorNotice } =
-			useDispatch( noticesStore );
-		async function onTemplateRename( event ) {
-			event.preventDefault();
-			try {
-				await editEntityRecord(
-					'postType',
-					template.type,
-					template.id,
-					{
-						title: editedTitle,
-					}
-				);
-				// Update state before saving rerenders the list.
-				setEditedTitle( '' );
-				closeModal();
-				// Persist edited entity.
-				await saveSpecifiedEntityEdits(
-					'postType',
-					template.type,
-					template.id,
-					[ 'title' ], // Only save title to avoid persisting other edits.
-					{
-						throwOnError: true,
-					}
-				);
-				createSuccessNotice(
-					template.type === TEMPLATE_POST_TYPE
-						? __( 'Template renamed.' )
-						: __( 'Template part renamed.' ),
-					{
-						type: 'snackbar',
-					}
-				);
-			} catch ( error ) {
-				const fallbackErrorMessage =
-					template.type === TEMPLATE_POST_TYPE
-						? __( 'An error occurred while renaming the template.' )
-						: __(
-								'An error occurred while renaming the template part.'
-						  );
-				const errorMessage =
-					error.message && error.code !== 'unknown_error'
-						? error.message
-						: fallbackErrorMessage;
-
-				createErrorNotice( errorMessage, { type: 'snackbar' } );
-			}
-		}
-		return (
-			<form onSubmit={ onTemplateRename }>
-				<VStack spacing="5">
-					<TextControl
-						__nextHasNoMarginBottom
-						__next40pxDefaultSize
-						label={ __( 'Name' ) }
-						value={ editedTitle }
-						onChange={ setEditedTitle }
-						required
-					/>
-					<HStack justify="right">
-						<Button
-							variant="tertiary"
-							onClick={ closeModal }
-							__next40pxDefaultSize
-						>
-							{ __( 'Cancel' ) }
-						</Button>
-						<Button
-							variant="primary"
-							type="submit"
-							__next40pxDefaultSize
-						>
-							{ __( 'Save' ) }
-						</Button>
-					</HStack>
-				</VStack>
-			</form>
-		);
-	},
-};

package/src/components/preferences-modal/index.js

@@ -1,29 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { store as interfaceStore } from '@wordpress/interface';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { privateApis as editorPrivateApis } from '@wordpress/editor';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../lock-unlock';
-
-const { PreferencesModal } = unlock( editorPrivateApis );
-
-export const PREFERENCES_MODAL_NAME = 'edit-site/preferences';
-
-export default function EditSitePreferencesModal() {
-	const isModalActive = useSelect( ( select ) =>
-		select( interfaceStore ).isModalActive( PREFERENCES_MODAL_NAME )
-	);
-	const { closeModal } = useDispatch( interfaceStore );
-
-	if ( ! isModalActive ) {
-		return null;
-	}
-	return (
-		<PreferencesModal isActive={ isModalActive } onClose={ closeModal } />
-	);
-}

package/src/components/sidebar-edit-mode/constants.js

@@ -1,2 +0,0 @@
-export const SIDEBAR_TEMPLATE = 'edit-site/template';
-export const SIDEBAR_BLOCK = 'edit-site/block-inspector';

package/src/components/sidebar-edit-mode/plugin-sidebar/index.js

@@ -1,80 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { ComplementaryArea } from '@wordpress/interface';
-
-/**
- * Renders a sidebar when activated. The contents within the `PluginSidebar` will appear as content within the sidebar.
- * It also automatically renders a corresponding `PluginSidebarMenuItem` component when `isPinnable` flag is set to `true`.
- * If you wish to display the sidebar, you can with use the `PluginSidebarMoreMenuItem` component or the `wp.data.dispatch` API:
- *
- * ```js
- * wp.data.dispatch( 'core/edit-site' ).openGeneralSidebar( 'plugin-name/sidebar-name' );
- * ```
- *
- * @see PluginSidebarMoreMenuItem
- *
- * @param {Object}                props                                 Element props.
- * @param {string}                props.name                            A string identifying the sidebar. Must be unique for every sidebar registered within the scope of your plugin.
- * @param {string}                [props.className]                     An optional class name added to the sidebar body.
- * @param {string}                props.title                           Title displayed at the top of the sidebar.
- * @param {boolean}               [props.isPinnable=true]               Whether to allow to pin sidebar to the toolbar. When set to `true` it also automatically renders a corresponding menu item.
- * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.
- *
- * @example
- * ```js
- * // Using ES5 syntax
- * var __ = wp.i18n.__;
- * var el = wp.element.createElement;
- * var PanelBody = wp.components.PanelBody;
- * var PluginSidebar = wp.editSite.PluginSidebar;
- * var moreIcon = wp.element.createElement( 'svg' ); //... svg element.
- *
- * function MyPluginSidebar() {
- * 	return el(
- * 			PluginSidebar,
- * 			{
- * 				name: 'my-sidebar',
- * 				title: 'My sidebar title',
- * 				icon: moreIcon,
- * 			},
- * 			el(
- * 				PanelBody,
- * 				{},
- * 				__( 'My sidebar content' )
- * 			)
- * 	);
- * }
- * ```
- *
- * @example
- * ```jsx
- * // Using ESNext syntax
- * import { __ } from '@wordpress/i18n';
- * import { PanelBody } from '@wordpress/components';
- * import { PluginSidebar } from '@wordpress/edit-site';
- * import { more } from '@wordpress/icons';
- *
- * const MyPluginSidebar = () => (
- * 	<PluginSidebar
- * 		name="my-sidebar"
- * 		title="My sidebar title"
- * 		icon={ more }
- * 	>
- * 		<PanelBody>
- * 			{ __( 'My sidebar content' ) }
- * 		</PanelBody>
- * 	</PluginSidebar>
- * );
- * ```
- */
-export default function PluginSidebarEditSite( { className, ...props } ) {
-	return (
-		<ComplementaryArea
-			panelClassName={ className }
-			className="edit-site-sidebar-edit-mode"
-			scope="core/edit-site"
-			{ ...props }
-		/>
-	);
-}

package/src/components/sidebar-navigation-screen-navigation-item/index.js

@@ -1,59 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { __ } from '@wordpress/i18n';
-import { useDispatch } from '@wordpress/data';
-import {
-	__experimentalUseNavigator as useNavigator,
-	ExternalLink,
-} from '@wordpress/components';
-import { useEntityRecord } from '@wordpress/core-data';
-import { decodeEntities } from '@wordpress/html-entities';
-import { pencil } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import SidebarNavigationScreen from '../sidebar-navigation-screen';
-import { unlock } from '../../lock-unlock';
-import { store as editSiteStore } from '../../store';
-import SidebarButton from '../sidebar-button';
-
-export default function SidebarNavigationScreenNavigationItem() {
-	const { setCanvasMode } = unlock( useDispatch( editSiteStore ) );
-	const {
-		params: { postType, postId },
-	} = useNavigator();
-	const { record } = useEntityRecord( 'postType', postType, postId );
-
-	return (
-		<SidebarNavigationScreen
-			title={ record ? decodeEntities( record?.title?.rendered ) : null }
-			actions={
-				<SidebarButton
-					onClick={ () => setCanvasMode( 'edit' ) }
-					label={ __( 'Edit' ) }
-					icon={ pencil }
-				/>
-			}
-			description={ __(
-				'Posts are entries listed in reverse chronological order on the site homepage or on the posts page.'
-			) }
-			content={
-				<>
-					{ record?.link ? (
-						<ExternalLink
-							className="edit-site-sidebar-navigation-screen__page-link"
-							href={ record.link }
-						>
-							{ record.link }
-						</ExternalLink>
-					) : null }
-					{ record
-						? decodeEntities( record?.description?.rendered )
-						: null }
-				</>
-			}
-		/>
-	);
-}

package/src/components/sync-state-with-url/use-sync-path-with-url.js

@@ -1,147 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { __experimentalUseNavigator as useNavigator } from '@wordpress/components';
-import { useEffect, useRef } from '@wordpress/element';
-import { privateApis as routerPrivateApis } from '@wordpress/router';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../lock-unlock';
-import {
-	TEMPLATE_POST_TYPE,
-	TEMPLATE_PART_POST_TYPE,
-	PATTERN_TYPES,
-} from '../../utils/constants';
-
-const { useLocation, useHistory } = unlock( routerPrivateApis );
-
-export function getPathFromURL( urlParams ) {
-	let path = urlParams?.path ?? '/';
-
-	// Compute the navigator path based on the URL params.
-	if ( urlParams?.postType && urlParams?.postId ) {
-		switch ( urlParams.postType ) {
-			case PATTERN_TYPES.user:
-			case TEMPLATE_POST_TYPE:
-			case TEMPLATE_PART_POST_TYPE:
-			case 'page':
-				path = `/${ encodeURIComponent(
-					urlParams.postType
-				) }/${ encodeURIComponent( urlParams.postId ) }`;
-				break;
-			default:
-				path = `/navigation/${ encodeURIComponent(
-					urlParams.postType
-				) }/${ encodeURIComponent( urlParams.postId ) }`;
-		}
-	}
-
-	return path;
-}
-
-function isSubset( subset, superset ) {
-	return Object.entries( subset ).every( ( [ key, value ] ) => {
-		return superset[ key ] === value;
-	} );
-}
-
-export default function useSyncPathWithURL() {
-	const history = useHistory();
-	const { params: urlParams } = useLocation();
-	const {
-		location: navigatorLocation,
-		params: navigatorParams,
-		goTo,
-	} = useNavigator();
-	const isMounting = useRef( true );
-
-	useEffect(
-		() => {
-			// The navigatorParams are only initially filled properly when the
-			// navigator screens mount. so we ignore the first synchronisation.
-			if ( isMounting.current ) {
-				isMounting.current = false;
-				return;
-			}
-
-			function updateUrlParams( newUrlParams ) {
-				if ( isSubset( newUrlParams, urlParams ) ) {
-					return;
-				}
-				const updatedParams = {
-					...urlParams,
-					...newUrlParams,
-				};
-				history.push( updatedParams );
-			}
-
-			if ( navigatorParams?.postType && navigatorParams?.postId ) {
-				updateUrlParams( {
-					postType: navigatorParams?.postType,
-					postId: navigatorParams?.postId,
-					path: undefined,
-					layout: undefined,
-				} );
-			} else if (
-				navigatorLocation.path.startsWith( '/page/' ) &&
-				navigatorParams?.postId
-			) {
-				updateUrlParams( {
-					postType: 'page',
-					postId: navigatorParams?.postId,
-					path: undefined,
-					layout: undefined,
-				} );
-			} else if ( navigatorLocation.path === '/patterns' ) {
-				updateUrlParams( {
-					postType: undefined,
-					postId: undefined,
-					canvas: undefined,
-					path: navigatorLocation.path,
-				} );
-			} else if (
-				// These sidebar paths are special in the sense that the url in these pages may or may not have a postId and we need to retain it if it has.
-				// The "type" property should be kept as well.
-				navigatorLocation.path === '/page' ||
-				navigatorLocation.path === '/wp_template' ||
-				navigatorLocation.path === '/wp_template_part/all'
-			) {
-				updateUrlParams( {
-					postType: undefined,
-					categoryType: undefined,
-					categoryId: undefined,
-					path: navigatorLocation.path,
-				} );
-			} else {
-				updateUrlParams( {
-					postType: undefined,
-					postId: undefined,
-					categoryType: undefined,
-					categoryId: undefined,
-					layout: undefined,
-					path:
-						navigatorLocation.path === '/'
-							? undefined
-							: navigatorLocation.path,
-				} );
-			}
-		},
-		// Trigger only when navigator changes to prevent infinite loops.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-		[ navigatorLocation?.path, navigatorParams ]
-	);
-
-	useEffect(
-		() => {
-			const path = getPathFromURL( urlParams );
-			if ( navigatorLocation.path !== path ) {
-				goTo( path );
-			}
-		},
-		// Trigger only when URL changes to prevent infinite loops.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-		[ urlParams ]
-	);
-}