-
Notifications
You must be signed in to change notification settings - Fork 4.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add: Number of templates using a template part and link to see them.
- Loading branch information
1 parent
d9f18e5
commit 024ba52
Showing
7 changed files
with
200 additions
and
8 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
3 changes: 2 additions & 1 deletion
3
packages/editor/src/components/post-last-edited-panel/style.scss
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
82 changes: 82 additions & 0 deletions
82
packages/editor/src/components/post-used-by-panel/index.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,82 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { | ||
| __experimentalText as Text, | ||
| ExternalLink, | ||
| } from '@wordpress/components'; | ||
| import { useSelect } from '@wordpress/data'; | ||
| import { useEntityRecords } from '@wordpress/core-data'; | ||
| import { _n, sprintf } from '@wordpress/i18n'; | ||
| import { createInterpolateElement } from '@wordpress/element'; | ||
| import { addQueryArgs } from '@wordpress/url'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { store as editorStore } from '../../store'; | ||
| import { | ||
| TEMPLATE_PART_POST_TYPE, | ||
| TEMPLATE_POST_TYPE, | ||
| } from '../../store/constants'; | ||
| import useTemplatesFilteredByTemplatePart from '../../utils/use-templates-filtered-by-template-part'; | ||
|
|
||
| function PostUsedByTemplatePartPanel( { templatePartSlug } ) { | ||
| const { records: templates } = useEntityRecords( | ||
| 'postType', | ||
| TEMPLATE_POST_TYPE, | ||
| { | ||
| per_page: -1, | ||
| } | ||
| ); | ||
| const filteredTemplates = useTemplatesFilteredByTemplatePart( | ||
| templatePartSlug, | ||
| templates | ||
| ); | ||
| if ( ! filteredTemplates?.length ) { | ||
| return null; | ||
| } | ||
| return ( | ||
| <Text> | ||
| { createInterpolateElement( | ||
| sprintf( | ||
| /* translators: 1: number of templates. */ | ||
| _n( | ||
| 'Used by <Link>%1$s template</Link>.', | ||
| 'Used by <Link>%1$s templates</Link>.', | ||
| filteredTemplates.length | ||
| ), | ||
| filteredTemplates.length | ||
| ), | ||
| { | ||
| Link: ( | ||
| <ExternalLink | ||
| href={ addQueryArgs( 'site-editor.php', { | ||
| p: '/template', | ||
| usingTemplatePart: templatePartSlug, | ||
| } ) } | ||
| /> | ||
| ), | ||
| } | ||
| ) } | ||
| </Text> | ||
| ); | ||
| } | ||
|
|
||
| export default function PostUsedByPanel() { | ||
| const { postType, slug } = useSelect( ( select ) => { | ||
| select( editorStore ).getCurrentPostType(); | ||
| return { | ||
| postType: select( editorStore ).getCurrentPostType(), | ||
| slug: select( editorStore ).getCurrentPostAttribute( 'slug' ), | ||
| }; | ||
| }, [] ); | ||
| if ( postType !== TEMPLATE_PART_POST_TYPE ) { | ||
| return null; | ||
| } | ||
| return ( | ||
| <div className="editor-post-used-by-panel"> | ||
| <PostUsedByTemplatePartPanel templatePartSlug={ slug } /> | ||
| </div> | ||
| ); | ||
| } |
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
60 changes: 60 additions & 0 deletions
60
packages/editor/src/utils/use-templates-filtered-by-template-part.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,60 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { useEffect, useState } from '@wordpress/element'; | ||
| import { parse } from '@wordpress/blocks'; | ||
|
|
||
| function findBlock( blocks, isMatch ) { | ||
| if ( ! Array.isArray( blocks ) ) { | ||
| return; | ||
| } | ||
| for ( const block of blocks ) { | ||
| if ( isMatch( block ) ) { | ||
| return block; | ||
| } | ||
| const childResult = findBlock( block.innerBlocks, isMatch ); | ||
| if ( childResult ) { | ||
| return childResult; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| export default function useTemplatesFilteredByTemplatePart( | ||
| templatePartSlug, | ||
| templates | ||
| ) { | ||
| const [ result, setResult ] = useState( [] ); | ||
| // We are using a timeout and an effect just to make sure | ||
| // the parsing of templates is done asynchronously and does not blocks | ||
| // the rendering of the page. | ||
| useEffect( () => { | ||
| if ( ! templatePartSlug || ! templates ) { | ||
| return; | ||
| } | ||
| const timeoutId = setTimeout( () => { | ||
| setResult( | ||
| templates.filter( ( template ) => { | ||
| if ( template?.content?.raw ) { | ||
| const blocks = parse( template.content.raw ); | ||
| return !! findBlock( blocks, ( block ) => { | ||
| return ( | ||
| block.name === 'core/template-part' && | ||
| block.attributes.slug === templatePartSlug | ||
| ); | ||
| } ); | ||
| } | ||
| return false; | ||
| } ) | ||
| ); | ||
| }, 0 ); | ||
| return () => { | ||
| if ( timeoutId ) { | ||
| clearTimeout( timeoutId ); | ||
| } | ||
| }; | ||
| } ); | ||
| if ( ! templatePartSlug || ! templates ) { | ||
| return templates; | ||
| } | ||
| return result; | ||
| } |