Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Introduce component usage stats #96882

Open
wants to merge 7 commits into
base: trunk
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ test-results*.xml
/client/chart.json
/client/style.json
*xunit_*.xml
/results
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ignoring the result dir.

We're going with the same naming choice as in the Gutenberg repo.

/vendor
checkstyle.xml
/apps/notifications/stats.json
Expand Down
7 changes: 5 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@
"clean:packages": "yarn workspaces foreach --all --parallel --verbose --exclude 'wp-calypso' run clean",
"clean:public": "rm -rf public",
"clean:translations": "rm -rf build/strings calypso-strings.pot chunks-map.*.json || true",
"component-usage-stats": "node ./node_modules/react-scanner/bin/react-scanner -c ./react-scanner.config.js",
"components:storybook:start": "echo 'Storybook in Calypso moved into the root directory. Run `yarn storybook:start` instead.'",
"composite-checkout:storybook:start": "echo 'Deprecated, run `yarn workspace @automattic/composite-checkout run storybook` instead'",
"distclean": "yarn run clean && rm -rf **/node_modules **/.cache .yarn/install-state.gz || true",
Expand Down Expand Up @@ -303,6 +304,7 @@
"postcss-custom-properties": "^11.0.0",
"prettier": "npm:[email protected]",
"react-refresh": "^0.14.0",
"react-scanner": "1.2.0",
"readline-sync": "^1.4.10",
"recursive-copy": "^2.0.14",
"replace": "^1.1.5",
Expand All @@ -313,7 +315,7 @@
"stacktrace-gps": "^3.0.3",
"stylelint": "^16.8.2",
"tslib": "^2.3.0",
"typescript": "^5.3.3",
"typescript": "5.3.3",
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

React Scanner comes with a newer TS version, so I'm pinning the current one.

