@wordpress/edit-site 6.33.4 → 6.33.6

package/src/components/page-templates/index.js

@@ -2,22 +2,16 @@
  * WordPress dependencies
  */
 import { Page } from '@wordpress/admin-ui';
-import { __, sprintf } from '@wordpress/i18n';
-import { decodeEntities } from '@wordpress/html-entities';
+import { __ } from '@wordpress/i18n';
 import { useState, useMemo, useCallback } from '@wordpress/element';
-import {
-	privateApis as corePrivateApis,
-	store as coreStore,
-} from '@wordpress/core-data';
+import { privateApis as corePrivateApis } from '@wordpress/core-data';
 import { DataViews, filterSortAndPaginate } from '@wordpress/dataviews';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 import { privateApis as editorPrivateApis } from '@wordpress/editor';
 import { addQueryArgs } from '@wordpress/url';
-import { useSelect, useDispatch } from '@wordpress/data';
 import { useEvent } from '@wordpress/compose';
 import { useView } from '@wordpress/views';
-import { Button, Modal } from '@wordpress/components';
-import { store as noticesStore } from '@wordpress/notices';
+import { Button } from '@wordpress/components';
 
 /**
  * Internal dependencies
@@ -25,22 +19,11 @@ import { store as noticesStore } from '@wordpress/notices';
 import AddNewTemplate from '../add-new-template';
 import { TEMPLATE_POST_TYPE } from '../../utils/constants';
 import { unlock } from '../../lock-unlock';
-import {
-	useEditPostAction,
-	useSetActiveTemplateAction,
-} from '../dataviews-actions';
-import {
-	authorField,
-	descriptionField,
-	previewField,
-	activeField,
-	slugField,
-	useThemeField,
-} from './fields';
+import { useEditPostAction } from '../dataviews-actions';
+import { authorField, descriptionField, previewField } from './fields';
 import { defaultLayouts, getDefaultView } from './view-utils';
 
-const { usePostActions, usePostFields, templateTitleField } =
-	unlock( editorPrivateApis );
+const { usePostActions, templateTitleField } = unlock( editorPrivateApis );
 const { useHistory, useLocation } = unlock( routerPrivateApis );
 const { useEntityRecordsWithPermissions } = unlock( corePrivateApis );
 
@@ -48,8 +31,7 @@ export default function PageTemplates() {
 	const { path, query } = useLocation();
 	const { activeView = 'active', postId } = query;
 	const [ selection, setSelection ] = useState( [ postId ] );
-	const [ selectedRegisteredTemplate, setSelectedRegisteredTemplate ] =
-		useState( false );
+
 	const defaultView = useMemo( () => {
 		return getDefaultView( activeView );
 	}, [ activeView ] );
@@ -73,129 +55,10 @@ export default function PageTemplates() {
 		},
 	} );
 
-	const { activeTemplatesOption, activeTheme, defaultTemplateTypes } =
-		useSelect( ( select ) => {
-			const { getEntityRecord, getCurrentTheme } = select( coreStore );
-			return {
-				activeTemplatesOption: getEntityRecord( 'root', 'site' )
-					?.active_templates,
-				activeTheme: getCurrentTheme(),
-				defaultTemplateTypes:
-					select( coreStore ).getCurrentTheme()
-						?.default_template_types,
-			};
-		} );
-	// Todo: this will have to be better so that we're not fetching all the
-	// records all the time. Active templates query will need to move server
-	// side.
-	const { records: userRecords, isResolving: isLoadingUserRecords } =
+	const { records, isResolving: isLoadingData } =
 		useEntityRecordsWithPermissions( 'postType', TEMPLATE_POST_TYPE, {
 			per_page: -1,
-			combinedTemplates: false,
 		} );
-	const { records: staticRecords, isResolving: isLoadingStaticData } =
-		useEntityRecordsWithPermissions( 'root', 'registeredTemplate', {
-			// This should not be needed, the endpoint returns all registered
-			// templates, but it's not possible right now to turn off pagination
-			// for entity configs.
-			per_page: -1,
-		} );
-
-	const activeTemplates = useMemo( () => {
-		const _active = [ ...staticRecords ];
-		if ( activeTemplatesOption ) {
-			for ( const activeSlug in activeTemplatesOption ) {
-				const activeId = activeTemplatesOption[ activeSlug ];
-				// Replace the template in the array.
-				const template = userRecords.find(
-					( userRecord ) =>
-						userRecord.id === activeId &&
-						userRecord.theme === activeTheme.stylesheet
-				);
-				if ( template ) {
-					const index = _active.findIndex(
-						( { slug } ) => slug === template.slug
-					);
-					if ( index !== -1 ) {
-						_active[ index ] = template;
-					} else {
-						_active.push( template );
-					}
-				}
-			}
-		}
-		return _active;
-	}, [ userRecords, staticRecords, activeTemplatesOption, activeTheme ] );
-
-	let isLoadingData;
-	if ( activeView === 'active' ) {
-		isLoadingData = isLoadingUserRecords || isLoadingStaticData;
-	} else if ( activeView === 'user' ) {
-		isLoadingData = isLoadingUserRecords;
-	} else {
-		isLoadingData = isLoadingStaticData;
-	}
-
-	const records = useMemo( () => {
-		function isCustom( record ) {
-			// For registered templates, the is_custom field is defined.
-			return (
-				record.is_custom ??
-				// For user templates it's custom if the is_wp_suggestion meta
-				// field is not set and the slug is not found in the default
-				// template types.
-				( ! record.meta?.is_wp_suggestion &&
-					! defaultTemplateTypes.some(
-						( type ) => type.slug === record.slug
-					) )
-			);
-		}
-
-		let _records;
-		if ( activeView === 'active' ) {
-			// Don't show active custom templates in the active view.
-			_records = activeTemplates.filter(
-				( record ) => ! isCustom( record )
-			);
-		} else if ( activeView === 'user' ) {
-			_records = userRecords;
-		} else {
-			_records = staticRecords;
-		}
-		return _records.map( ( record ) => ( {
-			...record,
-			_isActive: activeTemplates.some(
-				( template ) => template.id === record.id
-			),
-			_isCustom: isCustom( record ),
-		} ) );
-	}, [
-		activeTemplates,
-		defaultTemplateTypes,
-		userRecords,
-		staticRecords,
-		activeView,
-	] );
-
-	const users = useSelect(
-		( select ) => {
-			const { getUser } = select( coreStore );
-			return records.reduce( ( acc, record ) => {
-				if ( record.author_text ) {
-					if ( ! acc[ record.author_text ] ) {
-						acc[ record.author_text ] = record.author_text;
-					}
-				} else if ( record.author ) {
-					if ( ! acc[ record.author ] ) {
-						acc[ record.author ] = getUser( record.author );
-					}
-				}
-				return acc;
-			}, {} );
-		},
-		[ records ]
-	);
-
 	const history = useHistory();
 	const onChangeSelection = useCallback(
 		( items ) => {
@@ -211,95 +74,45 @@ export default function PageTemplates() {
 		[ history, path, view?.type ]
 	);
 
-	const postTypeFields = usePostFields( {
-		postType: TEMPLATE_POST_TYPE,
-	} );
-	const dateField = postTypeFields.find( ( field ) => field.id === 'date' );
-	const themeField = useThemeField();
-	const fields = useMemo( () => {
-		const _fields = [
+	const authors = useMemo( () => {
+		if ( ! records ) {
+			return [];
+		}
+		const authorsSet = new Set();
+		records.forEach( ( template ) => {
+			authorsSet.add( template.author_text );
+		} );
+		return Array.from( authorsSet ).map( ( author ) => ( {
+			value: author,
+			label: author,
+		} ) );
+	}, [ records ] );
+
+	const fields = useMemo(
+		() => [
 			previewField,
 			templateTitleField,
 			descriptionField,
-			activeField,
-			slugField,
-		];
-		if ( activeView === 'user' ) {
-			_fields.push( themeField );
-			if ( dateField ) {
-				_fields.push( dateField );
-			}
-		}
-		const elements = [];
-		for ( const author in users ) {
-			elements.push( {
-				value: users[ author ]?.id ?? author,
-				label: users[ author ]?.name ?? author,
-			} );
-		}
-		_fields.push( {
-			...authorField,
-			elements,
-		} );
-		return _fields;
-	}, [ users, activeView, themeField, dateField ] );
+			{
+				...authorField,
+				elements: authors,
+			},
+		],
+		[ authors ]
+	);
 
 	const { data, paginationInfo } = useMemo( () => {
 		return filterSortAndPaginate( records, view, fields );
 	}, [ records, view, fields ] );
 
-	const { createSuccessNotice } = useDispatch( noticesStore );
-	const onActionPerformed = useCallback(
-		( actionId, items ) => {
-			switch ( actionId ) {
-				case 'duplicate-post':
-					{
-						const newItem = items[ 0 ];
-						const _title =
-							typeof newItem.title === 'string'
-								? newItem.title
-								: newItem.title?.rendered;
-						history.navigate( `/template?activeView=user` );
-						createSuccessNotice(
-							sprintf(
-								// translators: %s: Title of the created post or template, e.g: "Hello world".
-								__( '"%s" successfully created.' ),
-								decodeEntities( _title ) || __( '(no title)' )
-							),
-							{
-								type: 'snackbar',
-								id: 'duplicate-post-action',
-								actions: [
-									{
-										label: __( 'Edit' ),
-										onClick: () => {
-											history.navigate(
-												`/${ newItem.type }/${ newItem.id }?canvas=edit`
-											);
-										},
-									},
-								],
-							}
-						);
-					}
-					break;
-			}
-		},
-		[ history, createSuccessNotice ]
-	);
 	const postTypeActions = usePostActions( {
 		postType: TEMPLATE_POST_TYPE,
 		context: 'list',
-		onActionPerformed,
 	} );
 	const editAction = useEditPostAction();
-	const setActiveTemplateAction = useSetActiveTemplateAction();
 	const actions = useMemo(
-		() =>
-			activeView === 'user'
-				? [ setActiveTemplateAction, editAction, ...postTypeActions ]
-				: [ setActiveTemplateAction, ...postTypeActions ],
-		[ postTypeActions, setActiveTemplateAction, editAction, activeView ]
+		() => [ editAction, ...postTypeActions ],
+		[ postTypeActions, editAction ]
 	);
 
 	const onChangeView = useEvent( ( newView ) => {
@@ -310,10 +123,6 @@ export default function PageTemplates() {
 		updateView( newView );
 	} );
 
-	const duplicateAction = actions.find(
-		( action ) => action.id === 'duplicate-post'
-	);
-
 	return (
 		<Page
 			className="edit-site-page-templates"
@@ -346,30 +155,12 @@ export default function PageTemplates() {
 				onChangeView={ onChangeView }
 				onChangeSelection={ onChangeSelection }
 				isItemClickable={ () => true }
-				onClickItem={ ( item ) => {
-					if ( typeof item.id === 'string' ) {
-						setSelectedRegisteredTemplate( item );
-					} else {
-						history.navigate(
-							`/${ item.type }/${ item.id }?canvas=edit`
-						);
-					}
+				onClickItem={ ( { id } ) => {
+					history.navigate( `/wp_template/${ id }?canvas=edit` );
 				} }
 				selection={ selection }
 				defaultLayouts={ defaultLayouts }
 			/>
-			{ selectedRegisteredTemplate && duplicateAction && (
-				<Modal
-					title={ __( 'Duplicate' ) }
-					onRequestClose={ () => setSelectedRegisteredTemplate() }
-					size="small"
-				>
-					<duplicateAction.RenderModal
-						items={ [ selectedRegisteredTemplate ] }
-						closeModal={ () => setSelectedRegisteredTemplate() }
-					/>
-				</Modal>
-			) }
 		</Page>
 	);
 }

package/src/components/page-templates/view-utils.js

@@ -20,7 +20,7 @@ const DEFAULT_VIEW = {
 	titleField: 'title',
 	descriptionField: 'description',
 	mediaField: 'preview',
-	fields: [ 'author', 'active', 'slug', 'theme' ],
+	fields: [ 'author', 'active', 'slug' ],
 	filters: [],
 	...defaultLayouts.grid,
 };
@@ -28,13 +28,6 @@ const DEFAULT_VIEW = {
 export function getDefaultView( activeView ) {
 	return {
 		...DEFAULT_VIEW,
-		sort:
-			activeView === 'user'
-				? {
-						field: 'date',
-						direction: 'desc',
-				  }
-				: DEFAULT_VIEW.sort,
 		filters: ! [ 'active', 'user' ].includes( activeView )
 			? [
 					{

package/src/components/sidebar-navigation-screen-templates-browse/content.js

@@ -13,7 +13,8 @@ import { addQueryArgs } from '@wordpress/url';
  */
 import SidebarNavigationItem from '../sidebar-navigation-item';
 import { useAddedBy } from '../page-templates/hooks';
