ci: add github previews

.github/workflows/github-pr-update.cjs

@@ -0,0 +1,101 @@
+const PR_MARKER = '<!-- action-pr-marker -->';
+
+async function findComment({ github, context, core }) {
+  const comments = await github.rest.issues.listComments({
+    owner: context.repo.owner,
+    repo: context.repo.repo,
+    issue_number: context.payload.pull_request.number
+  });
+  const existingComment = comments.data.find((comment) =>
+    comment.body.includes(PR_MARKER)
+  );
+
+  return existingComment?.id;
+}
+
+async function setComment({ github, context, commentId, body }) {
+  if (commentId) {
+    await github.rest.issues.updateComment({
+      owner: context.repo.owner,
+      repo: context.repo.repo,
+      comment_id: commentId,
+      body
+    });
+  } else {
+    await github.rest.issues.createComment({
+      owner: context.repo.owner,
+      repo: context.repo.repo,
+      issue_number: context.payload.pull_request.number,
+      body
+    });
+  }
+}
+
+async function createDeployingComment({ github, context, core }) {
+  const commentId = await findComment({ github, context, core });
+
+  const comment = `
+${PR_MARKER}
+### <span aria-hidden="true">⚙️</span> Website deploying to S3!
+
+|  Name | Link |
+|:-:|------------------------|
+|<span aria-hidden="true">🔨</span> Latest commit | ${context.payload.pull_request.head.sha} |
+`;
+
+  await setComment({ github, context, commentId, body: comment });
+}
+
+async function createFailedComment({ github, context, core }) {
+  const commentId = await findComment({ github, context, core });
+
+  const comment = `
+${PR_MARKER}
+### <span aria-hidden="true">❌</span> Deployment failed!
+
+_Check the action logs for more information._
+
+|  Name | Link |
+|:-:|------------------------|
+|<span aria-hidden="true">🔨</span> Latest commit | ${context.payload.pull_request.head.sha} |
+`;
+
+  await setComment({ github, context, commentId, body: comment });
+}
+
+async function createSuccessComment({ github, context, core }) {
+  const commentId = await findComment({ github, context, core });
+
+  const websiteUrl = `http://${process.env.BUCKET_NAME}.s3-website-${process.env.AWS_REGION}.amazonaws.com/`;
+  const comment = `
+${PR_MARKER}
+### <span aria-hidden="true">✅</span> Deploy Preview ready!
+
+
+|  Name | Link |
+|:-:|------------------------|
+|<span aria-hidden="true">🔨</span> Latest commit | ${context.payload.pull_request.head.sha} |
+|<span aria-hidden="true">😎</span> Deploy Preview | ${websiteUrl} |
+`;
+
+  await setComment({ github, context, commentId, body: comment });
+}
+
+async function deleteComment({ github, context, core }) {
+  const commentId = await findComment({ github, context, core });
+
+  if (commentId) {
+    await github.rest.issues.deleteComment({
+      owner: context.repo.owner,
+      repo: context.repo.repo,
+      comment_id: commentId
+    });
+  }
+}
+
+module.exports = {
+  createDeployingComment,
+  createFailedComment,
+  createSuccessComment,
+  deleteComment
+};

.github/workflows/preview-deploy.yaml

