@wordpress/edit-site 6.0.3 → 6.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "6.0.3",
+	"version": "6.0.5",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -32,41 +32,41 @@
 		"@wordpress/a11y": "^4.0.1",
 		"@wordpress/api-fetch": "^7.0.1",
 		"@wordpress/blob": "^4.0.1",
-		"@wordpress/block-editor": "^13.0.2",
-		"@wordpress/block-library": "^9.0.3",
-		"@wordpress/blocks": "^13.0.2",
-		"@wordpress/commands": "^1.0.2",
-		"@wordpress/components": "^28.0.2",
+		"@wordpress/block-editor": "^13.0.4",
+		"@wordpress/block-library": "^9.0.5",
+		"@wordpress/blocks": "^13.0.3",
+		"@wordpress/commands": "^1.0.3",
+		"@wordpress/components": "^28.0.3",
 		"@wordpress/compose": "^7.0.1",
-		"@wordpress/core-commands": "^1.0.2",
-		"@wordpress/core-data": "^7.0.2",
+		"@wordpress/core-commands": "^1.0.4",
+		"@wordpress/core-data": "^7.0.4",
 		"@wordpress/data": "^10.0.2",
-		"@wordpress/dataviews": "^2.0.2",
+		"@wordpress/dataviews": "^2.0.4",
 		"@wordpress/date": "^5.0.1",
 		"@wordpress/deprecated": "^4.0.1",
 		"@wordpress/dom": "^4.0.1",
-		"@wordpress/editor": "^14.0.2",
+		"@wordpress/editor": "^14.0.4",
 		"@wordpress/element": "^6.0.1",
 		"@wordpress/escape-html": "^3.0.1",
 		"@wordpress/hooks": "^4.0.1",
 		"@wordpress/html-entities": "^4.0.1",
 		"@wordpress/i18n": "^5.0.1",
-		"@wordpress/icons": "^10.0.1",
+		"@wordpress/icons": "^10.0.2",
 		"@wordpress/keyboard-shortcuts": "^5.0.2",
 		"@wordpress/keycodes": "^4.0.1",
 		"@wordpress/notices": "^5.0.2",
-		"@wordpress/patterns": "^2.0.2",
-		"@wordpress/plugins": "^7.0.2",
-		"@wordpress/preferences": "^4.0.2",
+		"@wordpress/patterns": "^2.0.4",
+		"@wordpress/plugins": "^7.0.3",
+		"@wordpress/preferences": "^4.0.3",
 		"@wordpress/primitives": "^4.0.1",
 		"@wordpress/priority-queue": "^3.0.1",
 		"@wordpress/private-apis": "^1.0.2",
-		"@wordpress/reusable-blocks": "^5.0.2",
+		"@wordpress/reusable-blocks": "^5.0.4",
 		"@wordpress/router": "^1.0.2",
 		"@wordpress/style-engine": "^2.0.2",
 		"@wordpress/url": "^4.0.1",
 		"@wordpress/viewport": "^6.0.2",
-		"@wordpress/widgets": "^4.0.2",
+		"@wordpress/widgets": "^4.0.4",
 		"@wordpress/wordcount": "^4.0.1",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
@@ -82,5 +82,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "d0d80eabf45745725edbb19ce6667157fc68a6aa"
+	"gitHead": "85486692a3e48b7d863226cf895a21d787434921"
 }

package/src/components/add-new-page/index.js

@@ -9,11 +9,12 @@ import {
 	TextControl,
 } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
