Skip to content

Commit

Permalink
Merge branch 'WordPress:trunk' into fix/localized-link-suggestions-po…
Browse files Browse the repository at this point in the history
…sttype
  • Loading branch information
petitphp authored Feb 5, 2024
2 parents 5f64b37 + 4a16dd2 commit e988afe
Show file tree
Hide file tree
Showing 99 changed files with 3,103 additions and 991 deletions.
5 changes: 0 additions & 5 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,11 +46,6 @@ const restrictedImports = [
name: 'lodash',
message: 'Please use native functionality instead.',
},
{
name: 'reakit',
message:
'Please use Reakit API through `@wordpress/components` instead.',
},
{
name: '@ariakit/react',
message:
Expand Down
17 changes: 17 additions & 0 deletions changelog.txt
Original file line number Diff line number Diff line change
@@ -1,5 +1,22 @@
== Changelog ==

= 17.6.1 =


## Changelog

### Font Library

- Make the API compatible with the upcoming Core patch. ([58671](https://github.com/WordPress/gutenberg/pull/58671))


## Contributors

The following contributors merged PRs in this release:

@youknowriad


= 17.6.0 =

## Changelog
Expand Down
59 changes: 28 additions & 31 deletions docs/README.md

Large diffs are not rendered by default.

38 changes: 20 additions & 18 deletions docs/explanations/architecture/entities.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
# Entities and Undo/Redo.
# Entities and Undo/Redo

The WordPress editors, whether it's the post or site editor, manipulate what we call entity records. These are objects that represent a post, a page, a user, a term, a template, etc. They are the data that is stored in the database and that is manipulated by the editor. Each editor can fetch, edit and save multiple entity records at the same time.
The WordPress editors, whether it's the Post or Site Editor, manipulate what we call entity records. These are objects that represent a post, a page, a user, a term, a template, etc. They are the data that is stored in the database, and that is manipulated by the editor. Each editor can fetch, edit, and save multiple entity records at the same time.

For instance, when opening a page in the site editor:
- you can edit properties of the page itself (title, content...)
- you can edit properties of the template of the page (content of the template, design...)
- you can edit properties of template parts (header, footer) used with the template.
For instance, when opening a page in the Site Editor:

- You can edit properties of the page itself (title, content, etc.)
- You can edit properties of the template of the page (content of the template, design, etc.)
- You can edit properties of template parts (header, footer) used with the template.

The editor keeps track of all these modifications and orchestrates the saving of all these modified records. This happens within the `@wordpress/core-data` package.

Expand All @@ -18,13 +19,14 @@ To be able to edit an entity, you need to first fetch it and load it into the `c
wp.data.select( 'core' ).getEntityRecord( 'postType', 'post', 1 );
````

Once the entity is loaded, you can edit it. For example, the following code sets the title of the post to "Hello World". For each fetched entity record, the `core-data` store keeps track of:
- the "persisted" record: The last state of the record as it was fetched from the backend.
- A list of "edits": Unsaved local modifications for one or several properties of the record.
Once the entity is loaded, you can edit it. For example, the following code sets the title of the post to "Hello World". For each fetched entity record, the `core-data` store keeps track of the following:

- **The "persisted" record:** The last state of the record as it was fetched from the backend.
- **A list of "edits":** Unsaved local modifications for one or several properties of the record.

The package also exposes a set of actions to manipulate the fetched entity records.

To edit an entity record, you can call `editEntityRecord`, which takes the entity type, the entity ID and the new entity record as parameters. The following example sets the title of the post with ID 1 to "Hello World".
To edit an entity record, you can call `editEntityRecord`, which takes the entity type, the entity ID, and the new entity record as parameters. The following example sets the title of the post with ID 1 to "Hello World".

````js
wp.data.dispatch( 'core' ).editEntityRecord( 'postType', 'post', 1, { title: 'Hello World' } );
Expand All @@ -42,27 +44,27 @@ Since the WordPress editors allow multiple entity records to be edited at the sa

And to be able to perform both undo and redo operations properly, each modification in the list of edits contains the following information:

- Entity kind and name: Each entity in core-data is identified by the pair _(kind, name)_. This corresponds to the identifier of the modified entity.
- Entity Record ID: The ID of the modified record.
- Property: The name of the modified property.
- From: The previous value of the property (needed to apply the undo operation).
- To: The new value of the property (needed to apply the redo operation).
- **Entity kind and name:** Each entity in core-data is identified by the pair _(kind, name)_. This corresponds to the identifier of the modified entity.
- **Entity Record ID:** The ID of the modified record.
- **Property:** The name of the modified property.
- **From:** The previous value of the property (needed to apply the undo operation).
- **To:** The new value of the property (needed to apply the redo operation).

For example, let's say a user edits the title of a post, followed by a modification to the post slug, and then a modification of the title of a reusable block used with the post. The following information is stored in the undo/redo stack:

- `[ { kind: 'postType', name: 'post', id: 1, property: 'title', from: '', to: 'Hello World' } ]`
- `[ { kind: 'postType', name: 'post', id: 1, property: 'slug', from: 'Previous slug', to: 'This is the slug of the hello world post' } ]`
- `[ { kind: 'postType', name: 'wp_block', id: 2, property: 'title', from: 'Reusable Block', to: 'Awesome Reusable Block' } ]`

The store also keep tracks of a "pointer" to the current "undo/redo" step. By default, the pointer always points to the last item in the stack. This pointer is updated when the user performs an undo or redo operation.
The store also keeps track of a "pointer" to the current "undo/redo" step. By default, the pointer always points to the last item in the stack. This pointer is updated when the user performs an undo or redo operation.

### Cached changes

The undo/redo core behavior also supports what we call "cached modifications". These are modifications that are not stored in the undo/redo stack right away. For instance, when a user starts typing in a text field, the value of the field is modified in the store, but this modification is not stored in the undo/redo stack until after the user moves to the next word or after a few milliseconds. This is done to avoid creating a new undo/redo step for each character typed by the user.

Cached changes are kept outside the undo/redo stack in what is called a "cache" of modifications and these modifications are only stored in the undo/redo stack when we explicitely call `__unstableCreateUndoLevel` or when the next modification is not a cached one.
Cached changes are kept outside the undo/redo stack in what is called a "cache" of modifications, and these modifications are only stored in the undo/redo stack when we explicitly call `__unstableCreateUndoLevel` or when the next modification is not a cached one.

By default all calls to `editEntityRecord` are considered "non-cached" unless the `isCached` option is passed as true. Example:
By default, all calls to `editEntityRecord` are considered "non-cached" unless the `isCached` option is passed as true. Example:

```js
wp.data.dispatch( 'core' ).editEntityRecord( 'postType', 'post', 1, { title: 'Hello World' }, { isCached: true } );
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ Without a build process, you access the methods directly from the `wp` global ob
So, for example if a script wants to register a block variation using the `registerBlockVariation` method out of the ["blocks" package](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-blocks/), the `wp-blocks` handle would need to get added to the dependency array to ensure that `wp.blocks.registerBlockVariation` is defined when the script tries to access it (see [example](https://github.com/wptrainingteam/block-theme-examples/blob/master/example-block-variation/functions.php)).

<div class="callout callout-tip">
Try running <code>wp.data.select('core/editor').getBlocks())</code> in your browser's dev tools while editing a post or a site. The entire editor is available from the console.
Try running <code>wp.data.select('core/editor').getBlocks()</code> in your browser's dev tools while editing a post or a site. The entire editor is available from the console.
</div>

Use [`enqueue_block_editor_assets`](https://developer.wordpress.org/reference/hooks/enqueue_block_editor_assets/) hook coupled with the standard [`wp_enqueue_script`](https://developer.wordpress.org/reference/functions/wp_enqueue_script/) (and [`wp_register_script`](https://developer.wordpress.org/reference/functions/wp_register_script/)) to enqueue javascript assets for the Editor with access to these packages via `wp` (see [example](https://github.com/wptrainingteam/block-theme-examples/tree/master/example-block-variation)). Refer to [Enqueueing assets in the Editor](https://developer.wordpress.org/block-editor/how-to-guides/enqueueing-assets-in-the-editor/) for more info.
Expand Down
Loading

0 comments on commit e988afe

Please sign in to comment.