Some GHA changes to allow deploying storybook separately

Also:
 - fixes storybook deployment
 - fixes bad public path for fonts

Author: WillsonHaw

.github/actions/setup/action.yml

@@ -0,0 +1,31 @@
+name: 'Setup Workspace'
+description: 'Checkout code, setup Node.js with pnpm, and install dependencies'
+
+inputs:
+  npm-token:
+    description: 'NPM token for authentication'
+    required: false
+
+runs:
+  using: 'composite'
+  steps:
+    - uses: actions/checkout@v4
+      with:
+        fetch-depth: 0
+        persist-credentials: false
+
+    - uses: pnpm/action-setup@v4
+
+    - uses: actions/setup-node@v4
+      env:
+        NODE_AUTH_TOKEN: ${{ inputs.npm-token }}
+      with:
+        node-version-file: package.json
+        cache: "pnpm"
+        always-auth: "true"
+        scope: "@plextv"
+        registry-url: "https://registry.npmjs.org"
+
+    - name: Install dependencies
+      run: pnpm install --frozen-lockfile
+      shell: bash

.github/workflows/deploy-storybook.yml

@@ -0,0 +1,41 @@
+name: Deploy Storybook
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+
+concurrency: ${{ github.workflow }}-${{ github.ref }}
+
+permissions:
+  pages: write # to deploy to Pages
+  id-token: write
+
+jobs:
+  build-and-deploy:
+    name: Build and Deploy Storybook
+    runs-on: ubuntu-latest
+    if: ${{ github.event_name == 'push' || github.event_name == 'workflow_dispatch' }}
+
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    steps:
+      - name: Setup workspace
+        uses: plexinc/react-lightning/.github/actions/setup@main
+        with:
+          npm-token: ${{ secrets.NPM_TOKEN }}
+
+      - name: Build Storybook
+        run: pnpm run build:storybook
+
+      - name: Upload storybook static files as artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: apps/storybook/dist/
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.github/workflows/release-packages.yml

@@ -0,0 +1,44 @@
+name: Release Packages
+
+on:
+  workflow_dispatch:
+  workflow_run:
+    workflows: ["Run tests"]
+    branches: [main]
+    types:
+      - completed
+
+concurrency: ${{ github.workflow }}-${{ github.ref }}
+
+permissions:
+  id-token: write
+
+jobs:
+  release:
+    name: Release Packages
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' || github.event_name == 'workflow_dispatch' }}
+
+    outputs:
+      published: ${{ steps.changesets.outputs.published }}
+
+    steps:
+      - name: Setup workspace
+        uses: plexinc/react-lightning/.github/actions/setup@main
+        with:
+          npm-token: ${{ secrets.NPM_TOKEN }}
+
+      - name: Create release pull request or publish
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          version: pnpm run ci:version
+          commit: "chore: Update versions"
+          title: "chore: Update versions"
+          publish: pnpm run ci:publish
+        env:
+          # When you use the repository's GITHUB_TOKEN to perform tasks, events
+          # triggered by the GITHUB_TOKEN will not create a new workflow run.
+          # This means that checks won't run on the release PRs. We work around
+          # this by using our own GH_TOKEN_REPO_ACCESS organization secret.
+          GITHUB_TOKEN: ${{ secrets.GH_TOKEN_REPO_ACCESS }}

.github/workflows/release.yml

@@ -7,6 +7,7 @@ on:
   push:
     branches:
       - main
+  workflow_dispatch:
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.head_ref || github.ref }}

.github/workflows/test.yml

@@ -15,6 +15,8 @@ const config: StorybookConfig = {
     options: {},
   },
   viteFinal(config) {
+    config.base = './';
+
     config.define = {
       __DEV__: JSON.stringify(
         (config.mode ?? process.env.NODE_ENV) !== 'production',

apps/storybook/.storybook/main.ts

@@ -28,8 +28,12 @@ export function StorybookDecorator({
         new SdfTrFontFace('msdf', {
           fontFamily: 'sans-serif',
           descriptors: {},
-          atlasUrl: '/fonts/ChocolateClassicalSans-Regular.msdf.png',
-          atlasDataUrl: '/fonts/ChocolateClassicalSans-Regular.msdf.json',
+          atlasUrl:
+            import.meta.env.BASE_URL +
+            'fonts/ChocolateClassicalSans-Regular.msdf.png',
+          atlasDataUrl:
+            import.meta.env.BASE_URL +
+            'fonts/ChocolateClassicalSans-Regular.msdf.json',
           stage,
         }),
       ],

apps/storybook/src/components/StorybookDecorator.tsx

@@ -14,6 +14,7 @@
   "type": "module",
   "scripts": {
     "build": "turbo build",
+    "build:storybook": "pnpm run build --filter=@plextv/react-lightning-storybook",
     "build:types": "turbo build:types",
     "check:types": "turbo check:types",
     "clean": "turbo clean",