-import { commentAuthorAvatar, published } from '@wordpress/icons';
+import { layout } from '@wordpress/icons';
+import { TEMPLATE_POST_TYPE } from '../../utils/constants';
 import { unlock } from '../../lock-unlock';
 
 const { useLocation } = unlock( routerPrivateApis );
@@ -36,12 +37,9 @@ function TemplateDataviewItem( { template, isActive } ) {
 
 export default function DataviewsTemplatesSidebarContent() {
 	const {
-		query: { activeView = 'active' },
+		query: { activeView = 'all' },
 	} = useLocation();
-	const { records } = useEntityRecords( 'root', 'registeredTemplate', {
-		// This should not be needed, the endpoint returns all registered
-		// templates, but it's not possible right now to turn off pagination for
-		// entity configs.
+	const { records } = useEntityRecords( 'postType', TEMPLATE_POST_TYPE, {
 		per_page: -1,
 	} );
 	const firstItemPerAuthorText = useMemo( () => {
@@ -62,23 +60,10 @@ export default function DataviewsTemplatesSidebarContent() {
 		<ItemGroup className="edit-site-sidebar-navigation-screen-templates-browse">
 			<SidebarNavigationItem
 				to="/template"
-				icon={ published }
-				aria-current={ activeView === 'active' }
+				icon={ layout }
+				aria-current={ activeView === 'all' }
 			>
-				{ __( 'Active templates' ) }
-			</SidebarNavigationItem>
-			<SidebarNavigationItem
-				to={ addQueryArgs( '/template', { activeView: 'user' } ) }
-				icon={ commentAuthorAvatar }
-				aria-current={ activeView === 'user' }
-			>
-				{
-					// Let's avoid calling them "custom templates" to avoid
-					// confusion. "Created" is closest to meaning database
-					// templates, created by users.
-					// https://developer.wordpress.org/themes/classic-themes/templates/page-template-files/#creating-custom-page-templates-for-global-use
-					__( 'Created templates' )
-				}
+				{ __( 'All templates' ) }
 			</SidebarNavigationItem>
 			{ firstItemPerAuthorText.map( ( template ) => {
 				return (

package/src/components/site-editor-routes/template-item.js

@@ -5,35 +5,33 @@ import Editor from '../editor';
 import SidebarNavigationScreenTemplatesBrowse from '../sidebar-navigation-screen-templates-browse';
 import SidebarNavigationScreenUnsupported from '../sidebar-navigation-screen-unsupported';
 
-const areas = {
-	sidebar( { siteData } ) {
-		const isBlockTheme = siteData.currentTheme?.is_block_theme;
-		return isBlockTheme ? (
-			<SidebarNavigationScreenTemplatesBrowse backPath="/" />
-		) : (
-			<SidebarNavigationScreenUnsupported />
-		);
-	},
-	mobile( { siteData } ) {
-		const isBlockTheme = siteData.currentTheme?.is_block_theme;
-		return isBlockTheme ? (
-			<Editor />
-		) : (
-			<SidebarNavigationScreenUnsupported />
-		);
-	},
-	preview( { siteData } ) {
-		const isBlockTheme = siteData.currentTheme?.is_block_theme;
-		return isBlockTheme ? (
-			<Editor />
-		) : (
-			<SidebarNavigationScreenUnsupported />
-		);
-	},
-};
-
 export const templateItemRoute = {
 	name: 'template-item',
 	path: '/wp_template/*postId',
-	areas,
+	areas: {
+		sidebar( { siteData } ) {
+			const isBlockTheme = siteData.currentTheme?.is_block_theme;
+			return isBlockTheme ? (
+				<SidebarNavigationScreenTemplatesBrowse backPath="/" />
+			) : (
+				<SidebarNavigationScreenUnsupported />
+			);
+		},
+		mobile( { siteData } ) {
+			const isBlockTheme = siteData.currentTheme?.is_block_theme;
+			return isBlockTheme ? (
+				<Editor />
+			) : (
+				<SidebarNavigationScreenUnsupported />
+			);
+		},
+		preview( { siteData } ) {
+			const isBlockTheme = siteData.currentTheme?.is_block_theme;
+			return isBlockTheme ? (
+				<Editor />
+			) : (
+				<SidebarNavigationScreenUnsupported />
+			);
+		},
+	},
 };