On creating a new pattern, don't write to the pattern PHP file until you publish #78

kienstra · 2023-02-27T05:53:04Z

Thanks to Kameron for this idea.

Before

On clicking 'Create New Pattern' in the Patterns UI, it wrote a pattern PHP file to the theme, even before you click 'Update Pattern':

After

This only writes a PHP file to the theme when they click 'Create Pattern' (Publish) in the editor:

This makes the editor more like any other post.

Pattern states

Draft: only saved as an auto-draft post, just like any other post-new.php post
Published: saved to a pattern PHP file

New posts now go to wp-admin/post-new.php?post_type=pm_pattern

This means the editor will show the 'Publish' button (which this renames to 'Create Pattern'):

And after it's published (written to a pattern PHP file), it'll show 'Update Pattern':

Before, there was no notion of publishing, as I sidestepped post-new.php, and simply wrote a new pattern PHP file to the theme.

How to test

Go to the Patterns UI
Click 'Create New Pattern'
Go to the active theme's patterns/ directory
Expected: There's no my-new-pattern*.php file yet:

In the editor, add some content to the pattern and click 'Create Pattern'
Go back to the patterns/ directory
Expected: The pattern PHP file is there:

… you publis

kienstra · 2023-02-27T06:02:14Z

wp-modules/editor/model.php

+		? get_new_pattern( get_theme_patterns() )['title']
+		: $post_title;
+}
+add_filter( 'default_title', __NAMESPACE__ . '\get_default_title', 10, 2 );


This is what allows using post-new.php.

We can set the title for new posts on post-new.php:

Because a pattern in post-new.php will not have been published yet (saved as a .php file), there's nowhere else I could find to save the title.

kienstra · 2023-02-27T06:03:57Z

wp-modules/editor/editor.php

@@ -45,6 +45,7 @@ function register_pattern_post_type() {
 			'supports'     => array(
 				'editor',
 				'custom-fields',
+				'title',


This now stores the pattern title in ->post_title.

wp-modules/editor/js/src/components/SidebarPanels/TitlePanel.tsx

kienstra · 2023-02-27T06:05:54Z

wp-modules/editor/model.php

-		);
-	}
-
-	if ( 'create-new' === filter_input( INPUT_GET, 'action' ) ) {


Now that new posts go to post-new.php, we don't need this hack that created a new post and redirected to post.php.

kienstra · 2023-02-27T06:39:02Z

wp-modules/editor/model.php

-		? array_diff_key( $fields, [ 'post_title' => null ] )
-		: $fields;
-}
-add_filter( '_wp_post_revision_fields', __NAMESPACE__ . '\ignore_title_field_in_revisions', 10, 2 );


Not needed anymore, as the title is stored in ->post_title

kienstra · 2023-02-27T19:55:15Z

wp-modules/editor/model.php

-	if ( ! $pattern ) {
-		return;
-	}
+	$pattern = get_pattern_by_name( $post->post_name );


If it's alright, this now stores the pattern name in $post->post_name, not $post->post_title.

This is so we can store the pattern title in the $post->post_title.

post-new.php needs to accept a post with a $post->post_title, so it can have a title like 'My New Pattern 5'.

The reason I moved to store it in post title was this:

This might cause errors.

Interesting, is it appending numbers to the end, like my-new-pattern-1-4 instead of my-new-pattern-1?

This should prevent that, but maybe it isn't:

pattern-manager/wp-modules/editor/model.php

Line 293 in 78616c7

