Skip to content

Commit

Permalink
Update: Move pattern actions to the editor package. [take 2] (#61612)
Browse files Browse the repository at this point in the history 
Co-authored-by: jorgefilipecosta <jorgefilipecosta@git.wordpress.org>
Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
  • Loading branch information
@jorgefilipecosta @youknowriad
3 people committed May 16, 2024
1 parent 11897ee commit 471c8b2
Show file tree
Hide file tree
Showing 10 changed files with 312 additions and 297 deletions.
19 changes: 11 additions & 8 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -185,6 +185,7 @@
"caniuse-lite": "1.0.30001579",
"chalk": "4.1.1",
"change-case": "4.1.2",
"client-zip": "^2.4.5",
"commander": "9.2.0",
"concurrently": "3.5.0",
"copy-webpack-plugin": "10.2.0",
Expand Down
1 change: 0 additions & 1 deletion packages/edit-site/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,6 @@
"@wordpress/widgets": "file:../widgets",
"@wordpress/wordcount": "file:../wordcount",
"change-case": "^4.1.2",
"client-zip": "^2.4.4",
"clsx": "^2.1.1",
"colord": "^2.9.2",
"fast-deep-equal": "^3.1.3",
Expand Down
247 changes: 1 addition & 246 deletions packages/edit-site/src/components/page-patterns/dataviews-pattern-actions.js
View file
Original file line number Diff line number Diff line change
@@ -1,33 +1,17 @@
/**
* External dependencies
*/
import { paramCase as kebabCase } from 'change-case';
import { downloadZip } from 'client-zip';

/**
* WordPress dependencies
*/
import { downloadBlob } from '@wordpress/blob';
import { __, _x, sprintf } from '@wordpress/i18n';
import {
Button,
__experimentalHStack as HStack,
__experimentalVStack as VStack,
__experimentalText as Text,
} from '@wordpress/components';

import { useDispatch } from '@wordpress/data';
import { store as noticesStore } from '@wordpress/notices';
import { decodeEntities } from '@wordpress/html-entities';
import { store as reusableBlocksStore } from '@wordpress/reusable-blocks';
import { store as editorStore } from '@wordpress/editor';
import { privateApis as routerPrivateApis } from '@wordpress/router';
import { privateApis as patternsPrivateApis } from '@wordpress/patterns';

/**
* Internal dependencies
*/
import { unlock } from '../../lock-unlock';
import { store as editSiteStore } from '../../store';
import {
PATTERN_TYPES,
TEMPLATE_PART_POST_TYPE,
Expand All @@ -39,235 +23,6 @@ const { useHistory, useLocation } = unlock( routerPrivateApis );
const { CreatePatternModalContents, useDuplicatePatternProps } =
unlock( patternsPrivateApis );

function getJsonFromItem( item ) {
return JSON.stringify(
{
__file: item.type,
title: item.title || item.name,
content: item.patternPost.content.raw,
syncStatus: item.patternPost.wp_pattern_sync_status,
},
null,
2
);
}

export const exportJSONaction = {
id: 'export-pattern',
label: __( 'Export as JSON' ),
supportsBulk: true,
isEligible: ( item ) => item.type === PATTERN_TYPES.user,
callback: async ( items ) => {
if ( items.length === 1 ) {
return downloadBlob(
`${ kebabCase( items[ 0 ].title || items[ 0 ].name ) }.json`,
getJsonFromItem( items[ 0 ] ),
'application/json'
);
}
const nameCount = {};
const filesToZip = items.map( ( item ) => {
const name = kebabCase( item.title || item.name );
nameCount[ name ] = ( nameCount[ name ] || 0 ) + 1;
return {
name: `${
name +
( nameCount[ name ] > 1
? '-' + ( nameCount[ name ] - 1 )
: '' )
}.json`,
lastModified: new Date(),
input: getJsonFromItem( item ),
};
} );
return downloadBlob(
__( 'patterns-export' ) + '.zip',
await downloadZip( filesToZip ).blob(),
'application/zip'
);
},
};

const canDeleteOrReset = ( item ) => {
const isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;
const isUserPattern = item.type === PATTERN_TYPES.user;
return isUserPattern || ( isTemplatePart && item.isCustom );
};

export const deleteAction = {
id: 'delete-pattern',
label: __( 'Delete' ),
isEligible: ( item ) => {
const isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;
const hasThemeFile = isTemplatePart && item.templatePart.has_theme_file;
return canDeleteOrReset( item ) && ! hasThemeFile;
},
hideModalHeader: true,
supportsBulk: true,
RenderModal: ( { items, closeModal, onActionPerformed } ) => {
const { __experimentalDeleteReusableBlock } =
useDispatch( reusableBlocksStore );
const { createErrorNotice, createSuccessNotice } =
useDispatch( noticesStore );
const { removeTemplates } = unlock( useDispatch( editorStore ) );

const deletePattern = async () => {
const promiseResult = await Promise.allSettled(
items.map( ( item ) => {
return __experimentalDeleteReusableBlock( item.id );
} )
);
// If all the promises were fulfilled with success.
if (
promiseResult.every( ( { status } ) => status === 'fulfilled' )
) {
let successMessage;
if ( promiseResult.length === 1 ) {
successMessage = sprintf(
/* translators: The posts's title. */
__( '"%s" deleted.' ),
items[ 0 ].title
);
} else {
successMessage = __( 'The patterns were deleted.' );
}
createSuccessNotice( successMessage, {
type: 'snackbar',
id: 'edit-site-page-trashed',
} );
} else {
// If there was at lease one failure.
let errorMessage;
// If we were trying to delete a single pattern.
if ( promiseResult.length === 1 ) {
if ( promiseResult[ 0 ].reason?.message ) {
errorMessage = promiseResult[ 0 ].reason.message;
} else {
errorMessage = __(
'An error occurred while deleting the pattern.'
);
}
// If we were trying to delete multiple patterns.
} else {
const errorMessages = new Set();
const failedPromises = promiseResult.filter(
( { status } ) => status === 'rejected'
);
for ( const failedPromise of failedPromises ) {
if ( failedPromise.reason?.message ) {
errorMessages.add( failedPromise.reason.message );
}
}
if ( errorMessages.size === 0 ) {
errorMessage = __(
'An error occurred while deleting the patterns.'
);
} else if ( errorMessages.size === 1 ) {
errorMessage = sprintf(
/* translators: %s: an error message */
__(
'An error occurred while deleting the patterns: %s'
),
[ ...errorMessages ][ 0 ]
);
} else {
errorMessage = sprintf(
/* translators: %s: a list of comma separated error messages */
__(
'Some errors occurred while deleting the patterns: %s'
),
[ ...errorMessages ].join( ',' )
);
}
createErrorNotice( errorMessage, {
type: 'snackbar',
} );
}
}
};
const deleteItem = () => {
if ( items[ 0 ].type === TEMPLATE_PART_POST_TYPE ) {
removeTemplates( items );
} else {
deletePattern();
}
if ( onActionPerformed ) {
onActionPerformed();
}
closeModal();
};
let questionMessage;
if ( items.length === 1 ) {
questionMessage = sprintf(
// translators: %s: The page's title.
__( 'Are you sure you want to delete "%s"?' ),
decodeEntities( items[ 0 ].title || items[ 0 ].name )
);
} else if (
items.length > 1 &&
items[ 0 ].type === TEMPLATE_PART_POST_TYPE
) {
questionMessage = sprintf(
// translators: %d: The number of template parts (2 or more).
__( 'Are you sure you want to delete %d template parts?' ),
items.length
);
} else {
questionMessage = sprintf(
// translators: %d: The number of patterns (2 or more).
__( 'Are you sure you want to delete %d patterns?' ),
items.length
);
}
return (
<VStack spacing="5">
<Text>{ questionMessage }</Text>
<HStack justify="right">
<Button variant="tertiary" onClick={ closeModal }>
{ __( 'Cancel' ) }
</Button>
<Button variant="primary" onClick={ deleteItem }>
{ __( 'Delete' ) }
</Button>
</HStack>
</VStack>
);
},
};

export const resetAction = {
id: 'reset-action',
label: __( 'Reset' ),
isEligible: ( item ) => {
const isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;
const hasThemeFile = isTemplatePart && item.templatePart.has_theme_file;
return canDeleteOrReset( item ) && hasThemeFile;
},
hideModalHeader: true,
RenderModal: ( { items, closeModal } ) => {
const [ item ] = items;
const { removeTemplate } = useDispatch( editSiteStore );
return (
<VStack spacing="5">
<Text>
{ __( 'Reset to default and clear all customizations?' ) }
</Text>
<HStack justify="right">
<Button variant="tertiary" onClick={ closeModal }>
{ __( 'Cancel' ) }
</Button>
<Button
variant="primary"
onClick={ () => removeTemplate( item ) }
>
{ __( 'Reset' ) }
</Button>
</HStack>
</VStack>
);
},
};

export const duplicatePatternAction = {
id: 'duplicate-pattern',
label: _x( 'Duplicate', 'action label' ),
Expand Down
18 changes: 4 additions & 14 deletions packages/edit-site/src/components/page-patterns/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,6 @@ import {
OPERATOR_IS,
} from '../../utils/constants';
import {
exportJSONaction,
resetAction,
deleteAction,
duplicatePatternAction,
duplicateTemplatePartAction,
} from './dataviews-pattern-actions';
Expand Down Expand Up @@ -383,20 +380,13 @@ export default function DataviewsPatterns() {
if ( type === TEMPLATE_PART_POST_TYPE ) {
return [
editAction,
...templatePartActions,
duplicateTemplatePartAction,
resetAction,
deleteAction,
...templatePartActions,
].filter( Boolean );
}
return [
editAction,
...patternActions,
duplicatePatternAction,
exportJSONaction,
resetAction,
deleteAction,
].filter( Boolean );
return [ editAction, duplicatePatternAction, ...patternActions ].filter(
Boolean
);
}, [ editAction, type, templatePartActions, patternActions ] );
const onChangeView = useCallback(
( newView ) => {
Expand Down
2 changes: 2 additions & 0 deletions packages/editor/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,8 @@
"@wordpress/url": "file:../url",
"@wordpress/warning": "file:../warning",
"@wordpress/wordcount": "file:../wordcount",
"change-case": "^4.1.2",
"client-zip": "^2.4.5",
"clsx": "^2.1.1",
"date-fns": "^3.6.0",
"deepmerge": "^4.3.0",
Expand Down
Loading

0 comments on commit 471c8b2

Please sign in to comment.