Skip to content

Commit 7bf118c

Browse files
Coly010Coly010
committed
feat(storybook): fixup review comments
1 parent 5e3b3f4 commit 7bf118c

File tree

10 files changed

+46
-148
lines changed

10 files changed

+46
-148
lines changed

‎docs/generated/packages/storybook/generators/migrate-9.json

+7-1
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,14 @@
2020
},
2121
"noUpgrade": {
2222
"type": "boolean",
23-
"description": "Skip upgrading Storybook packages. Only use this option if you are already on version 9, and you do not want the latest beta.",
23+
"description": "Skip upgrading Storybook packages. Only use this option if you are already on version 9, and you do not want to install the packages again.",
2424
"default": false
25+
},
26+
"versionTag": {
27+
"type": "string",
28+
"description": "The version of Storybook to use. Use 'latest' to use the latest stable version, or 'next' to use the latest beta.",
29+
"default": "latest",
30+
"enum": ["latest", "next"]
2531
}
2632
},
2733
"examplesFile": "",

‎docs/generated/packages/storybook/migrations/21.1.0-package-updates.json

-59
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,6 @@
1111
"alwaysAddToPackageJson": false
1212
},
1313
"storybook": { "version": "^9.0.0", "alwaysAddToPackageJson": true },
14-
"@storybook/addon-jest": {
15-
"version": "^9.0.0",
16-
"alwaysAddToPackageJson": false
17-
},
18-
"@storybook/addon-mdx-gfm": {
19-
"version": "^9.0.0",
20-
"alwaysAddToPackageJson": false
21-
},
2214
"@storybook/addon-onboarding": {
2315
"version": "^9.0.0",
2416
"alwaysAddToPackageJson": false
@@ -27,16 +19,10 @@
2719
"version": "^9.0.0",
2820
"alwaysAddToPackageJson": false
2921
},
30-
"@storybook/blocks": {
31-
"version": "^9.0.0",
32-
"alwaysAddToPackageJson": false
33-
},
3422
"@storybook/builder-webpack5": {
3523
"version": "^9.0.0",
3624
"alwaysAddToPackageJson": false
3725
},
38-
"@storybook/cli": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
39-
"@storybook/core": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
4026
"@storybook/core-webpack": {
4127
"version": "^9.0.0",
4228
"alwaysAddToPackageJson": false
@@ -46,18 +32,6 @@
4632
"version": "^9.0.0",
4733
"alwaysAddToPackageJson": false
4834
},
49-
"@storybook/html-webpack5": {
50-
"version": "^9.0.0",
51-
"alwaysAddToPackageJson": false
52-
},
53-
"@storybook/manager-api": {
54-
"version": "^9.0.0",
55-
"alwaysAddToPackageJson": false
56-
},
57-
"@storybook/postinstall": {
58-
"version": "^9.0.0",
59-
"alwaysAddToPackageJson": false
60-
},
6135
"@storybook/preact": {
6236
"version": "^9.0.0",
6337
"alwaysAddToPackageJson": false
@@ -66,14 +40,6 @@
6640
"version": "^9.0.0",
6741
"alwaysAddToPackageJson": false
6842
},
69-
"@storybook/preact-webpack5": {
70-
"version": "^9.0.0",
71-
"alwaysAddToPackageJson": false
72-
},
73-
"@storybook/preview-api": {
74-
"version": "^9.0.0",
75-
"alwaysAddToPackageJson": false
76-
},
7743
"@storybook/react-vite": {
7844
"version": "^9.0.0",
7945
"alwaysAddToPackageJson": false
@@ -90,10 +56,6 @@
9056
"version": "^9.0.0",
9157
"alwaysAddToPackageJson": false
9258
},
93-
"@storybook/store": {
94-
"version": "^9.0.0",
95-
"alwaysAddToPackageJson": false
96-
},
9759
"@storybook/svelte": {
9860
"version": "^9.0.0",
9961
"alwaysAddToPackageJson": false
@@ -102,43 +64,22 @@
10264
"version": "^9.0.0",
10365
"alwaysAddToPackageJson": false
10466
},
105-
"@storybook/svelte-webpack5": {
106-
"version": "^9.0.0",
107-
"alwaysAddToPackageJson": false
108-
},
109-
"@storybook/theming": {
110-
"version": "^9.0.0",
111-
"alwaysAddToPackageJson": false
112-
},
113-
"@storybook/vue": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
11467
"@storybook/vue-vite": {
11568
"version": "^9.0.0",
11669
"alwaysAddToPackageJson": false
11770
},
118-
"@storybook/vue-webpack5": {
119-
"version": "^9.0.0",
120-
"alwaysAddToPackageJson": false
121-
},
12271
"@storybook/vue3": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
12372
"@storybook/vue3-vite": {
12473
"version": "^9.0.0",
12574
"alwaysAddToPackageJson": false
12675
},
127-
"@storybook/vue3-webpack5": {
128-
"version": "^9.0.0",
129-
"alwaysAddToPackageJson": false
130-
},
13176
"@storybook/web-components": {
13277
"version": "^9.0.0",
13378
"alwaysAddToPackageJson": false
13479
},
13580
"@storybook/web-components-vite": {
13681
"version": "^9.0.0",
13782
"alwaysAddToPackageJson": false
138-
},
139-
"@storybook/web-components-webpack5": {
140-
"version": "^9.0.0",
141-
"alwaysAddToPackageJson": false
14283
}
14384
},
14485
"aliases": [],

