From 7a867cebaffa1c6b10d249275bb26daa2e02ba47 Mon Sep 17 00:00:00 2001 From: mburridge Date: Tue, 25 Jul 2023 15:37:31 +0100 Subject: [PATCH 01/11] Adds documentation on selectors --- packages/data/README.md | 46 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/packages/data/README.md b/packages/data/README.md index e9b3a2c192d52..03a2f98309fb5 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1028,6 +1028,52 @@ function Component() { } ``` +## Selectors + +The following selectors are available on the object returned by `wp.data.select( 'core' )`: + +### hasFinishedResolution + +Returns true if resolution has completed for a given selector name, and arguments set. + +_Parameters_ + +- _state_ `State`: Data state. +- _selectorName_ `string`: Selector name. +- _args_ `unknown[]?`: Arguments passed to selector. + +_Returns_ + +- `boolean`: Whether resolution has completed. + +### hasStartedResolution + +Returns true if resolution has already been triggered for a given selector name, and arguments set. + +_Parameters_ + +- _state_ `State`: Data state. +- _selectorName_ `string`: Selector name. +- _args_ `unknown[]?`: Arguments passed to selector. + +_Returns_ + +- `boolean`: Whether resolution has been triggered. + +### isResolving + +Returns true if resolution has been triggered but has not yet completed for a given selector name, and arguments set. + +_Parameters_ + +- _state_ `State`: Data state. +- _selectorName_ `string`: Selector name. +- _args_ `unknown[]?`: Arguments passed to selector. + +_Returns_ + +- `boolean`: Whether resolution is in progress. + ## Going further - [What is WordPress Data?](https://unfoldingneurons.com/2020/what-is-wordpress-data/) From a3e64183e192c09844165127140730664c430820 Mon Sep 17 00:00:00 2001 From: mburridge Date: Tue, 25 Jul 2023 17:15:07 +0100 Subject: [PATCH 02/11] Adds code example for selectors --- packages/data/README.md | 44 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 43 insertions(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index 03a2f98309fb5..93884192174d6 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1030,7 +1030,49 @@ function Component() { ## Selectors -The following selectors are available on the object returned by `wp.data.select( 'core' )`: +The following selectors are available on the object returned by `wp.data.select( 'core' )`. + +_Example_ + +```js +import { store as coreDataStore } from "@wordpress/core-data"; + +function Component() { + + const result = useSelect( + + (select) => { + + const query = { per_page: 20 }; + const selectorArgs = ["postType", "page", query]; + + return { + pages: select(coreDataStore).getEntityRecords(...selectorArgs), + hasStartedResolution: select(coreDataStore).hasStartedResolution( + "getEntityRecords", // _selectorName_ + selectorArgs + ), + hasFinishedResolution: select(coreDataStore).hasFinishedResolution( + "getEntityRecords", + selectorArgs + ), + isResolving: select(coreDataStore).isResolving( + "getEntityRecords", + selectorArgs + ) + }; + }; + ); + + console.log(result.hasStartedResolution); + console.log(result.hasFinishedResolution); + console.log(result.isResolving); + + return ( + // use the result properties here + ) +} +``` ### hasFinishedResolution From aebe8c7c4b9605f6d95214fcf1c3921d81321d9e Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:14:35 +0100 Subject: [PATCH 03/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/data/README.md b/packages/data/README.md index 93884192174d6..d29d1d5d86e1b 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1036,6 +1036,7 @@ _Example_ ```js import { store as coreDataStore } from "@wordpress/core-data"; +import { useSelect } from '@wordpress/data'; function Component() { From a4f9d99b56f3b99e6dd0731cc5a2b8261ef05ee5 Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:18:42 +0100 Subject: [PATCH 04/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index d29d1d5d86e1b..141b41c1d12e1 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1062,7 +1062,7 @@ function Component() { selectorArgs ) }; - }; + } ); console.log(result.hasStartedResolution); From 0e7484e54513000795bbdaa38908335d6d40b97a Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:20:52 +0100 Subject: [PATCH 05/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index 141b41c1d12e1..fe8ff4769b361 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1045,7 +1045,7 @@ function Component() { (select) => { const query = { per_page: 20 }; - const selectorArgs = ["postType", "page", query]; + const selectorArgs = [ "postType", "page", query ]; return { pages: select(coreDataStore).getEntityRecords(...selectorArgs), From f4b00d38ea2b808c30978a01027d18b3f9352521 Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:21:09 +0100 Subject: [PATCH 06/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index fe8ff4769b361..db01f809c496a 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1048,7 +1048,7 @@ function Component() { const selectorArgs = [ "postType", "page", query ]; return { - pages: select(coreDataStore).getEntityRecords(...selectorArgs), + pages: select( coreDataStore ).getEntityRecords( ...selectorArgs ), hasStartedResolution: select(coreDataStore).hasStartedResolution( "getEntityRecords", // _selectorName_ selectorArgs From 21cb274b5068acece6d6ea3b1faaa9c279c192cf Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:21:24 +0100 Subject: [PATCH 07/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index db01f809c496a..9933bdf9efa37 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1049,7 +1049,7 @@ function Component() { return { pages: select( coreDataStore ).getEntityRecords( ...selectorArgs ), - hasStartedResolution: select(coreDataStore).hasStartedResolution( + hasStartedResolution: select( coreDataStore ).hasStartedResolution( "getEntityRecords", // _selectorName_ selectorArgs ), From 14c06a74fdc413c0d16e9d6c0c9e44c98da34bdd Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:21:43 +0100 Subject: [PATCH 08/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index 9933bdf9efa37..211f8955fc6cd 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1053,7 +1053,7 @@ function Component() { "getEntityRecords", // _selectorName_ selectorArgs ), - hasFinishedResolution: select(coreDataStore).hasFinishedResolution( + hasFinishedResolution: select( coreDataStore ).hasFinishedResolution( "getEntityRecords", selectorArgs ), From 1329c3fa00327dfcb76a196e5a016ab238993679 Mon Sep 17 00:00:00 2001 From: Michael Burridge Date: Thu, 27 Jul 2023 16:21:51 +0100 Subject: [PATCH 09/11] Update packages/data/README.md Co-authored-by: Ryan Welcher --- packages/data/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/data/README.md b/packages/data/README.md index 211f8955fc6cd..ae8e5228f24bc 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1057,7 +1057,7 @@ function Component() { "getEntityRecords", selectorArgs ), - isResolving: select(coreDataStore).isResolving( + isResolving: select( coreDataStore ).isResolving( "getEntityRecords", selectorArgs ) From cb8514681956cd9167cd74d689f7eee1b52d5170 Mon Sep 17 00:00:00 2001 From: mburridge Date: Thu, 27 Jul 2023 16:25:17 +0100 Subject: [PATCH 10/11] Updates code example with coding standards --- packages/data/README.md | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/packages/data/README.md b/packages/data/README.md index ae8e5228f24bc..2cd8e776f5c1e 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1042,7 +1042,7 @@ function Component() { const result = useSelect( - (select) => { + ( select ) => { const query = { per_page: 20 }; const selectorArgs = [ "postType", "page", query ]; @@ -1065,13 +1065,16 @@ function Component() { } ); - console.log(result.hasStartedResolution); - console.log(result.hasFinishedResolution); - console.log(result.isResolving); + console.log( result.hasStartedResolution ); + console.log( result.hasFinishedResolutio n); + console.log( result.isResolving ); return ( - // use the result properties here - ) + <> + { + //use the result properties here + } + } ``` From 73afd1e17de9deceb3ae42223cb3f067fc408bec Mon Sep 17 00:00:00 2001 From: mburridge Date: Thu, 27 Jul 2023 17:48:25 +0100 Subject: [PATCH 11/11] Improves code example --- packages/data/README.md | 79 ++++++++++++++++++++++------------------- 1 file changed, 43 insertions(+), 36 deletions(-) diff --git a/packages/data/README.md b/packages/data/README.md index 2cd8e776f5c1e..8ee5213f7f66c 100644 --- a/packages/data/README.md +++ b/packages/data/README.md @@ -1035,46 +1035,53 @@ The following selectors are available on the object returned by `wp.data.select( _Example_ ```js -import { store as coreDataStore } from "@wordpress/core-data"; +import { store as coreDataStore } from '@wordpress/core-data'; import { useSelect } from '@wordpress/data'; function Component() { + const result = useSelect( ( select ) => { + const query = { per_page: 20 }; + const selectorArgs = [ 'postType', 'page', query ]; - const result = useSelect( - - ( select ) => { - - const query = { per_page: 20 }; - const selectorArgs = [ "postType", "page", query ]; - - return { - pages: select( coreDataStore ).getEntityRecords( ...selectorArgs ), - hasStartedResolution: select( coreDataStore ).hasStartedResolution( - "getEntityRecords", // _selectorName_ - selectorArgs - ), - hasFinishedResolution: select( coreDataStore ).hasFinishedResolution( - "getEntityRecords", - selectorArgs - ), - isResolving: select( coreDataStore ).isResolving( - "getEntityRecords", - selectorArgs - ) - }; - } - ); - - console.log( result.hasStartedResolution ); - console.log( result.hasFinishedResolutio n); - console.log( result.isResolving ); - - return ( - <> - { - //use the result properties here - } - + return { + pages: select( coreDataStore ).getEntityRecords( ...selectorArgs ), + hasStartedResolution: select( coreDataStore ).hasStartedResolution( + 'getEntityRecords', // _selectorName_ + selectorArgs + ), + hasFinishedResolution: select( + coreDataStore + ).hasFinishedResolution( 'getEntityRecords', selectorArgs ), + isResolving: select( coreDataStore ).isResolving( + 'getEntityRecords', + selectorArgs + ), + }; + } ); + + if ( result.hasStartedResolution ) { + return <>Fetching data...; + } + + if ( result.isResolving ) { + return ( + <> + { + // show a spinner + } + + ); + } + + if ( result.hasFinishedResolution ) { + return ( + <> + { + // data is ready + } + + ); + } } ```