function short_circuit_unique_slug( $slug, $post_ID, $post_status, $post_type, $post_parent, $original_slug ) {

Oh cool! I hadn't noticed that. Should be all good then. Nice

Oh wow! Good to hear!

kienstra · 2023-02-28T00:30:50Z

wp-modules/editor/js/src/index.js

@@ -22,3 +24,6 @@ addAction(
 	'pattern-manager/checkActiveTheme',
 	receiveActiveTheme
 );
+
+// @ts-expect-error the @wordpress/editor store isn't typed.
+dispatch( editorStore ).disablePublishSidebar();


It'd be better to disable the post publish sidebar with a PHP filter:

But there's no good way to filter it because that preference comes from user meta.

kienstra · 2023-02-28T00:51:23Z

wp-modules/editor/js/src/hooks/useSave.ts

@@ -8,7 +9,7 @@ export default function useSave(
 	setPatternNames: ( patternNames: Array< Pattern[ 'name' ] > ) => void
 ) {
 	const isSavingPost = useSelect( ( select: SelectQuery ) => {
-		return select( 'core/editor' ).isSavingPost();
+		return select( editorStore ).isSavingPost();


Just to be consistent with how usePostData calls select( editorStore ) instead of select( 'core/editor' ).

If the store of @wordpress/editor is ever typed, we should get the types from it.

No need for a change to this, just me venting :D

I get why this is the way it is, and why it's better. They do it in Gutenberg too. But it's always a bummer when I'm searching through gutenberg code and I see this variable, because now it means I have to hunt for where that vairable was defined to see what the actual store is.

It has its benefits for sure, though I feel it makes the code slightly harder to reason about. But again, don't change it just for my personal feelings :D

Thanks, it's a fair point. We could do without this.

It's added just so we get the TypeScript types from it if it's ever typed. But who knows if it'll be typed.

I'll change this. It's for something that may never happen (them typing @wordpress/editor), and we can change it if it does happen.

Removed in 78616c7.

kienstra · 2023-02-28T01:39:44Z

wp-modules/editor/css/src/index.scss

-/* When the save button is clicked, hide the pre-publish panel that pops open, as we handle saving in PM. */
-.editor-post-publish-panel {
-	display: none !important;
-}


The pre-publish panel is now disabled in index.js.

Because we're using the editor more like a normal post, with post-new.php, we can't only hide it via CSS anymore.

It'll block publishing.

kienstra · 2023-02-28T01:52:08Z

wp-modules/editor/js/src/types.ts

@@ -14,7 +14,7 @@ export type PostMeta = {
 };

 export type SelectQuery = ( dataStore: string ) => {
-	getEditedPostAttribute: ( postAttribute: string ) => PostMeta;
+	getEditedPostAttribute: ( postAttribute: string ) => unknown;


It feels wrong doing this, but now that usePostData() calls getEditedPostAttribute() with both 'meta' and 'title', this can't be PostMeta.

The return of usePostData() is typed.

It's not actually the saved post, it's the edited post.

kienstra · 2023-02-28T22:36:32Z

Ready for review again.

dreamwhisper

Nice work!

I'm not able to replicate Mike's bug so I'll approve it, but it would be good to get more eyes before merging.

kienstra · 2023-03-01T23:40:37Z

Thanks a lot, @dreamwhisper! Really appreciate your review.

kienstra · 2023-03-02T19:52:09Z

As Michael mentioned, this has a bug where you can't add meta values like Categories to a new pattern.

wp-modules/editor/model.php

There can be another 'name' key and vale, so prevent an error

kienstra · 2023-03-02T23:44:47Z

Hi @mike-day,
Do you still see the bug?

For anyone else:

Steps to reproduce

Go to the Patterns UI
Click 'Createa New Pattern'
Add some content
Edit some meta, like 'Categories'
Click 'Create Pattern':

Go to the pattern PHP file
Expected: It has the meta you edited:

mike-day · 2023-03-03T03:23:37Z

Hi @mike-day, Do you still see the bug?

Nope, it seems to be resolved! In testing right now, the meta is populating in the file as expected 🎉

I did notice something else with the inserter toggle behavior — refer to #87 for an idea on how to cover.

kienstra · 2023-03-03T17:40:18Z

Nope, it seems to be resolved! In testing right now, the meta is populating in the file as expected 🎉

Thanks so much for finding it and verifying it again.

Also, thanks a lot for finding the bug in #87 and working on it.

mike-day

This is really fantastic work, @kienstra! There are some nice changes here that make the app even more intuitive to use when creating a pattern.

Things are working really great in my local — I think we are good to merge.

kienstra · 2023-03-03T17:56:32Z

Thanks so much for your testing and fixes, @mike-day!

kienstra · 2023-03-03T17:56:54Z

@johnstonphilip, any concerns before merging?

johnstonphilip · 2023-03-03T18:10:53Z

@kienstra All good here!

kienstra · 2023-03-03T18:47:46Z

Thanks, Phil! Thanks a lot for your review!

kienstra added 3 commits February 26, 2023 23:50

On creating a new pattern, don't write to the pattern .php file until…

863de51

… you publis

Fix phpcs error

572f5d8

Remove unit tests for deleted function

fe5a897

kienstra commented Feb 27, 2023

View reviewed changes

wp-modules/editor/js/src/components/SidebarPanels/TitlePanel.tsx Outdated Show resolved Hide resolved

kienstra commented Feb 27, 2023

View reviewed changes

Simplify a call to 1 line

aa868a1

kienstra commented Feb 27, 2023

View reviewed changes

kienstra added 3 commits February 27, 2023 17:49

Change the snackbar message on publish to 'Pattern created'

3e9e055

Disable the post publish panel

082e0b5

Remove needless PHP filter

76e772a

kienstra commented Feb 28, 2023

View reviewed changes

kienstra added 2 commits February 27, 2023 18:33

Merge in main, resolve conflict

dc0d756

Fix the regression in typing I introduced

6f07249

kienstra commented Feb 28, 2023

View reviewed changes

kienstra added 8 commits February 27, 2023 18:55

Change get_new_pattern() to get_new_pattern_title()

57736ed

Fix an undefined const error

bbe9b1a

Make the return of get_new_pattern_title() a string

85b0d83

Remove a possibly needless filter

bd85b9e

Add back in a filter that was needed

75c2ac0

Add a filter back in

beae31b

Rename a function

d0182cb

Remove TODO comment that is implemented

9c8020b

kienstra commented Feb 28, 2023

View reviewed changes

kienstra added 2 commits February 27, 2023 19:43

Update a comment

b30923c

Change any to unknown

d80d8c8

kienstra commented Feb 28, 2023

View reviewed changes

Rename usePostData() to useEditedPostData()

19b718b

It's not actually the saved post, it's the edited post.

Move 'patternNames' into AdditionalSidbarProps

2c02efc

kienstra requested review from mike-day and johnstonphilip February 28, 2023 22:36

Remove store import from wordpress/editor

78616c7

dreamwhisper approved these changes Mar 1, 2023

View reviewed changes

kienstra added 4 commits March 2, 2023 16:37

Fix an issue where you couldn't publish with meta like Categories

1ae006c

Ensures the meta keys are registered with the proper type

a413e10

Remove the slug from the defaults

4eeda13

Remove 'title' from the defaults this looks for

2ccd955

kienstra commented Mar 2, 2023

View reviewed changes

wp-modules/editor/model.php Outdated Show resolved Hide resolved

kienstra added 4 commits March 2, 2023 17:10

Actually get the meta value

5465c2e

Correct the expected type for 'viewportWidth'

dcdcd68

Move meta key and value into a separate array

c35e0f1

There can be another 'name' key and vale, so prevent an error

Get the pattern before deleting it

21d1d06

mike-day mentioned this pull request Mar 3, 2023

Toggle the inserter option on by default #87

Closed

Add default value for inserter post meta

4bb8ddc

mike-day approved these changes Mar 3, 2023

View reviewed changes

johnstonphilip approved these changes Mar 3, 2023

View reviewed changes

kienstra merged commit 5e5f69b into main Mar 3, 2023

kienstra deleted the update/new-post branch March 3, 2023 18:48

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

On creating a new pattern, don't write to the pattern PHP file until you publish #78

On creating a new pattern, don't write to the pattern PHP file until you publish #78

kienstra commented Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023

kienstra Feb 27, 2023

kienstra Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023

kienstra Feb 27, 2023 •

edited

Loading

johnstonphilip Mar 1, 2023

kienstra Mar 1, 2023

johnstonphilip Mar 3, 2023

kienstra Mar 3, 2023

kienstra Feb 28, 2023 •

edited

Loading

kienstra Feb 28, 2023

johnstonphilip Mar 1, 2023

kienstra Mar 1, 2023

kienstra Mar 1, 2023

kienstra Mar 1, 2023

kienstra Feb 28, 2023 •

edited

Loading

kienstra Feb 28, 2023 •

edited

Loading

kienstra commented Feb 28, 2023

dreamwhisper left a comment

kienstra commented Mar 1, 2023

kienstra commented Mar 2, 2023

kienstra commented Mar 2, 2023 •

edited

Loading

mike-day commented Mar 3, 2023 •

edited

Loading

kienstra commented Mar 3, 2023

mike-day left a comment

kienstra commented Mar 3, 2023

kienstra commented Mar 3, 2023 •

edited

Loading

johnstonphilip commented Mar 3, 2023

kienstra commented Mar 3, 2023

On creating a new pattern, don't write to the pattern PHP file until you publish #78

On creating a new pattern, don't write to the pattern PHP file until you publish #78

Conversation

kienstra commented Feb 27, 2023 • edited Loading

Before

After

Pattern states

How to test

kienstra Feb 27, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kienstra Feb 27, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kienstra Feb 27, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kienstra Feb 28, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kienstra Feb 28, 2023 • edited Loading

Choose a reason for hiding this comment

kienstra Feb 28, 2023 • edited Loading

Choose a reason for hiding this comment

kienstra commented Feb 28, 2023

dreamwhisper left a comment

Choose a reason for hiding this comment

kienstra commented Mar 1, 2023

kienstra commented Mar 2, 2023

kienstra commented Mar 2, 2023 • edited Loading

Steps to reproduce

mike-day commented Mar 3, 2023 • edited Loading

kienstra commented Mar 3, 2023

mike-day left a comment

Choose a reason for hiding this comment

kienstra commented Mar 3, 2023

kienstra commented Mar 3, 2023 • edited Loading

johnstonphilip commented Mar 3, 2023

kienstra commented Mar 3, 2023

kienstra commented Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023 •

edited

Loading

kienstra Feb 27, 2023 •

edited

Loading

kienstra Feb 28, 2023 •

edited

Loading

kienstra Feb 28, 2023 •

edited

Loading

kienstra Feb 28, 2023 •

edited

Loading

kienstra commented Mar 2, 2023 •

edited

Loading

mike-day commented Mar 3, 2023 •

edited

Loading

kienstra commented Mar 3, 2023 •

edited

Loading