Use Cloudflare Pages (again) and enter Cloudflare Supercloud world

.devcontainer/devcontainer.json

@@ -24,7 +24,8 @@
         "dbaeumer.vscode-eslint",
         "esbenp.prettier-vscode",
         "streetsidesoftware.code-spell-checker",
-        "bungcip.better-toml"
+        "bungcip.better-toml",
+        "HashiCorp.terraform"
       ]
     }
   },

.github/renovate.json

@@ -1,9 +1,6 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "config:base",
-    ":disableDependencyDashboard"
-  ],
+  "extends": ["config:base", ":disableDependencyDashboard"],
   "labels": ["dependencies"],
   "rangeStrategy": "update-lockfile",
   "packageRules": [

.github/workflows/deploy.yml

@@ -3,9 +3,69 @@ name: Deploy
 on: [push]
 
 jobs:
-  deploy:
+  infra:
     runs-on: ubuntu-latest
-    name: Deploy
+    name: Infrastructure
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Use Terraform
+        uses: hashicorp/setup-terraform@v2
+
+      - name: Prepare Terraform State
+        uses: cloudflare/wrangler-action@2.0.0
+        with:
+          command: kv:namespace list | jq -r '.[] | select( .title == "dispoflare-terraform-state" ) | .id' | awk '{print "tfstate_kv="$1}' >> $GITHUB_ENV
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          preCommands: apt-get update && apt-get -y install jq
+        env:
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+
+      - name: Init Terraform
+        run: terraform init
+        working-directory: ./.terraform
+
+      - name: Download Terraform State
+        uses: cloudflare/wrangler-action@2.0.0
+        with:
+          command: kv:key get --namespace-id=${{ env.tfstate_kv }} terraform.tfstate > ./.terraform/terraform.tfstate
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          postCommands: chmod 777 ./.terraform/terraform.tfstate
+        env:
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+        if: ${{ env.tfstate_kv != '' }}
+
+      - name: Configure
+        run: terraform plan && terraform apply -auto-approve
+        working-directory: ./.terraform
+        env:
+          TF_VAR_cloudflare_account_id: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          TF_VAR_cloudflare_api_token: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          TF_VAR_sentry_dsn: ${{ secrets.SENTRY_DSN }}
+
+      - name: Init Terraform State
+        uses: cloudflare/wrangler-action@2.0.0
+        with:
+          command: kv:namespace list | jq -r '.[] | select( .title == "dispoflare-terraform-state" ) | .id' | awk '{print "tfstate_kv="$1}' >> $GITHUB_ENV
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          preCommands: apt-get update && apt-get -y install jq
+        env:
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+        if: ${{ env.tfstate_kv == '' }}
+
+      - name: Store Terraform State
+        uses: cloudflare/wrangler-action@2.0.0
+        with:
+          command: kv:key put --namespace-id=${{ env.tfstate_kv }} terraform.tfstate --path=./.terraform/terraform.tfstate
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+        env:
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+
+  app:
+    runs-on: ubuntu-latest
+    name: Application
+    needs: infra
     steps:
       - name: Checkout
         uses: actions/checkout@v3
@@ -19,17 +79,29 @@ jobs:
       - name: Install NPM packages
         run: npm ci
 
-      - name: Publish to Cloudflare
+      - name: Publish to Cloudflare Workers
         uses: cloudflare/wrangler-action@2.0.0
         with:
-          apiToken: ${{ secrets.CF_API_TOKEN }}
-          accountId: ${{ secrets.CF_ACCOUNT_ID }}
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           secrets: |
-            API_TOKEN
-            ACCOUNT_ID
+            CLOUDFLARE_API_TOKEN
+            CLOUDFLARE_ACCOUNT_ID
+            SENTRY_DSN
         env:
-          API_TOKEN: ${{ secrets.CF_API_TOKEN }}
-          ACCOUNT_ID: ${{ secrets.CF_ACCOUNT_ID }}
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
+
+      - name: Build Pages
+        run: npm run build
+
+      - name: Publish to Cloudflare Pages
+        uses: cloudflare/wrangler-action@2.0.0
+        with:
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          command: pages publish public --branch=${{ github.head_ref || github.ref_name }} --project-name=dispoflare
 
       - name: Generate sourcemap
         run: npm run build -- --sourcemap
@@ -43,5 +115,5 @@ jobs:
           SENTRY_PROJECT: ${{ secrets.SENTRY_PROJECT }}
         with:
           environment: production
-          sourcemaps: ./build ./public
+          sourcemaps: ./functions ./public
           set_commits: skip

.gitignore

@@ -1,9 +1,10 @@
 node_modules
 
 /.cache
-/build
+build
 /dist
-/public/build
+/functions/\[\[path\]\].js
+/functions/\[\[path\]\].js.map
 /.mf
 .env
 

.prettierignore

@@ -3,3 +3,4 @@ package-lock.json
 /build
 /dist
 /public/build
+/functions/

.terraform/main.tf

@@ -0,0 +1,94 @@
+variable "cloudflare_account_id" {
+  type = string
+  sensitive = true
+}
+
+variable "cloudflare_api_token" {
+  type = string
+  sensitive = true
+}
+
+variable "sentry_dsn" {
+  type = string
+  sensitive = true
+}
+
+terraform {
+  required_providers {
+    cloudflare = {
+      source = "cloudflare/cloudflare"
+      version = "~> 4.0"
+    }
+  }
+}
+
+provider "cloudflare" {
+  api_token = var.cloudflare_api_token
+}
+
+resource "cloudflare_workers_kv_namespace" "terraform_state" {
+  account_id = var.cloudflare_account_id
+  title = "dispoflare-terraform-state"
+}
+
+resource "cloudflare_workers_kv_namespace" "dispoflare_production_settings" {
+  account_id = var.cloudflare_account_id
+  title = "dispoflare-production-settings"
+}
+
+resource "cloudflare_workers_kv_namespace" "dispoflare_preview_settings" {
+  account_id = var.cloudflare_account_id
+  title = "dispoflare-preview-settings"
+}
+
+resource "cloudflare_pages_project" "dispoflare_pages_project" {
+  account_id = var.cloudflare_account_id
+  name              = "dispoflare"
+  production_branch = "main"
+
+  deployment_configs {
+    production {
+      environment_variables = {
+        CLOUDFLARE_ACCOUNT_ID = sensitive(var.cloudflare_account_id)
+        CLOUDFLARE_API_TOKEN = sensitive(var.cloudflare_api_token)
+        SENTRY_DSN = sensitive(var.sentry_dsn)
+      }
+
+      kv_namespaces = {
+        KV_SETTINGS = sensitive(cloudflare_workers_kv_namespace.dispoflare_production_settings.id)
+      }
+
+      compatibility_date = "2023-02-25"
+    }
+
+    preview {
+      environment_variables = {
+        CLOUDFLARE_ACCOUNT_ID = sensitive(var.cloudflare_account_id)
+        CLOUDFLARE_API_TOKEN = sensitive(var.cloudflare_api_token)
+        SENTRY_DSN = sensitive(var.sentry_dsn)
+      }
+
+      kv_namespaces = {
+        KV_SETTINGS = sensitive(cloudflare_workers_kv_namespace.dispoflare_preview_settings.id)
+      }
+    }
+  }
+}
+
+resource "cloudflare_access_application" "dispoflare_production_access" {
+  account_id                = var.cloudflare_account_id
+  name                      = "Dispoflare (Production)"
+  domain                    = cloudflare_pages_project.dispoflare_pages_project.subdomain
+  type                      = "self_hosted"
+  session_duration          = "730h"
+  auto_redirect_to_identity = false
+}
+
+resource "cloudflare_access_application" "dispoflare_preview_access" {
+  account_id                = var.cloudflare_account_id
+  name                      = "Dispoflare (Preview)"
+  domain                    = "*.${cloudflare_pages_project.dispoflare_pages_project.subdomain}"
+  type                      = "self_hosted"
+  session_duration          = "730h"
+  auto_redirect_to_identity = false
+}

README.md

@@ -30,8 +30,9 @@ Dispoflare is an app using Cloudflare products to host and manage disposable ema
 
 Dispoflare is a full-stack app running on top of Cloudflare platform.
 We are of course assuming that you have:
-* A Cloudflare account (click [here](https://dash.cloudflare.com/sign-up) if you don't)
-* At least one [zone](https://www.cloudflare.com/learning/dns/glossary/dns-zone/) using Cloudflare.
+
+- A Cloudflare account (click [here](https://dash.cloudflare.com/sign-up) if you don't)
+- At least one [zone](https://www.cloudflare.com/learning/dns/glossary/dns-zone/) using Cloudflare.
   If you don't have a zone, you can use [Cloudflare Registrar](https://www.cloudflare.com/products/registrar/).
 
 All of the used Cloudflare products offer a [free plan](https://www.cloudflare.com/plans/) that allows to try them for personal or hobby projects.
@@ -54,7 +55,7 @@ Please pay attention to all the steps involved in the installation process.
 
 **Dispoflare has no user registration.**
 
-Wildebeest uses [Zero Trust Access](https://www.cloudflare.com/products/zero-trust/access/) to handle user authentication.
+Dispoflare uses [Zero Trust Access](https://www.cloudflare.com/products/zero-trust/access/) to handle user authentication.
 It assumes that your users will register with another identity provider (Zero Trust supports [many providers](https://developers.cloudflare.com/cloudflare-one/identity/idp-integration/) or your custom one that implements [Generic SAML 2.0](https://developers.cloudflare.com/cloudflare-one/identity/idp-integration/generic-saml/)).
 
 ## Development & Contributions
@@ -63,7 +64,7 @@ It assumes that your users will register with another identity provider (Zero Tr
 
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=586503021)
 
-This repository is ready for [Development Containers](https://containers.dev/).  
+This repository is ready for [Development Containers](https://containers.dev/).
 Click the badge above to create a codespace for this repository and start making and submitting changes.
 
 ### Local