‎packages/storybook/migrations.json

-68
Original file line numberDiff line numberDiff line change
@@ -760,14 +760,6 @@
760760
"version": "^9.0.0",
761761
"alwaysAddToPackageJson": true
762762
},
763-
"@storybook/addon-jest": {
764-
"version": "^9.0.0",
765-
"alwaysAddToPackageJson": false
766-
},
767-
"@storybook/addon-mdx-gfm": {
768-
"version": "^9.0.0",
769-
"alwaysAddToPackageJson": false
770-
},
771763
"@storybook/addon-onboarding": {
772764
"version": "^9.0.0",
773765
"alwaysAddToPackageJson": false
@@ -776,22 +768,10 @@
776768
"version": "^9.0.0",
777769
"alwaysAddToPackageJson": false
778770
},
779-
"@storybook/blocks": {
780-
"version": "^9.0.0",
781-
"alwaysAddToPackageJson": false
782-
},
783771
"@storybook/builder-webpack5": {
784772
"version": "^9.0.0",
785773
"alwaysAddToPackageJson": false
786774
},
787-
"@storybook/cli": {
788-
"version": "^9.0.0",
789-
"alwaysAddToPackageJson": false
790-
},
791-
"@storybook/core": {
792-
"version": "^9.0.0",
793-
"alwaysAddToPackageJson": false
794-
},
795775
"@storybook/core-webpack": {
796776
"version": "^9.0.0",
797777
"alwaysAddToPackageJson": false
@@ -804,18 +784,6 @@
804784
"version": "^9.0.0",
805785
"alwaysAddToPackageJson": false
806786
},
807-
"@storybook/html-webpack5": {
808-
"version": "^9.0.0",
809-
"alwaysAddToPackageJson": false
810-
},
811-
"@storybook/manager-api": {
812-
"version": "^9.0.0",
813-
"alwaysAddToPackageJson": false
814-
},
815-
"@storybook/postinstall": {
816-
"version": "^9.0.0",
817-
"alwaysAddToPackageJson": false
818-
},
819787
"@storybook/preact": {
820788
"version": "^9.0.0",
821789
"alwaysAddToPackageJson": false
@@ -824,14 +792,6 @@
824792
"version": "^9.0.0",
825793
"alwaysAddToPackageJson": false
826794
},
827-
"@storybook/preact-webpack5": {
828-
"version": "^9.0.0",
829-
"alwaysAddToPackageJson": false
830-
},
831-
"@storybook/preview-api": {
832-
"version": "^9.0.0",
833-
"alwaysAddToPackageJson": false
834-
},
835795
"@storybook/react-vite": {
836796
"version": "^9.0.0",
837797
"alwaysAddToPackageJson": false
@@ -848,10 +808,6 @@
848808
"version": "^9.0.0",
849809
"alwaysAddToPackageJson": false
850810
},
851-
"@storybook/store": {
852-
"version": "^9.0.0",
853-
"alwaysAddToPackageJson": false
854-
},
855811
"@storybook/svelte": {
856812
"version": "^9.0.0",
857813
"alwaysAddToPackageJson": false
@@ -860,26 +816,10 @@
860816
"version": "^9.0.0",
861817
"alwaysAddToPackageJson": false
862818
},
863-
"@storybook/svelte-webpack5": {
864-
"version": "^9.0.0",
865-
"alwaysAddToPackageJson": false
866-
},
867-
"@storybook/theming": {
868-
"version": "^9.0.0",
869-
"alwaysAddToPackageJson": false
870-
},
871-
"@storybook/vue": {
872-
"version": "^9.0.0",
873-
"alwaysAddToPackageJson": false
874-
},
875819
"@storybook/vue-vite": {
876820
"version": "^9.0.0",
877821
"alwaysAddToPackageJson": false
878822
},
879-
"@storybook/vue-webpack5": {
880-
"version": "^9.0.0",
881-
"alwaysAddToPackageJson": false
882-
},
883823
"@storybook/vue3": {
884824
"version": "^9.0.0",
885825
"alwaysAddToPackageJson": false
@@ -888,21 +828,13 @@
888828
"version": "^9.0.0",
889829
"alwaysAddToPackageJson": false
890830
},
891-
"@storybook/vue3-webpack5": {
892-
"version": "^9.0.0",
893-
"alwaysAddToPackageJson": false
894-
},
895831
"@storybook/web-components": {
896832
"version": "^9.0.0",
897833
"alwaysAddToPackageJson": false
898834
},
899835
"@storybook/web-components-vite": {
900836
"version": "^9.0.0",
901837
"alwaysAddToPackageJson": false
902-
},
903-
"@storybook/web-components-webpack5": {
904-
"version": "^9.0.0",
905-
"alwaysAddToPackageJson": false
906838
}
907839
}
908840
}

‎packages/storybook/src/executors/build-storybook/build-storybook.impl.ts

+11-4
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import {
44
pleaseUpgrade,
55
storybookConfigExistsCheck,
66
storybookMajorVersion,
7+
getInstalledStorybookVersion,
78
} from '../../utils/utilities';
9+
import { gte } from 'semver';
810

911
export default async function buildStorybookExecutor(
1012
options: CLIOptions,
@@ -33,11 +35,16 @@ async function runInstance(options: CLIOptions): Promise<void | {
3335
address: string;
3436
networkAddress: string;
3537
}> {
36-
const storybookCore = await (storybookMajorVersion() < 9
37-
? // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
38+
const installedStorybookVersion = getInstalledStorybookVersion();
39+
const hasCoreServerInStorybookPackage = gte(
40+
installedStorybookVersion,
41+
'8.2.0'
42+
);
43+
const storybookCore = await (hasCoreServerInStorybookPackage
44+
? import('storybook/internal/core-server')
45+
: // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
3846
// @ts-ignore
39-
import('@storybook/core-server')
40-
: import('storybook/internal/core-server'));
47+
import('@storybook/core-server'));
4148
const env = process.env.NODE_ENV ?? 'production';
4249
process.env.NODE_ENV = env;
4350
return storybookCore.build({

‎packages/storybook/src/executors/storybook/storybook.impl.ts

+11-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import { ExecutorContext, logger } from '@nx/devkit';
22
import {
3+
getInstalledStorybookVersion,
34
pleaseUpgrade,
45
storybookConfigExistsCheck,
56
storybookMajorVersion,
67
} from '../../utils/utilities';
78
import type { CLIOptions } from 'storybook/internal/types';
9+
import { gte } from 'semver';
810

911
export default async function* storybookExecutor(
1012
options: CLIOptions,
@@ -42,11 +44,16 @@ async function runInstance(options: CLIOptions): Promise<void | {
4244
address: string;
4345
networkAddress: string;
4446
}> {
45-
const storybookCore = await (storybookMajorVersion() < 9
46-
? // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
47+
const installedStorybookVersion = getInstalledStorybookVersion();
48+
const hasCoreServerInStorybookPackage = gte(
49+
installedStorybookVersion,
50+
'8.2.0'
51+
);
52+
const storybookCore = await (hasCoreServerInStorybookPackage
53+
? import('storybook/internal/core-server')
54+
: // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
4755
// @ts-ignore
48-
import('@storybook/core-server')
49-
: import('storybook/internal/core-server'));
56+
import('@storybook/core-server'));
5057
const env = process.env.NODE_ENV ?? 'development';
5158
process.env.NODE_ENV = env;
5259
return storybookCore.build({

‎packages/storybook/src/generators/migrate-9/calling-storybook-cli.ts

+2-6
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,7 @@ export function callUpgrade(schema: Schema): 1 | Buffer {
4343
bodyLines: [
4444
`🚨 The Storybook CLI failed to upgrade your @storybook/* packages to the latest version.`,
4545
`Please try running the sb upgrade command manually:`,
46-
`${pm.exec} ${
47-
packageManager === 'yarn' ? 'storybook' : 'storybook@latest'
48-
} upgrade`,
46+
`${pm.exec} storybook@${schema.versionTag} upgrade`,
4947
],
5048
color: 'red',
5149
});
@@ -80,9 +78,7 @@ export function callAutomigrate(
8078
([projectName, storybookProjectInfo]) => {
8179
const packageManager = detectPackageManager();
8280
const pm = getPackageManagerCommand(packageManager);
83-
const commandToRun = `${pm.dlx} ${
84-
packageManager === 'yarn' ? 'storybook' : 'storybook@latest'
85-
} automigrate --config-dir ${storybookProjectInfo.configDir}`;
81+
const commandToRun = `${pm.dlx} storybook automigrate --config-dir ${storybookProjectInfo.configDir}`;
8682
try {
8783
output.log({
8884
title: `Calling sb automigrate for ${projectName}`,

‎packages/storybook/src/generators/migrate-9/helper-functions.ts

+6-5
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,12 @@ export function getAllStorybookInfo(tree: Tree): {
5252
} {
5353
const allStorybookDirs: { [key: string]: { configDir: string } } = {};
5454

55+
const extensions = ['ts', 'js', 'cjs', 'mts', 'mjs', 'cts'];
56+
const isStorybookMainFile = (path: string) =>
57+
extensions.some((ext) => path.endsWith(`.storybook/main.${ext}`));
58+
5559
visitNotIgnoredFiles(tree, '', (storybookConfigPath) => {
56-
if (
57-
!storybookConfigPath.endsWith('.storybook/main.ts') &&
58-
!storybookConfigPath.endsWith('.storybook/main.js')
59-
) {
60+
if (isStorybookMainFile(storybookConfigPath)) {
6061
return;
6162
}
6263
const storybookConfigDir = dirname(storybookConfigPath);
@@ -192,7 +193,7 @@ export function logResult(
192193
output.log({
193194
title: `Migration complete!`,
194195
bodyLines: [
195-
`🎉 Your Storybook configuration has been migrated to Storybook ^8.0.0!`,
196+
`🎉 Your Storybook configuration has been migrated to Storybook ^9.0.0!`,
196197
`📖 You can see a summary of the tasks that were performed in the storybook-migration-summary.md file in the root of your workspace.`,
197198
],
198199
color: 'green',

‎packages/storybook/src/generators/migrate-9/migrate-9.ts

+1
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import {
1212
import { Schema } from './schema';
1313

1414
export async function migrate9Generator(tree: Tree, schema: Schema) {
15+
schema.versionTag = schema.versionTag ?? 'latest';
1516
const packageJson = readJson(tree, 'package.json');
1617
if (!checkStorybookInstalled(packageJson)) {
1718
output.error({

‎packages/storybook/src/generators/migrate-9/schema.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,5 @@ export interface Schema {
22
autoAcceptAllPrompts?: boolean;
33
onlyShowListOfCommands?: boolean;
44
noUpgrade?: boolean;
5+
versionTag: 'latest' | 'next';
56
}

0 commit comments

Comments
 (0)