@@ -0,0 +1,119 @@
+name: Preview
+
+on:
+  pull_request:
+    branches:
+      - "*"
+
+permissions:
+  id-token: write
+  contents: read
+  issues: write
+  pull-requests: write
+
+env:
+  BUCKET_NAME: ds-preview-stac-map-${{ github.event.number }}
+  AWS_ROLE_ARN: arn:aws:iam::552819999234:role/stac-map-gh-preview
+  AWS_REGION: us-west-2
+  DIST_DIRECTORY: dist
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: ".node-version"
+          cache: "yarn"
+      - name: Post building comment
+        uses: actions/github-script@v6
+        with:
+          script: |
+            const { createDeployingComment } = require('./.github/workflows/github-pr-update.cjs')
+            await createDeployingComment({ github, context, core })
+      - name: Install
+        run: yarn install --ignore-engines
+      - name: Build
+        run: yarn build-preview
+      - name: Post error comment
+        uses: actions/github-script@v6
+        if: failure()
+        with:
+          script: |
+            const { createFailedComment } = require('./.github/workflows/github-pr-update.cjs')
+            await createFailedComment({ github, context, core })
+      - uses: actions/upload-artifact@v4
+        with:
+          path: ${{ env.DIST_DIRECTORY }}
+  deploy:
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - uses: actions/checkout@v4
+      - uses: aws-actions/configure-aws-credentials@v4
+        with:
+          role-to-assume: ${{ env.AWS_ROLE_ARN }}
+          aws-region: ${{ env.AWS_REGION }}
+      - uses: actions/download-artifact@v5
+        with:
+          path: ${{ env.DIST_DIRECTORY }}
+      - name: Check if bucket exists
+        id: check_bucket
+        run: |
+          if aws s3 ls "s3://${{ env.BUCKET_NAME }}" 2>&1 | grep -q 'NoSuchBucket'; then
+            echo "Bucket does not exist."
+            echo "exists=false" >> "$GITHUB_OUTPUT"
+          else
+            echo "Bucket exists."
+            echo "exists=true" >> "$GITHUB_OUTPUT"
+          fi
+      - name: Create S3 bucket
+        if: steps.check_bucket.outputs.exists == 'false'
+        run: |
+          aws s3 mb s3://${{ env.BUCKET_NAME }}
+      - name: Enable static website hosting
+        if: steps.check_bucket.outputs.exists == 'false'
+        run: |
+          aws s3 website \
+          s3://${{ env.BUCKET_NAME }} \
+          --index-document index.html \
+          --error-document index.html
+      - name: Sync files
+        run: |
+          aws s3 sync \
+            ./${{env.DIST_DIRECTORY}} s3://${{ env.BUCKET_NAME }} \
+            --delete \
+            --quiet
+      - name: Make bucket public access
+        if: steps.check_bucket.outputs.exists == 'false'
+        run: |
+          aws s3api delete-public-access-block --bucket ${{ env.BUCKET_NAME }}
+      - name: Add bucket policy for public access
+        if: steps.check_bucket.outputs.exists == 'false'
+        run: |
+          echo '{
+            "Version": "2012-10-17",
+            "Statement": [{
+              "Sid": "PublicReadGetObject",
+              "Effect": "Allow",
+              "Principal": "*",
+              "Action": "s3:GetObject",
+              "Resource": "arn:aws:s3:::${{ env.BUCKET_NAME }}/*"
+            }]
+          }' > bucket-policy.json
+          aws s3api put-bucket-policy --bucket ${{ env.BUCKET_NAME }} --policy file://bucket-policy.json
+      - name: Post comment with preview URL
+        uses: actions/github-script@v6
+        if: success()
+        with:
+          script: |
+            const { createSuccessComment } = require('./.github/workflows/github-pr-update.cjs')
+            await createSuccessComment({ github, context, core })
+      - name: Post error comment
+        uses: actions/github-script@v6
+        if: failure()
+        with:
+          script: |
+            const { createFailedComment } = require('./.github/workflows/github-pr-update.cjs')
+            await createFailedComment({ github, context, core })

.github/workflows/preview-remove.yml

@@ -0,0 +1,51 @@
+name: Remove preview
+
+on:
+  pull_request_target:
+    types: [ closed ]
+
+env:
+  BUCKET_NAME: ds-preview-stac-map-${{ github.event.number }}
+  AWS_ROLE_ARN: arn:aws:iam::552819999234:role/stac-map-gh-preview
+  AWS_REGION: us-west-2
+
+permissions:
+  id-token: write
+  contents: read
+  issues: write
+  pull-requests: write
+
+jobs:
+  remove:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: aws-actions/configure-aws-credentials@v4
+        with:
+          role-to-assume: ${{ env.AWS_ROLE_ARN }}
+          aws-region: ${{ env.AWS_REGION }}
+      - name: Check if bucket exists
+        id: check_bucket
+        run: |
+          if aws s3 ls "s3://${{ env.BUCKET_NAME }}" 2>&1 | grep -q 'NoSuchBucket'; then
+            echo "Bucket does not exist."
+            echo "exists=false" >> "$GITHUB_OUTPUT"
+          else
+            echo "Bucket exists."
+            echo "exists=true" >> "$GITHUB_OUTPUT"
+          fi
+      - name: Empty the bucket
+        if: steps.check_bucket.outputs.exists == 'true'
+        run: |
+          aws s3 rm s3://$BUCKET_NAME --recursive --quiet
+      - name: Remove the bucket
+        if: steps.check_bucket.outputs.exists == 'true'
+        run: |
+          aws s3 rb s3://$BUCKET_NAME
+      - name: Remove PR comment
+        uses: actions/github-script@v6
+        if: success()
+        with:
+          script: |
+            const { deleteComment } = require('./.github/workflows/github-pr-update.cjs')
+            await deleteComment({ github, context, core })

package.json

@@ -25,6 +25,7 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
+    "build-preview": "tsc -b && vite build --base=/",
     "lint": "eslint .",
     "format": "prettier . --write",
     "format:check": "prettier . --check",