Skip to content

Commit

Permalink
Interactivity API docs: Fix WP version, update new store docs (#59107)
Browse files Browse the repository at this point in the history
* Fix WP version, update new store docs

* Address changes

* Remove not needed note

Co-authored-by: c4rl0sbr4v0 <cbravobernal@git.wordpress.org>
Co-authored-by: SantosGuillamot <santosguillamot@git.wordpress.org>
  • Loading branch information
3 people authored Feb 20, 2024
1 parent 55b032f commit 3888f1e
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 21 deletions.
6 changes: 2 additions & 4 deletions packages/interactivity/docs/1-getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,15 +51,13 @@ At this point you should be able to insert the "My First Interactive Block" bloc

To start working with the Interactivity API you'll need to have a [proper WordPress development environment for blocks](https://developer.wordpress.org/block-editor/getting-started/devenv/) and some specific code in your block, which should include:

#### A local WordPress installation
#### A local 6.5 WordPress installation

You can use [the tools to set your local WordPress environment](https://developer.wordpress.org/block-editor/getting-started/devenv/#wordpress-development-site) you feel more comfortable with.

To get quickly started, [`wp-now`](https://www.npmjs.com/package/@wp-now/wp-now) is the easiest way to get a WordPress site up and running locally.

#### Latest vesion of Gutenberg

The Interactivity API is currently only available as an experimental feature from Gutenberg, so you'll need to have Gutenberg 17.5 or higher version installed and activated in your WordPress installation.
Interactivity API is included in Core in WordPress 6.5, for versions below, you'll need to have Gutenberg 17.5 or higher version installed and activated in your WordPress installation.

#### Node.js

Expand Down
25 changes: 8 additions & 17 deletions packages/interactivity/docs/2-api-reference.md
Original file line number Diff line number Diff line change
Expand Up @@ -917,40 +917,31 @@ store( "myPlugin", {

#### On the server side

> **Note**
> We will rename `wp_store` to `wp_initial_state` in a future version.
The state can also be initialized on the server using the `wp_store()` function. You would typically do this in the `render.php` file of your block (the `render.php` templates were [introduced](https://make.wordpress.org/core/2022/10/12/block-api-changes-in-wordpress-6-1/) in WordPress 6.1).
The state can also be initialized on the server using the `wp_interactivity_state()` function. You would typically do this in the `render.php` file of your block (the `render.php` templates were [introduced](https://make.wordpress.org/core/2022/10/12/block-api-changes-in-wordpress-6-1/) in WordPress 6.1).

The state defined on the server with `wp_store()` gets merged with the stores defined in the view.js files.
The state defined on the server with `wp_interactivity_state()` gets merged with the stores defined in the view.js files.

The `wp_store` function receives an [associative array](https://www.php.net/manual/en/language.types.array.php) as a parameter.
The `wp_interactivity_state` function receives two arguments, a `string` with the namespace that will be used as a reference and an [associative array](https://www.php.net/manual/en/language.types.array.php) containing the values.

_Example of store initialized from the server with a `state` = `{ someValue: 123 }`_

```php
// render.php
wp_store( array(
'myPlugin' => array(
'someValue' = 123
)
);
wp_interactivity_state( 'myPlugin', array (
'someValue' => get_some_value()
));
```

Initializing the state in the server also allows you to use any WordPress API. For example, you could use the Core Translation API to translate part of your state:

```php
// render.php
wp_store(
array(
"favoriteMovies" => array(
wp_interactivity_state( 'favoriteMovies', array(
"1" => array(
"id" => "123-abc",
"movieName" => __("someMovieName", "textdomain")
),
),
)
);
) );
```

### Private stores
Expand Down

0 comments on commit 3888f1e

Please sign in to comment.