-import { useDispatch } from '@wordpress/data';
+import { useDispatch, useRegistry } 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 { serialize, synchronizeBlocksWithTemplate } from '@wordpress/blocks';
 
 export default function AddNewPageModal( { onSave, onClose } ) {
 	const [ isCreatingPage, setIsCreatingPage ] = useState( false );
@@ -22,6 +23,7 @@ export default function AddNewPageModal( { onSave, onClose } ) {
 	const { saveEntityRecord } = useDispatch( coreStore );
 	const { createErrorNotice, createSuccessNotice } =
 		useDispatch( noticesStore );
+	const { resolveSelect } = useRegistry();
 
 	async function createPage( event ) {
 		event.preventDefault();
@@ -31,6 +33,8 @@ export default function AddNewPageModal( { onSave, onClose } ) {
 		}
 		setIsCreatingPage( true );
 		try {
+			const pagePostType =
+				await resolveSelect( coreStore ).getPostType( 'page' );
 			const newPage = await saveEntityRecord(
 				'postType',
 				'page',
@@ -38,6 +42,15 @@ export default function AddNewPageModal( { onSave, onClose } ) {
 					status: 'draft',
 					title,
 					slug: title || __( 'No title' ),
+					content:
+						!! pagePostType.template && pagePostType.template.length
+							? serialize(
+									synchronizeBlocksWithTemplate(
+										[],
+										pagePostType.template
+									)
+							  )
+							: undefined,
 				},
 				{ throwOnError: true }
 			);

package/src/components/add-new-pattern/index.js

@@ -36,21 +36,29 @@ export default function AddNewPattern() {
 	const [ showPatternModal, setShowPatternModal ] = useState( false );
 	const [ showTemplatePartModal, setShowTemplatePartModal ] =
 		useState( false );
+	// eslint-disable-next-line @wordpress/no-unused-vars-before-return
 	const { createPatternFromFile } = unlock( useDispatch( patternsStore ) );
 	const { createSuccessNotice, createErrorNotice } =
 		useDispatch( noticesStore );
 	const patternUploadInputRef = useRef();
-	const { isBlockBasedTheme, addNewPatternLabel, addNewTemplatePartLabel } =
-		useSelect( ( select ) => {
-			const { getCurrentTheme, getPostType } = select( coreStore );
-			return {
-				isBlockBasedTheme: getCurrentTheme()?.is_block_theme,
-				addNewPatternLabel: getPostType( PATTERN_TYPES.user )?.labels
-					?.add_new_item,
-				addNewTemplatePartLabel: getPostType( TEMPLATE_PART_POST_TYPE )
-					?.labels?.add_new_item,
-			};
-		}, [] );
+	const {
+		isBlockBasedTheme,
+		addNewPatternLabel,
+		addNewTemplatePartLabel,
+		canCreatePattern,
+		canCreateTemplatePart,
+	} = useSelect( ( select ) => {
+		const { getCurrentTheme, getPostType, canUser } = select( coreStore );
+		return {
+			isBlockBasedTheme: getCurrentTheme()?.is_block_theme,
+			addNewPatternLabel: getPostType( PATTERN_TYPES.user )?.labels
+				?.add_new_item,
+			addNewTemplatePartLabel: getPostType( TEMPLATE_PART_POST_TYPE )
+				?.labels?.add_new_item,
+			canCreatePattern: canUser( 'create', 'blocks' ),
+			canCreateTemplatePart: canUser( 'create', 'template-parts' ),
+		};
+	}, [] );
 
 	function handleCreatePattern( { pattern } ) {
 		setShowPatternModal( false );
@@ -78,15 +86,16 @@ export default function AddNewPattern() {
 		setShowTemplatePartModal( false );
 	}
 
-	const controls = [
-		{
+	const controls = [];
+	if ( canCreatePattern ) {
+		controls.push( {
 			icon: symbol,
 			onClick: () => setShowPatternModal( true ),
 			title: addNewPatternLabel,
-		},
-	];
+		} );
+	}
 
-	if ( isBlockBasedTheme ) {
+	if ( isBlockBasedTheme && canCreateTemplatePart ) {
 		controls.push( {
 			icon: symbolFilled,
 			onClick: () => setShowTemplatePartModal( true ),
@@ -94,15 +103,20 @@ export default function AddNewPattern() {
 		} );
 	}
 
-	controls.push( {
-		icon: upload,
-		onClick: () => {
-			patternUploadInputRef.current.click();
-		},
-		title: __( 'Import pattern from JSON' ),
-	} );
+	if ( canCreatePattern ) {
+		controls.push( {
+			icon: upload,
+			onClick: () => {
+				patternUploadInputRef.current.click();
+			},
+			title: __( 'Import pattern from JSON' ),
+		} );
+	}
 
 	const { categoryMap, findOrCreateTerm } = useAddPatternCategory();
+	if ( controls.length === 0 ) {
+		return null;
+	}
 	return (
 		<>
 			{ addNewPatternLabel && (

package/src/components/block-editor/style.scss

@@ -1,15 +1,4 @@
-/* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
-::view-transition-old(frame),
-::view-transition-new(frame) {
-  animation-duration: 0;
-}
-/* stylelint-enable */
-
 .edit-site-visual-editor__editor-canvas {
-	/* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
-	view-transition-name: frame;
-	/* stylelint-enable */
-
 	&.is-focused {
 		outline: calc(2 * var(--wp-admin-border-width-focus)) solid var(--wp-admin-theme-color);
 		outline-offset: calc(-2 * var(--wp-admin-border-width-focus));

package/src/components/editor/index.js

@@ -41,6 +41,7 @@ import {
 	useHasEditorCanvasContainer,
 } from '../editor-canvas-container';
 import SaveButton from '../save-button';
+import SavePanel from '../save-panel';
 import SiteEditorMoreMenu from '../more-menu';
 import SiteIcon from '../site-icon';
 import useEditorIframeProps from '../block-editor/use-editor-iframe-props';
@@ -205,6 +206,7 @@ export default function EditSiteEditor( { isLoading } ) {
 					customSaveButton={
 						_isPreviewingTheme && <SaveButton size="compact" />
 					}
+					customSavePanel={ _isPreviewingTheme && <SavePanel /> }
 					forceDisableBlockTools={ ! hasDefaultEditorCanvasView }
 					title={
 						! hasDefaultEditorCanvasView

package/src/components/layout/index.js

@@ -46,7 +46,6 @@ import SiteHub from '../site-hub';
 import ResizableFrame from '../resizable-frame';
 import useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';
 import { unlock } from '../../lock-unlock';
-import SavePanel from '../save-panel';
 import KeyboardShortcutsRegister from '../keyboard-shortcuts/register';
 import KeyboardShortcutsGlobal from '../keyboard-shortcuts/global';
 import { useCommonCommands } from '../../hooks/commands/use-common-commands';
@@ -56,6 +55,7 @@ import useLayoutAreas from './router';
 import useMovingAnimation from './animation';
 import SidebarContent from '../sidebar';
 import SaveHub from '../save-hub';
+import SavePanel from '../save-panel';
 
 const { useCommands } = unlock( coreCommandsPrivateApis );
 const { useCommandContext } = unlock( commandsPrivateApis );
@@ -209,6 +209,7 @@ export default function Layout() {
 											{ areas.sidebar }
 										</SidebarContent>
 										<SaveHub />
+										<SavePanel />
 									</motion.div>
 								) }
 							</AnimatePresence>
@@ -282,8 +283,6 @@ export default function Layout() {
 						</div>
 					) }
 				</div>
-
-				<SavePanel />
 			</div>
 		</>
 	);

package/src/components/layout/router.js

@@ -77,6 +77,7 @@ export default function useLayoutAreas() {
 	const isSiteEditorLoading = useIsSiteEditorLoading();
 	const { params } = useLocation();
 	const { postType, postId, path, layout, isCustom, canvas } = params;
+	const hasEditCanvasMode = canvas === 'edit';
 	useRedirectOldPaths();
 
 	// Page list
@@ -93,15 +94,14 @@ export default function useLayoutAreas() {
 					/>
 				),
 				content: <PagePages />,
-				preview: ( isListLayout || canvas === 'edit' ) && (
+				preview: ( isListLayout || hasEditCanvasMode ) && (
 					<Editor isLoading={ isSiteEditorLoading } />
 				),
-				mobile:
-					canvas === 'edit' ? (
-						<Editor isLoading={ isSiteEditorLoading } />
-					) : (
-						<PagePages />
-					),
+				mobile: hasEditCanvasMode ? (
+					<Editor isLoading={ isSiteEditorLoading } />
+				) : (
+					<PagePages />
+				),
 			},
 			widths: {
 				content: isListLayout ? 380 : undefined,
@@ -119,10 +119,14 @@ export default function useLayoutAreas() {
 					<SidebarNavigationScreenTemplatesBrowse backPath={ {} } />
 				),
 				content: <PageTemplates />,
-				preview: ( isListLayout || canvas === 'edit' ) && (
+				preview: ( isListLayout || hasEditCanvasMode ) && (
 					<Editor isLoading={ isSiteEditorLoading } />
 				),
-				mobile: <PageTemplates />,
+				mobile: hasEditCanvasMode ? (
+					<Editor isLoading={ isSiteEditorLoading } />
+				) : (
+					<PageTemplates />
+				),
 			},
 			widths: {
 				content: isListLayout ? 380 : undefined,
@@ -139,8 +143,12 @@ export default function useLayoutAreas() {
 			areas: {
 				sidebar: <SidebarNavigationScreenPatterns backPath={ {} } />,
 				content: <PagePatterns />,
-				mobile: <PagePatterns />,
-				preview: canvas === 'edit' && (
+				mobile: hasEditCanvasMode ? (
+					<Editor isLoading={ isSiteEditorLoading } />
+				) : (
+					<PagePatterns />
+				),
+				preview: hasEditCanvasMode && (
 					<Editor isLoading={ isSiteEditorLoading } />
 				),
 			},
@@ -156,7 +164,7 @@ export default function useLayoutAreas() {
 					<SidebarNavigationScreenGlobalStyles backPath={ {} } />
 				),
 				preview: <Editor isLoading={ isSiteEditorLoading } />,
-				mobile: canvas === 'edit' && (
+				mobile: hasEditCanvasMode && (
 					<Editor isLoading={ isSiteEditorLoading } />
 				),
 			},
@@ -175,7 +183,7 @@ export default function useLayoutAreas() {
 						/>
 					),
 					preview: <Editor isLoading={ isSiteEditorLoading } />,
-					mobile: canvas === 'edit' && (
+					mobile: hasEditCanvasMode && (
 						<Editor isLoading={ isSiteEditorLoading } />
 					),
 				},
@@ -188,7 +196,7 @@ export default function useLayoutAreas() {
 					<SidebarNavigationScreenNavigationMenus backPath={ {} } />
 				),
 				preview: <Editor isLoading={ isSiteEditorLoading } />,
-				mobile: canvas === 'edit' && (
+				mobile: hasEditCanvasMode && (
 					<Editor isLoading={ isSiteEditorLoading } />
 				),
 			},
@@ -201,7 +209,7 @@ export default function useLayoutAreas() {
 		areas: {
 			sidebar: <SidebarNavigationScreenMain />,
 			preview: <Editor isLoading={ isSiteEditorLoading } />,
-			mobile: canvas === 'edit' && (
+			mobile: hasEditCanvasMode && (
 				<Editor isLoading={ isSiteEditorLoading } />
 			),
 		},

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

@@ -39,6 +39,7 @@ import AddNewPageModal from '../add-new-page';
 import Media from '../media';
 import { unlock } from '../../lock-unlock';
 import { useEditPostAction } from '../dataviews-actions';
+import { usePrevious } from '@wordpress/compose';
 
 const { usePostActions } = unlock( editorPrivateApis );
 const { useLocation, useHistory } = unlock( routerPrivateApis );
@@ -201,10 +202,18 @@ function FeaturedImage( { item, viewType } ) {
 	);
 }
 
+function getItemId( item ) {
+	return item.id.toString();
+}
+
 export default function PagePages() {
 	const postType = 'page';
 	const [ view, setView ] = useView( postType );
 	const history = useHistory();
+	const {
+		params: { postId },
+	} = useLocation();
+	const [ selection, setSelection ] = useState( [ postId ] );
 
 	const onSelectionChange = useCallback(
 		( items ) => {
@@ -266,6 +275,20 @@ export default function PagePages() {
 		totalPages,
 	} = useEntityRecords( 'postType', postType, queryArgs );
 
+	const ids = pages?.map( ( page ) => getItemId( page ) ) ?? [];
+	const prevIds = usePrevious( ids ) ?? [];
+	const deletedIds = prevIds.filter( ( id ) => ! ids.includes( id ) );
+	const postIdWasDeleted = deletedIds.includes( postId );
+
+	useEffect( () => {
+		if ( postIdWasDeleted ) {
+			history.push( {
+				...history.getLocationWithParams().params,
+				postId: undefined,
+			} );
+		}
+	}, [ postIdWasDeleted, history ] );
+
 	const { records: authors, isResolving: isLoadingAuthors } =
 		useEntityRecords( 'root', 'user', { per_page: -1 } );
 
@@ -277,15 +300,19 @@ export default function PagePages() {
 		[ totalItems, totalPages ]
 	);
 
-	const { frontPageId, postsPageId, addNewLabel } = useSelect( ( select ) => {
-		const { getEntityRecord, getPostType } = select( coreStore );
-		const siteSettings = getEntityRecord( 'root', 'site' );
-		return {
-			frontPageId: siteSettings?.page_on_front,
-			postsPageId: siteSettings?.page_for_posts,
-			addNewLabel: getPostType( 'page' )?.labels?.add_new_item,
-		};
-	} );
+	const { frontPageId, postsPageId, addNewLabel, canCreatePage } = useSelect(
+		( select ) => {
+			const { getEntityRecord, getPostType, canUser } =
+				select( coreStore );
+			const siteSettings = getEntityRecord( 'root', 'site' );
+			return {
+				frontPageId: siteSettings?.page_on_front,
+				postsPageId: siteSettings?.page_for_posts,
+				addNewLabel: getPostType( 'page' )?.labels?.add_new_item,
+				canCreatePage: canUser( 'create', 'pages' ),
+			};
+		}
+	);
 
 	const fields = useMemo(
 		() => [
@@ -456,7 +483,10 @@ export default function PagePages() {
 		[ authors, view.type, frontPageId, postsPageId ]
 	);
 
-	const postTypeActions = usePostActions( 'page' );
+	const postTypeActions = usePostActions( {
+		postType: 'page',
+		context: 'list',
+	} );
 	const editAction = useEditPostAction();
 	const actions = useMemo(
 		() => [ editAction, ...postTypeActions ],
@@ -496,7 +526,8 @@ export default function PagePages() {
 		<Page
 			title={ __( 'Pages' ) }
 			actions={
-				addNewLabel && (
+				addNewLabel &&
+				canCreatePage && (
 					<>
 						<Button
 							variant="primary"
@@ -523,7 +554,10 @@ export default function PagePages() {
 				isLoading={ isLoadingPages || isLoadingAuthors }
 				view={ view }
 				onChangeView={ onChangeView }
+				selection={ selection }
+				setSelection={ setSelection }
 				onSelectionChange={ onSelectionChange }
+				getItemId={ getItemId }
 			/>
 		</Page>
 	);

package/src/components/page-pages/style.scss

@@ -43,7 +43,7 @@
 	overflow: hidden;
 	height: 100%;
 	width: 100%;
-	border-radius: 3px 3px 0 0;
+	border-radius: $grid-unit-05;
 
 	&:focus-visible {
 		box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);

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

@@ -354,8 +354,14 @@ export default function DataviewsPatterns() {
 		return filterSortAndPaginate( patterns, viewWithoutFilters, fields );
 	}, [ patterns, view, fields, type ] );
 
-	const templatePartActions = usePostActions( TEMPLATE_PART_POST_TYPE );
-	const patternActions = usePostActions( PATTERN_TYPES.user );
+	const templatePartActions = usePostActions( {
+		postType: TEMPLATE_PART_POST_TYPE,
+		context: 'list',
+	} );
+	const patternActions = usePostActions( {
+		postType: PATTERN_TYPES.user,
+		context: 'list',
+	} );
 	const editAction = useEditPostAction();
 
 	const actions = useMemo( () => {

package/src/components/page-patterns/style.scss

@@ -35,13 +35,6 @@
 		display: flex;
 		flex-direction: column;
 		height: 100%;
-		border-radius: 3px 3px 0 0;
-
-		&.is-viewtype-grid {
-			.block-editor-block-preview__container {
-				border-radius: 3px 3px 0 0;
-			}
-		}
 
 		&.is-viewtype-table {
 			width: 96px;
@@ -62,7 +55,7 @@
 			cursor: pointer;
 			overflow: hidden;
 			height: 100%;
-			border-radius: 3px 3px 0 0;
+			border-radius: $grid-unit-05;
 
 			&:focus-visible {
 				box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);

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

@@ -186,7 +186,9 @@ function Preview( { item, viewType } ) {
 
 export default function PageTemplates() {
 	const { params } = useLocation();
-	const { activeView = 'all', layout } = params;
+	const { activeView = 'all', layout, postId } = params;
+	const [ selection, setSelection ] = useState( [ postId ] );
+
 	const defaultView = useMemo( () => {
 		const usedType = layout ?? DEFAULT_VIEW.type;
 		return {
@@ -323,7 +325,10 @@ export default function PageTemplates() {
 		return filterSortAndPaginate( records, view, fields );
 	}, [ records, view, fields ] );
 
-	const postTypeActions = usePostActions( TEMPLATE_POST_TYPE );
+	const postTypeActions = usePostActions( {
+		postType: TEMPLATE_POST_TYPE,
+		context: 'list',
+	} );
 	const editAction = useEditPostAction();
 	const actions = useMemo(
 		() => [ editAction, ...postTypeActions ],
@@ -366,6 +371,8 @@ export default function PageTemplates() {
 				view={ view }
 				onChangeView={ onChangeView }
 				onSelectionChange={ onSelectionChange }
+				selection={ selection }
+				setSelection={ setSelection }
 			/>
 		</Page>
 	);

package/src/components/page-templates/style.scss

@@ -2,7 +2,6 @@
 	display: flex;
 	flex-direction: column;
 	height: 100%;
-	border-radius: 3px 3px 0 0;
 
 	.page-templates-preview-field__button {
 		box-shadow: none;
@@ -13,7 +12,7 @@
 		cursor: pointer;
 		overflow: hidden;
 		height: 100%;
-		border-radius: 3px;
+		border-radius: $grid-unit-05;
 
 		&:focus-visible {
 			box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
@@ -32,10 +31,6 @@
 		.block-editor-block-preview__container {
 			height: 100%;
 		}
-
-		.page-templates-preview-field__button {
-			border-radius: 3px 3px 0 0;
-		}
 	}
 
 	&.is-viewtype-table {

package/src/components/revisions/index.js

@@ -25,6 +25,7 @@ const {
 	ExperimentalBlockEditorProvider,
 	GlobalStylesContext,
 	useGlobalStylesOutputWithConfig,
+	__unstableBlockStyleVariationOverridesWithConfig,
 } = unlock( blockEditorPrivateApis );
 const { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );
 
@@ -74,7 +75,6 @@ function Revisions( { userConfig, blocks } ) {
 				name="revisions"
 				tabIndex={ 0 }
 			>
-				<EditorStyles styles={ editorStyles } />
 				<style>
 					{
 						// Forming a "block formatting context" to prevent margin collapsing.
@@ -88,6 +88,14 @@ function Revisions( { userConfig, blocks } ) {
 						settings={ settings }
 					>
 						<BlockList renderAppender={ false } />
+						{ /*
+						 * Styles are printed inside the block editor provider,
+						 * so they can access any registered style overrides.
+						 */ }
+						<EditorStyles styles={ editorStyles } />
+						<__unstableBlockStyleVariationOverridesWithConfig
+							config={ mergedConfig }
+						/>
 					</ExperimentalBlockEditorProvider>
 				</Disabled>
 			</Iframe>

package/src/components/sidebar-dataviews/default-views.js

@@ -2,7 +2,15 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { trash, pages, drafts, unseen, inbox } from '@wordpress/icons';
+import {
+	trash,
+	pages,
+	drafts,
+	published,
+	scheduled,
+	pending,
+	notAllowed,
+} from '@wordpress/icons';
 
 /**
  * Internal dependencies
@@ -57,7 +65,7 @@ export const DEFAULT_VIEWS = {
 		{
 			title: __( 'Published' ),
 			slug: 'published',
-			icon: pages,
+			icon: published,
 			view: {
 				...DEFAULT_PAGE_BASE,
 				filters: [
@@ -72,7 +80,7 @@ export const DEFAULT_VIEWS = {
 		{
 			title: __( 'Scheduled' ),
 			slug: 'future',
-			icon: pages,
+			icon: scheduled,
 			view: {
 				...DEFAULT_PAGE_BASE,
 				filters: [
@@ -102,7 +110,7 @@ export const DEFAULT_VIEWS = {
 		{
 			title: __( 'Pending' ),
 			slug: 'pending',
-			icon: inbox,
+			icon: pending,
 			view: {
 				...DEFAULT_PAGE_BASE,
 				filters: [
@@ -117,7 +125,7 @@ export const DEFAULT_VIEWS = {
 		{
 			title: __( 'Private' ),
 			slug: 'private',
-			icon: unseen,
+			icon: notAllowed,
 			view: {
 				...DEFAULT_PAGE_BASE,
 				filters: [