-
Notifications
You must be signed in to change notification settings - Fork 4.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Pages: Add "Set as posts page" action (#67650)
* Move getItemTitle to its own file * Add unset homepage action * Add unset as posts page action * Add set as posts page action * Update homepage action tests * Rename unset options to reset * Reword posts page reset notice * Ensure Move to trash is always at end of list * Update packages/editor/src/components/post-actions/actions.js Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com> * Update packages/editor/src/components/post-actions/reset-homepage.js Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com> * Remove getItemTitle from utils index.js * Remove reset actions * Slight refactor to modal warning in set as posts page action * Remove use of saveEditedEntityRecord * Check for currentPostsPage before setting modalwarning * Add full stop to action success notices --------- Co-authored-by: Aki Hamano <54422211+t-hamano@users.noreply.github.com> Co-authored-by: mikachan <mikachan@git.wordpress.org> Co-authored-by: t-hamano <wildworks@git.wordpress.org> Co-authored-by: oandregal <oandregal@git.wordpress.org> Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org> Co-authored-by: paaljoachim <paaljoachim@git.wordpress.org> Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
- Loading branch information
9 people
authored
Dec 13, 2024
1 parent
24d5f78
commit 9bdbada
Showing
5 changed files
with
251 additions
and
42 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
158 changes: 158 additions & 0 deletions
158
packages/editor/src/components/post-actions/set-as-posts-page.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,158 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { __, sprintf } from '@wordpress/i18n'; | ||
| import { useMemo } from '@wordpress/element'; | ||
| import { | ||
| Button, | ||
| __experimentalText as Text, | ||
| __experimentalHStack as HStack, | ||
| __experimentalVStack as VStack, | ||
| } from '@wordpress/components'; | ||
| import { useDispatch, useSelect } from '@wordpress/data'; | ||
| import { store as coreStore } from '@wordpress/core-data'; | ||
| import { store as noticesStore } from '@wordpress/notices'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { getItemTitle } from '../../utils/get-item-title'; | ||
|
|
||
| const SetAsPostsPageModal = ( { items, closeModal } ) => { | ||
| const [ item ] = items; | ||
| const pageTitle = getItemTitle( item ); | ||
| const { currentPostsPage, isPageForPostsSet, isSaving } = useSelect( | ||
| ( select ) => { | ||
| const { getEntityRecord, isSavingEntityRecord } = | ||
| select( coreStore ); | ||
| const siteSettings = getEntityRecord( 'root', 'site' ); | ||
| const currentPostsPageItem = getEntityRecord( | ||
| 'postType', | ||
| 'page', | ||
| siteSettings?.page_for_posts | ||
| ); | ||
| return { | ||
| currentPostsPage: currentPostsPageItem, | ||
| isPageForPostsSet: siteSettings?.page_for_posts !== 0, | ||
| isSaving: isSavingEntityRecord( 'root', 'site' ), | ||
| }; | ||
| } | ||
| ); | ||
|
|
||
| const { saveEntityRecord } = useDispatch( coreStore ); | ||
| const { createSuccessNotice, createErrorNotice } = | ||
| useDispatch( noticesStore ); | ||
|
|
||
| async function onSetPageAsPostsPage( event ) { | ||
| event.preventDefault(); | ||
|
|
||
| try { | ||
| await saveEntityRecord( 'root', 'site', { | ||
| page_for_posts: item.id, | ||
| show_on_front: 'page', | ||
| } ); | ||
|
|
||
| createSuccessNotice( __( 'Posts page updated.' ), { | ||
| type: 'snackbar', | ||
| } ); | ||
| } catch ( error ) { | ||
| const errorMessage = | ||
| error.message && error.code !== 'unknown_error' | ||
| ? error.message | ||
| : __( 'An error occurred while setting the posts page.' ); | ||
| createErrorNotice( errorMessage, { type: 'snackbar' } ); | ||
| } finally { | ||
| closeModal?.(); | ||
| } | ||
| } | ||
|
|
||
| const modalWarning = | ||
| isPageForPostsSet && currentPostsPage | ||
| ? sprintf( | ||
| // translators: %s: title of the current posts page. | ||
| __( 'This will replace the current posts page: "%s"' ), | ||
| getItemTitle( currentPostsPage ) | ||
| ) | ||
| : __( 'This page will show the latest posts.' ); | ||
|
|
||
| const modalText = sprintf( | ||
| // translators: %1$s: title of the page to be set as the posts page, %2$s: posts page replacement warning message. | ||
| __( 'Set "%1$s" as the posts page? %2$s' ), | ||
| pageTitle, | ||
| modalWarning | ||
| ); | ||
|
|
||
| // translators: Button label to confirm setting the specified page as the posts page. | ||
| const modalButtonLabel = __( 'Set posts page' ); | ||
|
|
||
| return ( | ||
| <form onSubmit={ onSetPageAsPostsPage }> | ||
| <VStack spacing="5"> | ||
| <Text>{ modalText }</Text> | ||
| <HStack justify="right"> | ||
| <Button | ||
| __next40pxDefaultSize | ||
| variant="tertiary" | ||
| onClick={ () => { | ||
| closeModal?.(); | ||
| } } | ||
| disabled={ isSaving } | ||
| accessibleWhenDisabled | ||
| > | ||
| { __( 'Cancel' ) } | ||
| </Button> | ||
| <Button | ||
| __next40pxDefaultSize | ||
| variant="primary" | ||
| type="submit" | ||
| disabled={ isSaving } | ||
| accessibleWhenDisabled | ||
| > | ||
| { modalButtonLabel } | ||
| </Button> | ||
| </HStack> | ||
| </VStack> | ||
| </form> | ||
| ); | ||
| }; | ||
|
|
||
| export const useSetAsPostsPageAction = () => { | ||
| const { pageOnFront, pageForPosts } = useSelect( ( select ) => { | ||
| const { getEntityRecord } = select( coreStore ); | ||
| const siteSettings = getEntityRecord( 'root', 'site' ); | ||
| return { | ||
| pageOnFront: siteSettings?.page_on_front, | ||
| pageForPosts: siteSettings?.page_for_posts, | ||
| }; | ||
| } ); | ||
|
|
||
| return useMemo( | ||
| () => ( { | ||
| id: 'set-as-posts-page', | ||
| label: __( 'Set as posts page' ), | ||
| isEligible( post ) { | ||
| if ( post.status !== 'publish' ) { | ||
| return false; | ||
| } | ||
|
|
||
| if ( post.type !== 'page' ) { | ||
| return false; | ||
| } | ||
|
|
||
| // Don't show the action if the page is already set as the homepage. | ||
| if ( pageOnFront === post.id ) { | ||
| return false; | ||
| } | ||
|
|
||
| // Don't show the action if the page is already set as the page for posts. | ||
| if ( pageForPosts === post.id ) { | ||
| return false; | ||
| } | ||
|
|
||
| return true; | ||
| }, | ||
| RenderModal: SetAsPostsPageModal, | ||
| } ), | ||
| [ pageForPosts, pageOnFront ] | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { decodeEntities } from '@wordpress/html-entities'; | ||
|
|
||
| /** | ||
| * Helper function to get the title of a post item. | ||
| * This is duplicated from the `@wordpress/fields` package. | ||
| * `packages/fields/src/actions/utils.ts` | ||
| * | ||
| * @param {Object} item The post item. | ||
| * @return {string} The title of the item, or an empty string if the title is not found. | ||
| */ | ||
| export function getItemTitle( item ) { | ||
| if ( typeof item.title === 'string' ) { | ||
| return decodeEntities( item.title ); | ||
| } | ||
| if ( item.title && 'rendered' in item.title ) { | ||
| return decodeEntities( item.title.rendered ); | ||
| } | ||
| if ( item.title && 'raw' in item.title ) { | ||
| return decodeEntities( item.title.raw ); | ||
| } | ||
| return ''; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters