diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml index 416f51ecc6..94a8195be4 100644 --- a/.github/workflows/storybook.yml +++ b/.github/workflows/storybook.yml @@ -36,7 +36,13 @@ jobs: - name: Build storybook run: pnpm --filter frontend build-storybook - name: Publish to Chromatic - run: pnpm --filter frontend chromatic --exit-once-uploaded --externals "assets/**" --externals "fluent-emojis/**" --externals "locales/**" --externals "misskey-assets/**" --externals "packages/frontend/assets/**" --externals "packages/frontend/public/**" --externals "pnpm-lock.yaml" $(node packages/frontend/.storybook/changes.js $(git diff-tree --no-commit-id --name-only -r HEAD | xargs)) + if: github.ref == 'refs/heads/master' + run: pnpm --filter frontend chromatic --exit-once-uploaded + env: + CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} + - name: Publish to Chromatic + if: github.ref != 'refs/heads/master' + run: pnpm --filter frontend chromatic --exit-once-uploaded $(node packages/frontend/.storybook/changes.js $(git diff-tree --no-commit-id --name-only -r HEAD | xargs)) env: CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} - name: Upload Artifacts diff --git a/packages/frontend/.storybook/.gitignore b/packages/frontend/.storybook/.gitignore index 649b36b848..a02bf4558f 100644 --- a/packages/frontend/.storybook/.gitignore +++ b/packages/frontend/.storybook/.gitignore @@ -1,9 +1,6 @@ -# (cd path/to/frontend; pnpm tsc -p .storybook) -# (cd path/to/frontend; node .storybook/generate.js) +/changes.js /generate.js -# (cd path/to/frontend; node .storybook/preload-locale.js) /preload-locale.js /locale.ts -# (cd path/to/frontend; node .storybook/preload-theme.js) /preload-theme.js /themes.ts diff --git a/packages/frontend/.storybook/changes.ts b/packages/frontend/.storybook/changes.ts index 71aa0f7dbf..93041f38a5 100644 --- a/packages/frontend/.storybook/changes.ts +++ b/packages/frontend/.storybook/changes.ts @@ -1,24 +1,41 @@ -import fs from 'node:fs/promises'; -import path from 'node:path'; +import fs from "node:fs/promises"; +import path from "node:path"; +import micromatch from "micromatch"; -fs.readFile(path.resolve(__dirname, '../storybook-static/preview-stats.json')) - .then((buffer) => { - const stats = JSON.parse(buffer.toString()); - const modules = new Set(process.argv.slice(2).map((arg) => path.resolve(__dirname, '..', arg))); - for (;;) { - const oldSize = modules.size; - for (const module of Array.from(modules)) { - if (stats.modules[module]) { - for (const reason of stats.modules[module].reasons) { - modules.add(reason.moduleName); - } +fs.readFile( + path.resolve(__dirname, "../storybook-static/preview-stats.json") +).then((buffer) => { + const stats = JSON.parse(buffer.toString()); + const modules = new Set( + process.argv.slice(2).map((arg) => path.relative(path.resolve(__dirname, ".."), path.resolve(__dirname, "../../..", arg))) + ); + if ( + micromatch(Array.from(modules), [ + "../../assets/**", + "../../fluent-emojis/**", + "../../locales/**", + "../../misskey-assets/**", + "assets/**", + "public/**", + "../../pnpm-lock.yaml", + ]).length + ) { + return; + } + for (;;) { + const oldSize = modules.size; + for (const module of Array.from(modules)) { + if (stats.modules[module]) { + for (const reason of stats.modules[module].reasons) { + modules.add(reason.moduleName); } } - if (modules.size === oldSize) { - break; - } } - for (const file of Array.from(modules)) { - process.stdout.write(` --only-story-files ${file}`); + if (modules.size === oldSize) { + break; } - }) + } + for (const file of Array.from(modules)) { + process.stdout.write(` --only-story-files ${path.resolve(__dirname, "..", file)}`); + } +}); diff --git a/packages/frontend/package.json b/packages/frontend/package.json index 55bfbbc95f..7f1ce8e083 100644 --- a/packages/frontend/package.json +++ b/packages/frontend/package.json @@ -98,6 +98,7 @@ "@types/gulp": "4.0.10", "@types/gulp-rename": "2.0.1", "@types/matter-js": "0.18.2", + "@types/micromatch": "^4.0.2", "@types/node": "18.15.11", "@types/punycode": "2.1.0", "@types/sanitize-html": "2.9.0", @@ -122,6 +123,7 @@ "eslint-plugin-vue": "9.10.0", "fast-glob": "3.2.12", "happy-dom": "8.9.0", + "micromatch": "^4.0.5", "msw": "1.2.1", "msw-storybook-addon": "1.8.0", "prettier": "2.8.7", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 892a2f8456..f69b1178f8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -835,6 +835,9 @@ importers: '@types/matter-js': specifier: 0.18.2 version: 0.18.2 + '@types/micromatch': + specifier: ^4.0.2 + version: 4.0.2 '@types/node': specifier: 18.15.11 version: 18.15.11 @@ -907,6 +910,9 @@ importers: happy-dom: specifier: 8.9.0 version: 8.9.0 + micromatch: + specifier: ^4.0.5 + version: 4.0.5 msw: specifier: 1.2.1 version: 1.2.1(typescript@5.0.3) @@ -5358,17 +5364,6 @@ packages: telejson: 7.0.4 dev: true - /@storybook/channel-postmessage@7.1.0-alpha.0: - resolution: {integrity: sha512-uNt2+hsf31DT2c/QkwjZFIJ/tE4BLe/JQss721/9xR91WsCestdcJfDhUHLcC+d2q2qoLq29rWrWW2TK+kojKw==} - dependencies: - '@storybook/channels': 7.1.0-alpha.0 - '@storybook/client-logger': 7.1.0-alpha.0 - '@storybook/core-events': 7.1.0-alpha.0 - '@storybook/global': 5.0.0 - qs: 6.11.1 - telejson: 7.0.4 - dev: true - /@storybook/channel-websocket@7.0.2: resolution: {integrity: sha512-YU3lFId6Nsi75ddA+3qfbnLfNUPswboYyx+SALhaLuXqz7zqfzX4ezMgxeS/h0gRlUJ7nf2/yJ5qie/kZaizjw==} dependencies: @@ -5386,10 +5381,6 @@ packages: resolution: {integrity: sha512-qkI8mFy9c8mxN2f01etayKhCaauL6RAsxRzbX1/pKj6UqhHWqqUbtHwymrv4hG5qDYjV1e9pd7ae5eNF8Kui0g==} dev: true - /@storybook/channels@7.1.0-alpha.0: - resolution: {integrity: sha512-9FGJaJU7FdrsF4O8JmvJe/8L3VoriNFssMGH+zkl4Amk0lpEQ/zB9FnHTaALV2hP5DUdtHhyO81u3YXQrmgOUQ==} - dev: true - /@storybook/cli@7.0.2: resolution: {integrity: sha512-xMM2QdXNGg09wuXzAGroKrbsnaHSFPmtmefX1XGALhHuKVwxOoC2apWMpek6gY/9vh5EIRTog2Dvfd2BzNrT6Q==} hasBin: true @@ -5451,12 +5442,6 @@ packages: '@storybook/global': 5.0.0 dev: true - /@storybook/client-logger@7.1.0-alpha.0: - resolution: {integrity: sha512-NFIFFeKgZxSXvDnd0nTG1MehTw1j7tMCg8rbK4lJ/R5waQkygJ/9QDVXZlZjC9+FU/Gj175iSIf5LNCHQjylAQ==} - dependencies: - '@storybook/global': 5.0.0 - dev: true - /@storybook/codemod@7.0.2: resolution: {integrity: sha512-D9PdByxJlFiaDJcLkM+RN1DHCj4VfQIlSZkADOcNtI4o9H064oiMloWDGZiR1i1FCYMSXuWmW6tMsuCVebA+Nw==} dependencies: @@ -5536,10 +5521,6 @@ packages: resolution: {integrity: sha512-1DCHCwHRL3+rlvnVVc/BCfReP31XaT2WYgcLeGTmkX1E43Po1MkgcM7PnJPSaa9POvSqZ+6YLZv5Bs1SXbufow==} dev: true - /@storybook/core-events@7.1.0-alpha.0: - resolution: {integrity: sha512-GckKwXy5rcbeLym9yvwziT3KiryLr3uvh2hF9F3Tde1iKvi822Acytg8viVQIUahzdBvlnaRZIIBxhAFPIAu5g==} - dev: true - /@storybook/core-server@7.0.2: resolution: {integrity: sha512-7ipGws8YffVaiwkc+D0+MfZc/Sy52aKenG3nDJdK4Ajmp5LPAlelb/sxIhfRvoHDbDsy2FQNz++Mb55Yh03KkA==} dependencies: @@ -5677,16 +5658,6 @@ packages: '@storybook/preview-api': 7.0.2 dev: true - /@storybook/instrumenter@7.1.0-alpha.0: - resolution: {integrity: sha512-ySi6SXRAKoY202QZaUQqsdBXV3YhlcIfIkfdrcOOa8+abwxQABrZJeRQi41gGWIiqXDWTfx2BZDlaRU39Kyw5Q==} - dependencies: - '@storybook/channels': 7.1.0-alpha.0 - '@storybook/client-logger': 7.1.0-alpha.0 - '@storybook/core-events': 7.1.0-alpha.0 - '@storybook/global': 5.0.0 - '@storybook/preview-api': 7.1.0-alpha.0 - dev: true - /@storybook/jest@0.1.0: resolution: {integrity: sha512-TmybnEXlv5Fu2/Hq4nRj7alS9mw4CasLR0RDwaAzS+Vpvu1TC4+j9rh+b1BHtmWebbJh0JMT6mgzPqOyJdgtQA==} dependencies: @@ -5782,26 +5753,6 @@ packages: util-deprecate: 1.0.2 dev: true - /@storybook/preview-api@7.1.0-alpha.0: - resolution: {integrity: sha512-wZCEFCpxqjjSGdJKtVYd/ck/Fg/dsU3cPEbjPhUyLQqKnUA/MsR8vVzDtkmugWwupviChfjARvwLdNN8u45OXw==} - dependencies: - '@storybook/channel-postmessage': 7.1.0-alpha.0 - '@storybook/channels': 7.1.0-alpha.0 - '@storybook/client-logger': 7.1.0-alpha.0 - '@storybook/core-events': 7.1.0-alpha.0 - '@storybook/csf': 0.1.0 - '@storybook/global': 5.0.0 - '@storybook/types': 7.1.0-alpha.0 - '@types/qs': 6.9.7 - dequal: 2.0.3 - lodash: 4.17.21 - memoizerific: 1.11.3 - qs: 6.11.1 - synchronous-promise: 2.0.17 - ts-dedent: 2.2.0 - util-deprecate: 1.0.2 - dev: true - /@storybook/preview@7.0.2: resolution: {integrity: sha512-U7MZkDT9bBq7HggLAXmTO9gI4eqhYs26fZS0L6iTE/PCX4Wg2TJBJSq2X8jhDXRqJFOt8SrQ756+V5Vtwrh4Og==} dev: true @@ -5930,8 +5881,8 @@ packages: /@storybook/testing-library@0.0.14-next.1: resolution: {integrity: sha512-1CAl40IKIhcPaCC4pYCG0b9IiYNymktfV/jTrX7ctquRY3akaN7f4A1SippVHosksft0M+rQTFE0ccfWW581fw==} dependencies: - '@storybook/client-logger': 7.1.0-alpha.0 - '@storybook/instrumenter': 7.1.0-alpha.0 + '@storybook/client-logger': 7.0.2 + '@storybook/instrumenter': 7.0.2 '@testing-library/dom': 8.20.0 '@testing-library/user-event': 13.5.0(@testing-library/dom@8.20.0) ts-dedent: 2.2.0 @@ -5969,15 +5920,6 @@ packages: file-system-cache: 2.0.2 dev: true - /@storybook/types@7.1.0-alpha.0: - resolution: {integrity: sha512-84VOCC/NEH6B5puWgK9VGjigmAfTU1iJJmly+OaF2lJv6LeHRb4/UOPSeg8fA8uHh3E32jSRKA2B8sUnxCCQrg==} - dependencies: - '@storybook/channels': 7.1.0-alpha.0 - '@types/babel__core': 7.20.0 - '@types/express': 4.17.17 - file-system-cache: 2.0.2 - dev: true - /@storybook/vue3-vite@7.0.2(react-dom@18.2.0)(react@18.2.0)(typescript@5.0.3)(vite@4.2.1)(vue@3.2.47): resolution: {integrity: sha512-lmxnHA9wHkgbNq+oW6dVnXbe9QOFjOz4Ejkl1AAjjg0blJ+VGautVa3mSeYM99szx5EigSfQjFAkv/TAJVC80Q==} engines: {node: ^14.18 || >=16} @@ -6462,6 +6404,10 @@ packages: '@types/node': 18.15.11 dev: true + /@types/braces@3.0.1: + resolution: {integrity: sha512-+euflG6ygo4bn0JHtn4pYqcXwRtLvElQ7/nnjDu7iYG56H0+OhCd7d6Ug0IE3WcFpZozBKW2+80FUbv5QGk5AQ==} + dev: true + /@types/bull@4.10.0: resolution: {integrity: sha512-RkYW8K2H3J76HT6twmHYbzJ0GtLDDotpLP9ah9gtiA7zfF6peBH1l5fEiK0oeIZ3/642M7Jcb9sPmor8Vf4w6g==} dependencies: @@ -6729,6 +6675,12 @@ packages: resolution: {integrity: sha512-IgHxcT3RC8LzFLhKwP3gbMPeaK7BM9eBH46OdapPA7yvuIUJ8H6zHZV53J8hGZcTSnt95jANt+rTBNUUc22ACQ==} dev: true + /@types/micromatch@4.0.2: + resolution: {integrity: sha512-oqXqVb0ci19GtH0vOA/U2TmHTcRY9kuZl4mqUxe0QmJAlIW13kzhuK5pi1i9+ngav8FjpSb9FVS/GE00GLX1VA==} + dependencies: + '@types/braces': 3.0.1 + dev: true + /@types/mime-types@2.1.1: resolution: {integrity: sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==} dev: true