Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Post Type Actions: Unify the list of available actions #61520

Merged
merged 5 commits into from
May 10, 2024
Merged

Post Type Actions: Unify the list of available actions #61520

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
1c04332
Post Type Actions: Unify the list of available actions
youknowriad May 9, 2024
1364cc5
Add PostType argument
youknowriad May 9, 2024
3527dda
Simplify pattern actions
youknowriad May 9, 2024
4b6b24f
Move the edit action into the site editor
youknowriad May 9, 2024
6ac0c80
Fix typo
youknowriad May 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 38 additions & 0 deletions packages/edit-site/src/components/dataviews-actions/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
/**
* WordPress dependencies
*/
import { __ } from '@wordpress/i18n';
import { edit } from '@wordpress/icons';
import { useMemo } from '@wordpress/element';
import { privateApis as routerPrivateApis } from '@wordpress/router';

/**
* Internal dependencies
*/
import { unlock } from '../../lock-unlock';

const { useHistory } = unlock( routerPrivateApis );

export const useEditPostAction = () => {
const history = useHistory();
return useMemo(
() => ( {
id: 'edit-post',
label: __( 'Edit' ),
isPrimary: true,
icon: edit,
isEligible( { status } ) {
return status !== 'trash';
},
callback( items ) {
const post = items[ 0 ];
history.push( {
postId: post.id,
postType: post.type,
canvas: 'edit',
} );
},
} ),
[ history ]
);
};
46 changes: 8 additions & 38 deletions packages/edit-site/src/components/page-pages/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,11 +32,10 @@ import {
import AddNewPageModal from '../add-new-page';
import Media from '../media';
import { unlock } from '../../lock-unlock';
import { useEditPostAction } from '../dataviews-actions';

const { usePostActions } = unlock( editorPrivateApis );

const { useLocation, useHistory } = unlock( routerPrivateApis );

const EMPTY_ARRAY = [];

function useView( postType ) {
Expand Down Expand Up @@ -188,29 +187,6 @@ function FeaturedImage( { item, viewType } ) {
);
}

let PAGE_ACTIONS = [
'edit-post',
'view-post',
'restore',
'permanently-delete',
'view-post-revisions',
'rename-post',
'move-to-trash',
];

if ( process.env.IS_GUTENBERG_PLUGIN ) {
PAGE_ACTIONS = [
'edit-post',
'view-post',
'restore',
'permanently-delete',
'view-post-revisions',
'duplicate-post',
'rename-post',
'move-to-trash',
];
}

export default function PagePages() {
const postType = 'page';
const [ view, setView ] = useView( postType );
Expand Down Expand Up @@ -360,20 +336,14 @@ export default function PagePages() {
],
[ authors, view.type ]
);
const onActionPerformed = useCallback(
( actionId, items ) => {
if ( actionId === 'edit-post' ) {
const post = items[ 0 ];
history.push( {
postId: post.id,
postType: post.type,
canvas: 'edit',
} );
}
},
[ history ]

const postTypeActions = usePostActions( 'page' );
const editAction = useEditPostAction();
const actions = useMemo(
() => [ editAction, ...postTypeActions ],
[ postTypeActions, editAction ]
);
const actions = usePostActions( onActionPerformed, PAGE_ACTIONS );

const onChangeView = useCallback(
( newView ) => {
if ( newView.type !== view.type ) {
Expand Down
89 changes: 0 additions & 89 deletions packages/edit-site/src/components/page-patterns/dataviews-pattern-actions.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,11 @@ import { downloadBlob } from '@wordpress/blob';
import { __, _x, sprintf } from '@wordpress/i18n';
import {
Button,
TextControl,
__experimentalHStack as HStack,
__experimentalVStack as VStack,
__experimentalText as Text,
} from '@wordpress/components';
import { store as coreStore } from '@wordpress/core-data';
import { useDispatch } from '@wordpress/data';
import { useState } from '@wordpress/element';
import { store as noticesStore } from '@wordpress/notices';
import { decodeEntities } from '@wordpress/html-entities';
import { store as reusableBlocksStore } from '@wordpress/reusable-blocks';
Expand Down Expand Up @@ -91,92 +88,6 @@ export const exportJSONaction = {
},
};

export const renameAction = {
id: 'rename-pattern',
label: __( 'Rename' ),
isEligible: ( item ) => {
const isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;
const isUserPattern = item.type === PATTERN_TYPES.user;
const isCustomPattern =
isUserPattern || ( isTemplatePart && item.isCustom );
const hasThemeFile = isTemplatePart && item.templatePart.has_theme_file;
return isCustomPattern && ! hasThemeFile;
},
RenderModal: ( { items, closeModal } ) => {
const [ item ] = items;
const [ title, setTitle ] = useState( () => item.title );
const { editEntityRecord, saveEditedEntityRecord } =
useDispatch( coreStore );
const { createSuccessNotice, createErrorNotice } =
useDispatch( noticesStore );
async function onRename( event ) {
event.preventDefault();
try {
await editEntityRecord( 'postType', item.type, item.id, {
title,
} );
// Update state before saving rerenders the list.
setTitle( '' );
closeModal();
// Persist edited entity.
await saveEditedEntityRecord( 'postType', item.type, item.id, {
throwOnError: true,
} );
createSuccessNotice(
item.type === TEMPLATE_PART_POST_TYPE
? __( 'Template part renamed.' )
: __( 'Pattern renamed.' ),
{ type: 'snackbar' }
);
} catch ( error ) {
const fallbackErrorMessage =
item.type === TEMPLATE_PART_POST_TYPE
? __(
'An error occurred while renaming the template part.'
)
: __( 'An error occurred while renaming the pattern.' );
const errorMessage =
error.message && error.code !== 'unknown_error'
? error.message
: fallbackErrorMessage;
createErrorNotice( errorMessage, { type: 'snackbar' } );
}
}
return (
<form onSubmit={ onRename }>
<VStack spacing="5">
<TextControl
__nextHasNoMarginBottom
__next40pxDefaultSize
label={ __( 'Name' ) }
value={ title }
onChange={ setTitle }
required
/>
<HStack justify="right">
<Button
__next40pxDefaultSize
variant="tertiary"
onClick={ () => {
closeModal();
} }
>
{ __( 'Cancel' ) }
</Button>
<Button
__next40pxDefaultSize
variant="primary"
type="submit"
>
{ __( 'Save' ) }
</Button>
</HStack>
</VStack>
</form>
);
},
};

const canDeleteOrReset = ( item ) => {
const isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;
const isUserPattern = item.type === PATTERN_TYPES.user;
Expand Down
40 changes: 12 additions & 28 deletions packages/edit-site/src/components/page-patterns/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,6 @@ import {
} from '../../utils/constants';
import {
exportJSONaction,
renameAction,
resetAction,
deleteAction,
duplicatePatternAction,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All of these actions need to be moved to the editor/post-actions hook rather than being specific to dataviews. I'm not doing that in this PR though.

Expand All @@ -60,12 +59,13 @@ import usePatterns from './use-patterns';
import PatternsHeader from './header';
import { useLink } from '../routes/link';
import { useAddedBy } from '../page-templates/hooks';
import { useEditPostAction } from '../dataviews-actions';

const { ExperimentalBlockEditorProvider, useGlobalStyle } = unlock(
blockEditorPrivateApis
);
const { usePostActions } = unlock( editorPrivateApis );
const { useHistory, useLocation } = unlock( routerPrivateApis );
const { useLocation } = unlock( routerPrivateApis );

const EMPTY_ARRAY = [];
const defaultConfigPerViewType = {
Expand Down Expand Up @@ -375,45 +375,29 @@ export default function DataviewsPatterns() {
return filterSortAndPaginate( patterns, viewWithoutFilters, fields );
}, [ patterns, view, fields, type ] );

const history = useHistory();
const onActionPerformed = useCallback(
( actionId, items ) => {
if ( actionId === 'edit-post' ) {
const post = items[ 0 ];
history.push( {
postId: post.id,
postType: post.type,
categoryId,
categoryType: type,
canvas: 'edit',
} );
}
},
[ history, categoryId, type ]
);
const [ editAction, viewRevisionsAction ] = usePostActions(
onActionPerformed,
[ 'edit-post', 'view-post-revisions' ]
);
const templatePartActions = usePostActions( TEMPLATE_PART_POST_TYPE );
const patternActions = usePostActions( PATTERN_TYPES.user );
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm ever more convinced we should drop these constants across patterns, dataviews, etc. It's easy to waste 30 seconds, which become 1.5 minutes with the ensuing distractions, especially when the LSP can't trace the identifier to its type/definition due to the opaque unlock membrane... just to confirm that PATTERN_TYPES.user is 'wp_block'. These aren't obscure values, they are standard post types and other such values.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe open a PR and see what folks say about it :)

const editAction = useEditPostAction();

const actions = useMemo( () => {
if ( type === TEMPLATE_PART_POST_TYPE ) {
return [
editAction,
renameAction,
...templatePartActions,
duplicateTemplatePartAction,
viewRevisionsAction,
resetAction,
deleteAction,
];
].filter( Boolean );
}
return [
renameAction,
editAction,
...patternActions,
duplicatePatternAction,
exportJSONaction,
resetAction,
deleteAction,
];
}, [ type, editAction, viewRevisionsAction ] );
].filter( Boolean );
}, [ editAction, type, templatePartActions, patternActions ] );
const onChangeView = useCallback(
( newView ) => {
if ( newView.type !== view.type ) {
Expand Down
28 changes: 6 additions & 22 deletions packages/edit-site/src/components/page-templates/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ import {

import usePatternSettings from '../page-patterns/use-pattern-settings';
import { unlock } from '../../lock-unlock';
import { useEditPostAction } from '../dataviews-actions';

const { usePostActions } = unlock( editorPrivateApis );

Expand Down Expand Up @@ -183,14 +184,6 @@ function Preview( { item, viewType } ) {
);
}

const TEMPLATE_ACTIONS = [
'edit-post',
'reset-template',
'rename-template',
'view-post-revisions',
'delete-template',
];

export default function PageTemplates() {
const { params } = useLocation();
const { activeView = 'all', layout } = params;
Expand Down Expand Up @@ -330,22 +323,13 @@ export default function PageTemplates() {
return filterSortAndPaginate( records, view, fields );
}, [ records, view, fields ] );

const onActionPerformed = useCallback(
( actionId, items ) => {
if ( actionId === 'edit-post' ) {
const post = items[ 0 ];
history.push( {
postId: post.id,
postType: post.type,
canvas: 'edit',
} );
}
},
[ history ]
const postTypeActions = usePostActions( TEMPLATE_POST_TYPE );
const editAction = useEditPostAction();
const actions = useMemo(
() => [ editAction, ...postTypeActions ],
[ postTypeActions, editAction ]
);

const actions = usePostActions( onActionPerformed, TEMPLATE_ACTIONS );

const onChangeView = useCallback(
( newView ) => {
if ( newView.type !== view.type ) {
Expand Down
Loading
Loading