CI with preview (#1)

.github/actions/setup-pnpm/action.yaml

@@ -0,0 +1,16 @@
+name: Setup PNPM
+author: comma.ai
+description: Setup PNPM for use in GitHub Actions
+
+runs:
+  using: composite
+  steps:
+    - uses: pnpm/action-setup@v4
+
+    - uses: actions/setup-node@v4
+      with:
+        node-version-file: package.json
+        cache: pnpm
+
+    - shell: bash
+      run: pnpm install --frozen-lockfile

.github/workflows/build.yaml

@@ -0,0 +1,25 @@
+name: build
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: ./.github/actions/setup-pnpm
+
+      - run: pnpm build
+
+      - name: Upload built project
+        uses: actions/upload-artifact@v4
+        with:
+          path: ./dist
+          overwrite: true
+          retention-days: 1
+          name: build-artifacts-${{ github.run_id }}

.github/workflows/preview.yaml

@@ -0,0 +1,71 @@
+name: preview
+
+on:
+  workflow_run:
+    workflows: ["build"]
+    types:
+      - requested
+      - completed
+
+permissions:
+  contents: read
+  pull-requests: write
+
+jobs:
+  preview:
+    if: ${{ github.event.workflow_run.conclusion == 'success' && github.event.workflow_run.event == 'pull_request' }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Download build artifacts
+        uses: actions/download-artifact@v4
+        with:
+          name: build-artifacts-${{ github.event.workflow_run.id }}
+          path: ./dist
+          run-id: ${{ github.event.workflow_run.id }}
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Find PR number
+        id: pr
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const response = await github.rest.search.issuesAndPullRequests({
+              q: 'repo:${{ github.repository }} is:pr sha:${{ github.event.workflow_run.head_sha }}',
+              per_page: 1,
+            })
+            const items = response.data.items
+            if (items.length < 1) {
+              console.error('No PRs found')
+              return
+            }
+            const pullRequestNumber = items[0].number
+            console.info("Pull request number is", pullRequestNumber)
+            return pullRequestNumber
+
+      # deploy
+      - name: Deploy to Cloudflare Pages
+        id: cloudflare-publish
+        uses: cloudflare/pages-action@v1.5.0
+        with:
+          branch: ${{ steps.pr.outputs.result }}
+          projectName: new-connect
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          apiToken: ${{ secrets.CLOUDFLARE_PAGES_TOKEN }}
+          directory: dist
+
+      - name: Comment URL on PR
+        uses: thollander/actions-comment-pull-request@v2
+        with:
+          message: |
+            <!-- _(run_id **${{ github.run_id }}**)_ -->
+            Welcome to new-connect! Make sure to:
+            * read the [contributing guidelines](https://github.com/commaai/new-connect?tab=readme-ov-file#contributing)
+            * mark your PR as a draft until it's ready to review
+            * post the preview on [Discord](https://discord.comma.ai); feedback from users will speedup the PR review
+
+            deployed preview: https://${{ steps.pr.outputs.result }}.new-connect.pages.dev
+          comment_tag: run_id
+          pr_number: ${{ steps.pr.outputs.result }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

README.md

@@ -6,7 +6,16 @@ connect is the web (and mobile) experience for [openpilot](https://github.com/co
 
 ## Development
 
-```
-pnpm install
-pnpm dev --open
-```
+- Install pnpm: https://pnpm.io/installation
+- Install dependencies: `pnpm install`
+- Start dev server: `pnpm dev --open`
+
+## Contributing
+
+If you don't have a comma device, connect has a demo mode with some example drives. This should allow for testing most functionality except for interactions with the device, such as getting the car battery voltage.
+
+- Use best practices
+- Write test cases
+- Keep files small and clean
+- Use branches / pull requests to isolate work
+- Don't do work that can't be merged quickly, find ways to break it up

package.json

@@ -15,6 +15,7 @@
     "lint": "eslint --ext .ts,.tsx src",
     "lint:fix": "eslint --ext .ts,.tsx --fix src"
   },
+  "packageManager": "pnpm@9.2.0",
   "type": "module",
   "devDependencies": {
     "@types/luxon": "^3.2.0",