Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

dev: added xstate inspector toggling (#38022) 

* dev: added xstate inspector toggling

* dev: added eslint-plugin-xstate
This commit is contained in:
RJ 2023-04-28 17:30:52 +10:00 committed by GitHub
parent 6d02b0a00e
commit d15f62241f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 126 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
plugins/woocommerce-admin/.eslintrc.js
View File

@ -1,5 +1,6 @@
module.exports = {
extends: [ 'plugin:@woocommerce/eslint-plugin/recommended' ],
extends: [ 'plugin:@woocommerce/eslint-plugin/recommended', 'plugin:xstate/all' ],
plugins: [ 'xstate' ],
root: true,
overrides: [
{

7
plugins/woocommerce-admin/client/core-profiler/index.tsx
View File

@ -14,13 +14,6 @@ import { UserProfile } from './pages/UserProfile';
import { BusinessInfo } from './pages/BusinessInfo';
import { BusinessLocation } from './pages/BusinessLocation';
/** Uncomment below to display xstate inspector during development */
// import { inspect } from '@xstate/inspect';
// inspect( {
// // url: 'https://stately.ai/viz?inspect', // (default)
// iframe: false, // open in new window
// } );
// TODO: Typescript support can be improved, but for now lets write the types ourselves
// https://stately.ai/blog/introducing-typescript-typegen-for-xstate

1
plugins/woocommerce-admin/client/index.js
View File

@ -18,6 +18,7 @@ import { PageLayout, EmbedLayout, PrimaryLayout as NoticeArea } from './layout';
import { EmbeddedBodyLayout } from './embedded-body-layout';
import { WcAdminPaymentsGatewaysBannerSlot } from './payments/payments-settings-banner-slotfill';
import { WcAdminConflictErrorSlot } from './settings/conflict-error-slotfill.js';
import './xstate.js';
// Modify webpack pubilcPath at runtime based on location of WordPress Plugin.
// eslint-disable-next-line no-undef,camelcase

30
plugins/woocommerce-admin/client/xstate.js Normal file
View File

@ -0,0 +1,30 @@
/**
* This script configures the XState development tools in the
* development environment. It should not be included in production.
*
* To enable the XState inspector, open the browser console and type:
* localStorage.setItem("xstate_inspect", "true")
*/
async function enableXStateInspect() {
const { inspect } = await import( '@xstate/inspect' );
const { Interpreter } = await import( 'xstate' );
// configure the XState inspector to open in a new tab
inspect( {
url: 'https://stately.ai/viz?inspect',
iframe: false,
} );
// configure all XServices to use the inspector
Interpreter.defaultOptions.devTools = true;
// eslint-disable-next-line no-console
console.log(
'Devtools: XState inspector enabled for WooCommerce Admin. To disable, type localStorage.setItem("xstate_inspect", "false")'
);
}
if (
process.env.NODE_ENV === 'development' &&
window.localStorage.getItem( 'xstate_inspect' ) === 'true'
) {
enableXStateInspect();
}

1
plugins/woocommerce-admin/package.json
View File

@ -190,6 +190,7 @@
"eslint-import-resolver-webpack": "^0.13.2",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-react": "^7.29.2",
"eslint-plugin-xstate": "^1.1.0",
"expose-loader": "^3.1.0",
"fork-ts-checker-webpack-plugin": "^6.5.0",
"jest": "^27.5.1",

6
plugins/woocommerce/changelog/dev-xstate-inspector-toggling Normal file
View File

@ -0,0 +1,6 @@
Significance: patch
Type: dev
Added xstate inspector toggling via localStorage flag and dev node environment, and eslint xstate plugin

88
pnpm-lock.yaml
View File

@ -2845,6 +2845,9 @@ importers:
eslint-plugin-react:
specifier: ^7.29.2
version: 7.29.4(eslint@8.32.0)
eslint-plugin-xstate:
specifier: ^1.1.0
version: 1.1.0(eslint@8.32.0)
expose-loader:
specifier: ^3.1.0
version: 3.1.0(webpack@5.70.0)
@ -8689,9 +8692,9 @@ packages:
'@babel/core': 7.21.3
'@babel/helper-annotate-as-pure': 7.16.7
'@babel/helper-module-imports': 7.16.7
'@babel/helper-plugin-utils': 7.18.9
'@babel/helper-plugin-utils': 7.20.2
'@babel/plugin-syntax-jsx': 7.16.7(@babel/core@7.21.3)
'@babel/types': 7.17.0
'@babel/types': 7.21.3
dev: true
/@babel/plugin-transform-react-jsx@7.19.0(@babel/core@7.12.9):
@ -26083,6 +26086,19 @@ packages:
eslint: 8.32.0
dev: true
/eslint-plugin-xstate@1.1.0(eslint@8.32.0):
resolution: {integrity: sha512-NKgrV/YwwJvKXDq+cTERgLLTxBr7Uxsz2NZYic3e1sqcs7u56uRZDWDk6q7pYquNqqX2AT5X8Urn6qHs4lv8PQ==}
engines: {node: '>=8.0.0'}
peerDependencies:
eslint: ^7.1.0||^8.17.0
dependencies:
eslint: 8.32.0
lodash.camelcase: 4.3.0
lodash.snakecase: 4.1.1
lodash.upperfirst: 4.3.1
sanctuary: 3.1.0
dev: true
/eslint-scope@4.0.3:
resolution: {integrity: sha512-p7VutNr1O/QrxysMo3E45FjYDTeXBy0iTltPFNSqKAIfjDSXC+4dj+qfyuD8bfAXrW/y6lW3O76VaYNPKfpKrg==}
engines: {node: '>=4.0.0'}
@ -33250,6 +33266,10 @@ packages:
resolution: {integrity: sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=}
dev: true
/lodash.camelcase@4.3.0:
resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==}
dev: true
/lodash.debounce@4.0.8:
resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==}
@ -33321,6 +33341,10 @@ packages:
resolution: {integrity: sha512-V/rTAABKLFjoecTZjKSv+A1ZomG8hZg8hlgeG6wwQVD9AGv+10zqqSf6mFq2tVA703Zd5R0YhSuSlXA+E/Ei+Q==}
dev: false
/lodash.snakecase@4.1.1:
resolution: {integrity: sha512-QZ1d4xoBHYUeuouhEq3lk3Uq7ldgyFXGBhg04+oRLnIz8o9T65Eh+8YdroUwn846zchkA9yDsDl5CVVaV2nqYw==}
dev: true
/lodash.sortby@4.7.0:
resolution: {integrity: sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==}
@ -33334,6 +33358,10 @@ packages:
/lodash.uniq@4.5.0:
resolution: {integrity: sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=}
/lodash.upperfirst@4.3.1:
resolution: {integrity: sha512-sReKOYJIJf74dhJONhU4e0/shzi1trVbSWDOhKYE5XV2O+H7Sb2Dihwuc7xWxVl+DgFPyTqIN3zMfT9cq5iWDg==}
dev: true
/lodash@4.17.21:
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
@ -39425,6 +39453,62 @@ packages:
/safer-buffer@2.1.2:
resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
/sanctuary-def@0.22.0:
resolution: {integrity: sha512-lywS27TfuPHzelMh6M1YWBcB//Lom4Gko/tGjKYbDPkPet1B5KplsSdjY+5sF4mwp6+PDUodsk/Y3Uskrc/ebw==}
dependencies:
sanctuary-either: 2.1.0
sanctuary-show: 2.0.0
sanctuary-type-classes: 12.1.0
sanctuary-type-identifiers: 3.0.0
dev: true
/sanctuary-either@2.1.0:
resolution: {integrity: sha512-AsQCma2yGAVS7Dlxme/09NZWQfcXBNylVmkuvarp8uOe9otSwClOgQyyePN2OxO4hTf3Au1Ck4ggm+97Je06kA==}
dependencies:
sanctuary-show: 2.0.0
sanctuary-type-classes: 12.1.0
dev: true
/sanctuary-maybe@2.1.0:
resolution: {integrity: sha512-xCmvaEkYaIz5klWUrsgvgORKTL3bVYxATp7HyGBY0ZCu9tHJtSYDTpwnqMkRknHFIU986Kr2M/dJdiFvuc6UCQ==}
dependencies:
sanctuary-show: 2.0.0
sanctuary-type-classes: 12.1.0
dev: true
/sanctuary-pair@2.1.0:
resolution: {integrity: sha512-yY1JzzIJ/Ex7rjN8NmQLB7yv6GVzNeaMvxoYSW8w1ReLQI0n2sGOVCnAVipZuCv7wmfd+BavSXp59rklJeYytw==}
dependencies:
sanctuary-show: 2.0.0
sanctuary-type-classes: 12.1.0
dev: true
/sanctuary-show@2.0.0:
resolution: {integrity: sha512-REj4ZiioUXnDLj6EpJ9HcYDIEGaEexmB9Fg5o6InZR9f0x5PfnnC21QeU9SZ9E7G8zXSZPNjy8VRUK4safbesw==}
dev: true
/sanctuary-type-classes@12.1.0:
resolution: {integrity: sha512-oWP071Q88dEgJwxHLZp8tc7DoS+mWmYhYOuhP85zznPpIxV1ZjJfyRvcR59YCazyFxyFeBif7bJx1giLhDZW0Q==}
dependencies:
sanctuary-type-identifiers: 3.0.0
dev: true
/sanctuary-type-identifiers@3.0.0:
resolution: {integrity: sha512-YFXYcG0Ura1dSPd/1xLYtE2XAWUEsBHhMTZvYBOvwT8MeFQwdUOCMm2DC+r94z6H93FVq0qxDac8/D7QpJj6Mg==}
dev: true
/sanctuary@3.1.0:
resolution: {integrity: sha512-yTpWmslb5Q2jXcHYeIfCzJksIpe3pngBaFBDpjdPXONWyVSB3hBVDZZ8EmitohaMZqjLB+JREeEL0YOVtdxILA==}
dependencies:
sanctuary-def: 0.22.0
sanctuary-either: 2.1.0
sanctuary-maybe: 2.1.0
sanctuary-pair: 2.1.0
sanctuary-show: 2.0.0
sanctuary-type-classes: 12.1.0
sanctuary-type-identifiers: 3.0.0
dev: true
/sane@4.1.0:
resolution: {integrity: sha512-hhbzAgTIX8O7SHfp2c8/kREfEn4qO/9q8C9beyY6+tvZ87EpoZ3i1RIEvp27YBswnNbY9mWd6paKVmKbAgLfZA==}
engines: {node: 6.* || 8.* || >= 10.*}