Email templates UI (#608)

* initial devcontainer setup

* basic email template get, update and delete

* template creation ui

* remove error printing

* convert all plain text responses to `AppMessage`

* fix email template card margins

* wrap `params` prop type with `Promise<>`

* actions workflows for nextjs

* add @radix-ui/react-alert-dialog

* add @radix-ui/react-tabs

* only run workflows when relevant paths modified

Author: KavikaPalletenne

.devcontainer/Dockerfile

@@ -0,0 +1,8 @@
+FROM mcr.microsoft.com/devcontainers/base:ubuntu
+
+# Setup packages
+RUN apt update && export DEBIAN_FRONTEND=noninteractive \
+    && apt -y install --no-install-recommends libssl-dev pkgconf build-essential postgresql-client
+
+# Note: Rust, Node.js, and Bun are installed via devcontainer.json features.
+# sqlx-cli will be installed in post-create.sh to ensure it uses the correct cargo environment.

.devcontainer/devcontainer.json

@@ -0,0 +1,27 @@
+{
+  "name": "Chaos Dev Container",
+  "dockerComposeFile": "docker-compose.yml",
+  "service": "app",
+  "workspaceFolder": "/workspaces/chaos",
+  "features": {
+    "ghcr.io/devcontainers/features/node:1": {
+      "version": "lts"
+    },
+    "ghcr.io/devcontainers/features/rust:1": {
+      "version": "latest"
+    },
+    "ghcr.io/michidk/devcontainers-features/bun:1": {
+      "version": "latest"
+    }
+  },
+  "customizations": {
+    "vscode": {
+      "extensions": [
+        "rust-lang.rust-analyzer",
+        "DBCode.dbcode"
+      ]
+    }
+  },
+  "postCreateCommand": "bash .devcontainer/post-create.sh",
+  "remoteUser": "vscode"
+}

.devcontainer/docker-compose.yml

@@ -0,0 +1,29 @@
+services:
+  app:
+    build:
+      context: .
+      dockerfile: Dockerfile
+    volumes:
+      - ..:/workspaces/chaos:cached
+    # Overrides default command so things don't shut down after the process ends.
+    command: sleep infinity
+    # Use the same network as the db service to access it via localhost
+    network_mode: service:db
+
+  db:
+    image: postgres:17
+    restart: unless-stopped
+    environment:
+      POSTGRES_USER: postgres
+      POSTGRES_PASSWORD: password
+      POSTGRES_DB: chaos
+    volumes:
+      - chaos-postgres-data:/var/lib/postgresql/data
+    # Forward ports: 5432 (db), 3000 (frontend), 8080 (backend)
+    ports:
+      - "5433:5432"
+      - "3000:3000"
+      - "8080:8080"
+
+volumes:
+  chaos-postgres-data:

.devcontainer/post-create.sh

@@ -0,0 +1,46 @@
+#!/bin/bash
+set -e
+
+echo "Starting post-create setup..."
+
+# Create backend/.env
+echo "Creating backend/.env..."
+cat << 'EOF' > backend/.env
+DATABASE_URL="postgres://postgres:password@localhost:5432/chaos"
+JWT_SECRET="test_secret"
+GOOGLE_CLIENT_ID="test"
+GOOGLE_CLIENT_SECRET="test"
+GOOGLE_REDIRECT_URI="http://localhost:3000/auth/callback"
+S3_BUCKET_NAME="chaos-storage"
+S3_ACCESS_KEY="test_access_key"
+S3_SECRET_KEY="test_secret_key"
+S3_ENDPOINT="https://chaos-storage.s3.ap-southeast-1.amazonaws.com"
+S3_REGION_NAME="ap-southeast-1"
+DEV_ENV="dev"
+SMTP_USERNAME="test_username"
+SMTP_PASSWORD="test_password"
+SMTP_HOST="smtp.example.com"
+EOF
+
+# Install sqlx-cli if not present
+if ! command -V sqlx &> /dev/null; then
+    echo "Installing sqlx-cli..."
+    cargo install sqlx-cli --no-default-features --features native-tls,postgres
+fi
+
+# Wait for Postgres
+echo "Waiting for Postgres..."
+until PGPASSWORD=password psql -h "db" -U "postgres" -d "chaos" -c '\q' 2>/dev/null; do
+  echo "Waiting for postgres at db:5432..."
+  sleep 2
+done
+
+# Setup DB
+echo "Setting up database..."
+cd backend
+
+# Create database if not exists
+sqlx database create || true
+sqlx migrate run
+
+echo "Setup complete!"

.github/workflows/frontend-nextjs.yml

@@ -0,0 +1,38 @@
+name: Frontend (Next.js)
+
+on:
+  pull_request:
+    branches: [main, "renovate/*", "CHAOS-224-KHAOS-rewrite", "CHAOS-571-integrate-be-fe", "CHAOS-598-nextjs"]
+    paths:
+      - "frontend-nextjs/**"
+      - ".github/workflows/frontend-nextjs.yml"
+  push:
+    branches: ["renovate/*"]
+    paths:
+      - "frontend-nextjs/**"
+      - ".github/workflows/frontend-nextjs.yml"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ./frontend-nextjs
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v1
+        with:
+          bun-version: latest
+
+      - name: Install dependencies
+        run: bun install
+
+      - name: Build
+        run: bun run build
+        env:
+          NEXT_PUBLIC_APP_URL: http://localhost:3000
+          NEXT_OAUTH_CALLBACK_URL: http://localhost:8080/auth/google
+          NEXT_API_BASE_URL: https://localhost:8080

.github/workflows/rust.yml

@@ -2,9 +2,15 @@ name: Rust
 
 on:
   pull_request:
-    branches: [main, "renovate/*", "CHAOS-224-KHAOS-rewrite", "CHAOS-571-integrate-be-fe"]
+    branches: [main, "renovate/*", "CHAOS-224-KHAOS-rewrite", "CHAOS-571-integrate-be-fe", "CHAOS-598-nextjs"]
+    paths:
+      - "backend/**"
+      - ".github/workflows/rust.yml"
   push:
     branches: ["renovate/*"]
+    paths:
+      - "backend/**"
+      - ".github/workflows/rust.yml"
 
 env:
   CARGO_TERM_COLOR: always

backend/database-seeding/src/seeder.rs

@@ -325,14 +325,16 @@ pub async fn seed_database(mut seeder: Seeder) {
         .await.expect("Failed seeding Rating 3");
 
     let template = 
-    "Hello {{name}},
+    "
+Hello {{name}},
 
-    Congratulations! You have been selected for the role of {{role}} at {{organisation_name}} for our {{campaign_name}}.
+Congratulations! You have been selected for the role of {{role}} at {{organisation_name}} for our {{campaign_name}}.
 
-    Please confirm your acceptance by {{expiry_date}}.
+Please confirm your acceptance by {{expiry_date}}.
 
-    Best regards,  
-    The {{organisation_name}} Team".to_string();
+Best regards,
+The {{organisation_name}} Team
+    ".to_string();
 
 
     let email_template_id = Organisation::create_email_template(

backend/server/Cargo.toml

@@ -22,6 +22,7 @@ chrono = { version = "0.4", features = ["serde"] }
 oauth2 = "4.4"
 log = "0.4"
 uuid = { version = "1.5", features = ["serde", "v4"] }
+nanoid = "0.4.0"
 rust-s3 = "0.34.0"
 rs-snowflake = "0.6"
 jsonwebtoken = "9.1"

backend/server/src/constants.rs

@@ -0,0 +1,3 @@
+pub const NANOID_ALPHABET: [char; 16] = [
+'1', '2', '3', '4', '5', '6', '7', '8', '9', '0', 'a', 'b', 'c', 'd', 'e', 'f'
+];

backend/server/src/handler/answer.rs

@@ -6,7 +6,7 @@
 //! - Managing role-specific answers
 
 use crate::models::answer::{Answer, NewAnswer};
-use crate::models::app::AppState;
+use crate::models::app::{AppMessage, AppState};
 use crate::models::auth::{AnswerOwner, ApplicationOwner, ApplicationOwnerOrReviewer};
 use crate::models::error::ChaosError;
 use crate::models::transaction::DBTransaction;
@@ -141,7 +141,7 @@ impl AnswerHandler {
 
         transaction.tx.commit().await?;
 
-        Ok((StatusCode::OK, "Successfully updated answer"))
+        Ok(AppMessage::OkMessage("Successfully updated answer"))
     }
 
     /// Deletes an answer.
@@ -169,6 +169,6 @@ impl AnswerHandler {
 
         transaction.tx.commit().await?;
 
-        Ok((StatusCode::OK, "Successfully deleted answer"))
+        Ok(AppMessage::OkMessage("Successfully deleted answer"))
     }
 }