"webpack": "^5.95.0",
"webpack-bundle-analyzer": "^4.10.2",
"webpack-cli": "^4.10.0",
Expand Down Expand Up @@ -413,7 +415,8 @@
"@wordpress/viewport": "6.8.0",
"@wordpress/warning": "3.8.0",
"@wordpress/widgets": "4.8.0",
"@wordpress/wordcount": "4.8.0"
"@wordpress/wordcount": "4.8.0",
"typescript": "5.3.3"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In order for React Scanner to pick our TS version up, we need to specifically pin the resolution version here.

},
"packageManager": "[email protected]",
"dependenciesMeta": {
Expand Down
27 changes: 27 additions & 0 deletions react-scanner.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
module.exports = {
// Crawl the entire repo
crawlFrom: './',
// Needed for properly reporting components with dot notation
includeSubComponents: true,
// Exclude any vendor or docs directories
exclude: [
'bin',
'build',
'build-tools',
'config',
'docs',
'node_modules',
'public',
'results',
'test',
tyxla marked this conversation as resolved.
Show resolved Hide resolved
'tools',
'typings',
'vendor',
],
/*
* Filter out any non-component React elements and consider only imports of
* `@wordpress/components` outside of the package.
*/
importedFrom: '@wordpress/components',
processors: [ [ 'raw-report', { outputTo: './results/calypso.json' } ] ],
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I understand this is mostly just for automated execution on a server somewhere, but it might be helpful to have components-usage or components-usage-stats in the folder name, instead of just results.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree - I got this feedback multiple times and I'll be addressing it, first in Gutenberg and in the related script, then here and in the Jetpack PR.

};
135 changes: 119 additions & 16 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -8099,6 +8099,13 @@ __metadata:
languageName: node
linkType: hard

"@types/estree@npm:^0.0.45":
version: 0.0.45
resolution: "@types/estree@npm:0.0.45"
checksum: dce1fb977d9aab2492cfc831e76abdc7c0944e42974bf7b907d02d28b9356e38c7534ade5a6b7f4f2dd12347f02d78051a4e0f4685bf8b7d60ebf85263a48bf9
languageName: node
linkType: hard

"@types/estree@npm:^0.0.51":
version: 0.0.51
resolution: "@types/estree@npm:0.0.51"
Expand Down Expand Up @@ -9178,6 +9185,13 @@ __metadata:
languageName: node
linkType: hard

"@typescript-eslint/types@npm:8.8.0":
version: 8.8.0
resolution: "@typescript-eslint/types@npm:8.8.0"
checksum: cd168fafcaf77641b023c4405ea3a8c30fbad1737abb5aec9fce67fe2ae20224b624b5a2e3e84900ba81dc7dd33343add3653763703a225326cc81356b182d09
languageName: node
linkType: hard

"@typescript-eslint/typescript-estree@npm:5.62.0":
version: 5.62.0
resolution: "@typescript-eslint/typescript-estree@npm:5.62.0"
Expand Down Expand Up @@ -9233,6 +9247,25 @@ __metadata:
languageName: node
linkType: hard

"@typescript-eslint/typescript-estree@npm:8.8.0":
version: 8.8.0
resolution: "@typescript-eslint/typescript-estree@npm:8.8.0"
dependencies:
"@typescript-eslint/types": "npm:8.8.0"
"@typescript-eslint/visitor-keys": "npm:8.8.0"
debug: "npm:^4.3.4"
fast-glob: "npm:^3.3.2"
is-glob: "npm:^4.0.3"
minimatch: "npm:^9.0.4"
semver: "npm:^7.6.0"
ts-api-utils: "npm:^1.3.0"
peerDependenciesMeta:
typescript:
optional: true
checksum: 9b9e849f6b2d4e250840ef8e05f55a97d6598adaf48c1e6df83084b94c30feca6a3e7916ee1c235178188d0db6364a877cbf8fe218c36d5f8d5acb50767f3273
languageName: node
linkType: hard

"@typescript-eslint/utils@npm:5.62.0, @typescript-eslint/utils@npm:^5.10.0, @typescript-eslint/utils@npm:^5.62.0":
version: 5.62.0
resolution: "@typescript-eslint/utils@npm:5.62.0"
Expand Down Expand Up @@ -9298,6 +9331,16 @@ __metadata:
languageName: node
linkType: hard

"@typescript-eslint/visitor-keys@npm:8.8.0":
version: 8.8.0
resolution: "@typescript-eslint/visitor-keys@npm:8.8.0"
dependencies:
"@typescript-eslint/types": "npm:8.8.0"
eslint-visitor-keys: "npm:^3.4.3"
checksum: 580ce74c9b09b9e6a6f3f0ac2d2f0c6a6b983a78ce3b2544822ee08107c57142858d674897f61ff32a9a5e8fca00c916545c159bb75d134f4380884642542d38
languageName: node
linkType: hard

"@ungap/structured-clone@npm:^1.0.0, @ungap/structured-clone@npm:^1.2.0":
version: 1.2.0
resolution: "@ungap/structured-clone@npm:1.2.0"
Expand Down Expand Up @@ -11815,6 +11858,18 @@ __metadata:
languageName: node
linkType: hard

"astray@npm:1.1.1":
version: 1.1.1
resolution: "astray@npm:1.1.1"
dependencies:
"@types/estree": "npm:^0.0.45"
dependenciesMeta:
"@types/estree":
optional: true
checksum: 50d9df02ab4d64192dd46fffa18eccdfd014d1df17fb2fdf5279dbafbeec76fb61ba8c1ee739f66a93e5be48899e0454ef8006c45233836b7211743dc516e93b
languageName: node
linkType: hard

"async-exit-hook@npm:^2.0.1":
version: 2.0.1
resolution: "async-exit-hook@npm:2.0.1"
Expand Down Expand Up @@ -15882,6 +15937,13 @@ __metadata:
languageName: node
linkType: hard

"dlv@npm:1.1.3":
version: 1.1.3
resolution: "dlv@npm:1.1.3"
checksum: 03eb4e769f19a027fd5b43b59e8a05e3fd2100ac239ebb0bf9a745de35d449e2f25cfaf3aa3934664551d72856f4ae8b7822016ce5c42c2d27c18ae79429ec42
languageName: node
linkType: hard

"dmg-builder@npm:23.0.3":
version: 23.0.3
resolution: "dmg-builder@npm:23.0.3"
Expand Down Expand Up @@ -16244,6 +16306,13 @@ __metadata:
languageName: node
linkType: hard

"dset@npm:3.1.4":
version: 3.1.4
resolution: "dset@npm:3.1.4"
checksum: b67bbd28dd8a539e90c15ffb61100eb64ef995c5270a124d4f99bbb53f4d82f55a051b731ba81f3215dd9dce2b4c8d69927dc20b3be1c5fc88bab159467aa438
languageName: node
linkType: hard

"dtrace-provider@npm:~0.8":
version: 0.8.8
resolution: "dtrace-provider@npm:0.8.8"
Expand Down Expand Up @@ -18197,6 +18266,13 @@ __metadata:
languageName: node
linkType: hard

"fdir@npm:5.2.0":
version: 5.2.0
resolution: "fdir@npm:5.2.0"
checksum: 1b8997beb551bf7f919ecc62442ef48936f5cdd45ff1a4160fa64f37c6aae8be2bb061862edd669cff3033d09ceb435081505a3f2604edb3fdae983615e2ae11
languageName: node
linkType: hard

"fdir@npm:6.1.1":
version: 6.1.1
resolution: "fdir@npm:6.1.1"
Expand Down Expand Up @@ -24777,7 +24853,7 @@ __metadata:
languageName: node
linkType: hard

"minimatch@npm:9.0.3, minimatch@npm:^9.0.1":
"minimatch@npm:9.0.3":
version: 9.0.3
resolution: "minimatch@npm:9.0.3"
dependencies:
Expand All @@ -24795,6 +24871,15 @@ __metadata:
languageName: node
linkType: hard

"minimatch@npm:^9.0.1, minimatch@npm:^9.0.4":
version: 9.0.5
resolution: "minimatch@npm:9.0.5"
dependencies:
brace-expansion: "npm:^2.0.1"
checksum: de96cf5e35bdf0eab3e2c853522f98ffbe9a36c37797778d2665231ec1f20a9447a7e567cb640901f89e4daaa95ae5d70c65a9e8aa2bb0019b6facbc3c0575ed
languageName: node
linkType: hard

"minimist-options@npm:4.1.0, minimist-options@npm:^4.0.2":
version: 4.1.0
resolution: "minimist-options@npm:4.1.0"
Expand Down Expand Up @@ -26616,7 +26701,7 @@ __metadata:
languageName: node
linkType: hard

"picomatch@npm:^2.0.4, picomatch@npm:^2.2.1, picomatch@npm:^2.2.2, picomatch@npm:^2.2.3, picomatch@npm:^2.3.0, picomatch@npm:^2.3.1":
"picomatch@npm:2.3.1, picomatch@npm:^2.0.4, picomatch@npm:^2.2.1, picomatch@npm:^2.2.2, picomatch@npm:^2.2.3, picomatch@npm:^2.3.0, picomatch@npm:^2.3.1":
version: 2.3.1
resolution: "picomatch@npm:2.3.1"
checksum: 26c02b8d06f03206fc2ab8d16f19960f2ff9e81a658f831ecb656d8f17d9edc799e8364b1f4a7873e89d9702dff96204be0fa26fe4181f6843f040f819dac4be
Expand Down Expand Up @@ -28313,6 +28398,25 @@ __metadata:
languageName: node
linkType: hard

"react-scanner@npm:1.2.0":
version: 1.2.0
resolution: "react-scanner@npm:1.2.0"
dependencies:
"@typescript-eslint/typescript-estree": "npm:8.8.0"
astray: "npm:1.1.1"
dlv: "npm:1.1.3"
dset: "npm:3.1.4"
fdir: "npm:5.2.0"
is-plain-object: "npm:5.0.0"
picomatch: "npm:2.3.1"
sade: "npm:1.8.1"
typescript: "npm:5.6.2"
bin:
react-scanner: bin/react-scanner
checksum: 0daee0cf0612cac6f77526ca97460c636addf46b7af6ca850fa8673c05a5e309c9977e0fe4f65571d4c12fca3e865d9b6f2da34a451bb111d1a704766635b4cc
languageName: node
linkType: hard

"react-shallow-renderer@npm:^16.15.0":
version: 16.15.0
resolution: "react-shallow-renderer@npm:16.15.0"
Expand Down Expand Up @@ -30082,7 +30186,7 @@ __metadata:
languageName: node
linkType: hard

"sade@npm:^1.7.3":
"sade@npm:1.8.1, sade@npm:^1.7.3":
version: 1.8.1
resolution: "sade@npm:1.8.1"
dependencies:
Expand Down Expand Up @@ -30374,14 +30478,12 @@ __metadata:
languageName: node
linkType: hard

"semver@npm:^7.0.0, semver@npm:^7.3.2, semver@npm:^7.3.4, semver@npm:^7.3.5, semver@npm:^7.3.7, semver@npm:^7.3.8, semver@npm:^7.5.3, semver@npm:^7.5.4":
version: 7.5.4
resolution: "semver@npm:7.5.4"
dependencies:
lru-cache: "npm:^6.0.0"
"semver@npm:^7.0.0, semver@npm:^7.3.2, semver@npm:^7.3.4, semver@npm:^7.3.5, semver@npm:^7.3.7, semver@npm:^7.3.8, semver@npm:^7.5.3, semver@npm:^7.5.4, semver@npm:^7.6.0":
version: 7.6.3
resolution: "semver@npm:7.6.3"
bin:
semver: bin/semver.js
checksum: 5160b06975a38b11c1ab55950cb5b8a23db78df88275d3d8a42ccf1f29e55112ac995b3a26a522c36e3b5f76b0445f1eef70d696b8c7862a2b4303d7b0e7609e
checksum: 88f33e148b210c153873cb08cfe1e281d518aaa9a666d4d148add6560db5cd3c582f3a08ccb91f38d5f379ead256da9931234ed122057f40bb5766e65e58adaf
languageName: node
linkType: hard

Expand Down Expand Up @@ -32614,12 +32716,12 @@ __metadata:
languageName: node
linkType: hard

"ts-api-utils@npm:^1.0.1":
version: 1.0.3
resolution: "ts-api-utils@npm:1.0.3"
"ts-api-utils@npm:^1.0.1, ts-api-utils@npm:^1.3.0":
version: 1.4.2
resolution: "ts-api-utils@npm:1.4.2"
peerDependencies:
typescript: ">=4.2.0"
checksum: 9408338819c3aca2a709f0bc54e3f874227901506cacb1163612a6c8a43df224174feb965a5eafdae16f66fc68fd7bfee8d3275d0fa73fbb8699e03ed26520c9
checksum: b9d82922af42cefa14650397f5ff42a1ff8c8a1b4fac3590fa3e2daeeb3666fbe260a324f55dc748d9653dce30c2a21a148fba928511b2022bedda66423695bf
languageName: node
linkType: hard

Expand Down Expand Up @@ -32965,7 +33067,7 @@ __metadata:
languageName: node
linkType: hard

"typescript@npm:^5.3.3":
"typescript@npm:5.3.3":
version: 5.3.3
resolution: "typescript@npm:5.3.3"
bin:
Expand All @@ -32975,7 +33077,7 @@ __metadata:
languageName: node
linkType: hard

"typescript@patch:typescript@npm%3A^5.3.3#optional!builtin<compat/typescript>":
"typescript@patch:typescript@npm%3A5.3.3#optional!builtin<compat/typescript>":
version: 5.3.3
resolution: "typescript@patch:typescript@npm%3A5.3.3#optional!builtin<compat/typescript>::version=5.3.3&hash=e012d7"
bin:
Expand Down Expand Up @@ -34709,6 +34811,7 @@ __metadata:
react-intersection-observer: "npm:^9.4.3"
react-modal: "npm:^3.16.1"
react-refresh: "npm:^0.14.0"
react-scanner: "npm:1.2.0"
readline-sync: "npm:^1.4.10"
recursive-copy: "npm:^2.0.14"
redux: "npm:^5.0.1"
Expand All @@ -34722,7 +34825,7 @@ __metadata:
stylelint: "npm:^16.8.2"
swiper: "npm:^10.1.0"
tslib: "npm:^2.3.0"
typescript: "npm:^5.3.3"
typescript: "npm:5.3.3"
webpack: "npm:^5.95.0"
webpack-bundle-analyzer: "npm:^4.10.2"
webpack-cli: "npm:^4.10.0"
Expand Down
Loading