chore: Deploy storybook automatically, without relying on build artif…

…acts in repo (#782)

Co-authored-by: Henning Muszynski <[email protected]>

.github/PULL_REQUEST_TEMPLATE.md

@@ -19,7 +19,6 @@ Feel free to leave unchecked or remove the lines that are not applicable.
 -   [ ] Executed `npm run validate` and made sure no errors / warnings were shown
 -   [ ] Described changes in `CHANGELOG.md`
 -   [ ] Bumped version in `package.json` and `package-lock.json` (`npm --no-git-tag-version version <major|minor|patch>`) [ref](https://docs.npmjs.com/cli/v6/commands/npm-version)
--   [ ] Updated all static build artifacts (`npm run build-all`)
 -   [ ] Reviewed and approved Chromatic visual regression tests in CI
 
 ## Versioning

.github/workflows/deploy-storybook.yml

@@ -0,0 +1,47 @@
+name: Deploy Storybook to Pages
+
+on:
+  push:
+    branches: ["main"]
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build storybook
+        run: npm run build:storybook
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v3
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v1
+        with:
+          path: './docs'
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v2

.github/workflows/publish.yml

@@ -35,8 +35,8 @@ jobs:
             - run: npm run type-check
             - run: npm test
 
-            # Verify storybook build and create artifacts for publishing
-            - run: npm run build-all
+            # Build artifacts for publishing
+            - run: npm run build
 
             # Publish to GitHub package registry
             - uses: actions/setup-node@v1

.github/workflows/pull_request.yml

@@ -20,4 +20,4 @@ jobs:
             - run: npm run lint
             - run: npm run type-check
             - run: npm test
-            - run: npm run build-all
+            - run: npm run build

.gitignore

@@ -7,6 +7,7 @@ node_modules
 dist/
 es/
 lib/
+docs/
 /styles/
 coverage/
 .vscode/

README.md

@@ -212,12 +212,6 @@ npm --no-git-tag-version version <major|minor|patch>
 
 [ref](https://docs.npmjs.com/cli/v6/commands/npm-version)
 
-6. Update all static build artifacts:
-
-```sh
-npm run build-all
-```
-
 Note that the steps above are also documented in the [PR template](.github/PULL_REQUEST_TEMPLATE.md) that you will be prompted with whenever you open a new reactist GitHub PR.
 
 ## After merging your changes
@@ -243,3 +237,5 @@ Once your changes have been merged to `main`, create a new GitHub release:
 9. Once the action is complete, check https://npmjs.com/package/@doist/reactist and verify that there's a new public release
 
 Finally, be sure to update both [todoist-web](https://github.com/Doist/todoist-web) and [twist-web](https://github.com/Doist/twist-web) to use the new reactist version you just published.
+
+The storybook hosted on GitHub pages will be automatically updated on each push to `main`. Should there be a problem, try running the action manually from the [Actions settings](https://github.com/Doist/reactist/actions).