Merge pull request #131 from arrhes/dashboard-redesign

Dashboard redesign

Author: 656d696c65

.workflows/build/compose.yml

@@ -8,6 +8,7 @@
 #   ci        - Lint + unit tests + build (gate before packaging)
 #   api       - Production API image
 #   website   - Production Website image (nginx + static)
+#   dashboard - Production Dashboard image (nginx + SPA)
 #   worker    - Production Worker image (background job processor)
 #
 # Usage:
@@ -35,6 +36,17 @@ services:
       args:
         - VITE_WEBSITE_BASE_URL=${VITE_WEBSITE_BASE_URL:-}
         - VITE_API_BASE_URL=${VITE_API_BASE_URL:-}
+        - VITE_DASHBOARD_BASE_URL=${VITE_DASHBOARD_BASE_URL:-}
+
+  dashboard:
+    image: arrhes-dashboard:${ARRHES_VERSION:-dev}
+    build:
+      context: ../..
+      dockerfile: .workflows/build/packages/dashboard/Dockerfile
+      args:
+        - VITE_API_BASE_URL=${VITE_API_BASE_URL:-}
+        - VITE_WEBSITE_BASE_URL=${VITE_WEBSITE_BASE_URL:-}
+
 
   worker:
     image: arrhes-worker:${ARRHES_VERSION:-dev}

.workflows/build/packages/ci/Dockerfile

@@ -26,8 +26,8 @@ RUN pnpm install
 # Build all packages (must run before tests so workspace deps are compiled)
 RUN pnpm run build
 
-# Auto-format, then run Biome check (lint)
-RUN pnpm format:fix && pnpm check
+# Auto-fix formatting + imports, then run Biome check (lint)
+RUN pnpm check:fix && pnpm check
 
 # Run unit tests
 RUN pnpm --recursive --if-present --filter='./packages/**' run test:unit

.workflows/build/packages/dashboard/.dockerignore

@@ -0,0 +1,17 @@
+# Include any files or directories that you don't want to be copied to your
+# container here (e.g., local build artifacts, temporary files, etc.).
+#
+# For more help, visit the .dockerignore file reference guide at
+# https://docs.docker.com/go/build-context-dockerignore/
+
+**/.dockerignore
+**/.env
+**/.vscode
+**/.git
+**/.gitignore
+**/docker-compose*
+**/compose*
+**/Dockerfile*
+**/node_modules
+**/build
+README.md

.workflows/build/packages/dashboard/Dockerfile

@@ -0,0 +1,32 @@
+# Use an official Node.js image to build our image from
+FROM node:25.2.1-alpine AS base
+RUN npm install -g pnpm@10.26.1
+ENV NODE_OPTIONS="--max-old-space-size=4096"
+
+# Build the repo
+FROM base AS build
+
+# Build arguments for Vite environment variables
+ARG VITE_API_BASE_URL
+ARG VITE_WEBSITE_BASE_URL
+
+WORKDIR /root
+COPY . .
+RUN pnpm install
+
+# Write VITE_* build args to .env so Vite can read them during build.
+# Vite reads import.meta.env from .env files, not from process.env.
+RUN printf "VITE_API_BASE_URL=%s\nVITE_WEBSITE_BASE_URL=%s\n" \
+    "$VITE_API_BASE_URL" "$VITE_WEBSITE_BASE_URL" \
+    > packages/dashboard/.env
+
+RUN pnpm --filter @arrhes/application-dashboard... run build
+
+# Start application
+FROM nginx:alpine AS deploy
+WORKDIR /
+COPY .workflows/build/packages/dashboard/nginx/default.conf /etc/nginx/nginx.conf
+RUN rm -rf /usr/share/nginx/html/*
+COPY --from=build /root/packages/dashboard/build /usr/share/nginx/html
+EXPOSE 80
+CMD ["nginx"]

.workflows/build/packages/dashboard/nginx/default.conf

@@ -0,0 +1,40 @@
+# default.conf
+worker_processes auto;
+
+daemon off;
+
+events {
+  worker_connections 1024;
+}
+
+http {
+  include mime.types;
+  
+  server {
+    listen 80;
+
+    gzip on;
+    gzip_http_version 1.1;
+    gzip_disable      "MSIE6";
+    gzip_min_length   256;
+    gzip_vary         on;
+    gzip_proxied      any;
+    gzip_types        text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript font/woff2;
+    gzip_comp_level   9;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    # Immutable hashed assets (JS, CSS, fonts, images) - cache for 1 year
+    location ~* \.(?:js|css|woff2?|ttf|eot|svg|png|jpg|jpeg|gif|webp|webmanifest)$ {
+      add_header Cache-Control "public, max-age=31536000, immutable";
+      try_files $uri =404;
+    }
+
+    # SPA fallback - all routes served by index.html
+    location / {
+      add_header Cache-Control "no-cache";
+      try_files $uri $uri/ /index.html =404;
+    }
+  }
+}

.workflows/build/packages/website/Dockerfile

@@ -9,24 +9,32 @@ FROM base AS build
 # Build arguments for Vite environment variables
 ARG VITE_WEBSITE_BASE_URL
 ARG VITE_API_BASE_URL
+ARG VITE_DASHBOARD_BASE_URL
 
 WORKDIR /root
 COPY . .
 RUN pnpm install
 
 # Write VITE_* build args to .env so Vite can read them during build.
 # Vite reads import.meta.env from .env files, not from process.env.
-RUN printf "VITE_WEBSITE_BASE_URL=%s\nVITE_API_BASE_URL=%s\n" \
-    "$VITE_WEBSITE_BASE_URL" "$VITE_API_BASE_URL" \
+RUN printf "VITE_WEBSITE_BASE_URL=%s\nVITE_API_BASE_URL=%s\nVITE_DASHBOARD_BASE_URL=%s\n" \
+    "$VITE_WEBSITE_BASE_URL" "$VITE_API_BASE_URL" "$VITE_DASHBOARD_BASE_URL" \
     > packages/website/.env
 
 RUN pnpm --filter @arrhes/application-website... run build
 
+# Stamp CLI files from VERSION
+RUN VER=$(cat VERSION | tr -d 'v[:space:]') && \
+    sed -i "s/^VERSION=\".*\"/VERSION=\"$VER\"/" packages/cli/arrhes.sh && \
+    printf '%s\n' "$VER" > packages/cli/version
+
 # Start application
 FROM nginx:alpine AS deploy
 WORKDIR /
 COPY .workflows/build/packages/website/nginx/default.conf /etc/nginx/nginx.conf
 RUN rm -rf /usr/share/nginx/html/*
 COPY --from=build /root/packages/website/build /usr/share/nginx/html
+COPY --from=build /root/packages/cli/install.sh /usr/share/nginx/html/cli/install.sh
+COPY --from=build /root/packages/cli/version /usr/share/nginx/html/cli/version
 EXPOSE 80
 CMD ["nginx"]

.workflows/build/packages/website/nginx/default.conf

@@ -30,6 +30,13 @@ http {
     location = /og.png      { add_header Cache-Control "public, max-age=86400"; try_files $uri =404; }
     location = /og.webp     { add_header Cache-Control "public, max-age=86400"; try_files $uri =404; }
 
+    # CLI install scripts and version file - serve as plain text, no caching
+    location ~* ^/cli/(.*\.sh|version)$ {
+      add_header Cache-Control "no-cache";
+      add_header Content-Type "text/plain; charset=utf-8";
+      try_files $uri =404;
+    }
+
     # Immutable hashed assets (JS, CSS, fonts, images) - cache for 1 year
     location ~* \.(?:js|css|woff2?|ttf|eot|svg|png|jpg|jpeg|gif|webp|webmanifest)$ {
       add_header Cache-Control "public, max-age=31536000, immutable";
@@ -39,7 +46,11 @@ http {
     # HTML and other mutable files - always revalidate
     location / {
       add_header Cache-Control "no-cache";
-      try_files $uri $uri/ /index.html =404;
+      # Use a blank SPA shell (__app.html) as the fallback for routes that
+      # have no prerendered file (e.g. /dashboard).  index.html contains
+      # the prerendered home page and must not be served as a catch-all,
+      # otherwise it flashes on every non-home route refresh.
+      try_files $uri $uri/ /__app.html =404;
     }
   }
 }

.workflows/dev/compose.yml

@@ -128,11 +128,12 @@ services:
       ENV: development
       VERBOSE: "true"
       PORT: "${API_HOST_PORT}"
-      CORS_ORIGIN: "http://localhost:${WEBSITE_HOST_PORT}"
+      CORS_ORIGIN: localhost
       COOKIES_DOMAIN: localhost
       COOKIES_KEY: development-secret-key-change-in-production-min-32-chars
       API_BASE_URL: "http://localhost:${API_HOST_PORT}"
       WEBSITE_BASE_URL: "http://localhost:${WEBSITE_HOST_PORT}"
+      DASHBOARD_BASE_URL: "http://localhost:${DASHBOARD_HOST_PORT}"
       SQL_DATABASE_URL: "postgres://postgres:admin@localhost:${POSTGRES_HOST_PORT}/default"
       STORAGE_ENDPOINT: "http://localhost:${STORAGE_HOST_PORT}"
       STORAGE_BUCKET_NAME: arrhes-files
@@ -192,6 +193,32 @@ services:
       VITE_ENV: development
       VITE_API_BASE_URL: "http://localhost:${API_HOST_PORT}"
       VITE_WEBSITE_BASE_URL: "http://localhost:${WEBSITE_HOST_PORT}"
+      VITE_DASHBOARD_BASE_URL: "http://localhost:${DASHBOARD_HOST_PORT}"
+
+  # Dashboard - SPA dashboard interface (React + Vite)
+  dashboard:
+    container_name: arrhes-dashboard
+    image: arrhes-dev-dashboard:latest
+    build:
+      context: ../..
+      dockerfile: .workflows/dev/packages/dashboard/Dockerfile
+      args:
+        NODE_VERSION: "25.2.1"
+        PNPM_VERSION: "10.26.1"
+    networks:
+      default:
+        aliases:
+          - dashboard.arrhes.localhost
+    volumes:
+      - ../..:/workspace:cached
+    ports:
+      - "127.0.0.1:${DASHBOARD_HOST_PORT}:5174"
+    environment:
+      # Vite reads VITE_* from .env files, not process.env.
+      # The entrypoint writes these to packages/dashboard/.env at startup.
+      VITE_ENV: development
+      VITE_API_BASE_URL: "http://localhost:${API_HOST_PORT}"
+      VITE_WEBSITE_BASE_URL: "http://localhost:${WEBSITE_HOST_PORT}"
 
   # Worker - Background job processor (Bull queue + Redis pub/sub)
   worker:

.workflows/dev/packages/dashboard/Dockerfile

@@ -0,0 +1,25 @@
+# ==============================================================================
+# Dashboard Development Dockerfile
+# ==============================================================================
+# Minimal Node.js + PNPM image for running the dashboard dev server.
+# The full workspace (including node_modules) is bind-mounted at runtime.
+# Dependencies must be installed on the host before starting.
+#
+# Environment variables are set in compose.yml and written to .env at startup
+# so Vite can read them (Vite reads VITE_* from .env files, not process.env).
+# ==============================================================================
+
+ARG NODE_VERSION="25.2.1"
+ARG PNPM_VERSION="10.26.1"
+
+FROM node:${NODE_VERSION}-bullseye-slim
+
+ARG PNPM_VERSION
+
+# Install PNPM
+RUN npm install -g "pnpm@${PNPM_VERSION}"
+
+WORKDIR /workspace/packages/dashboard
+
+# Generate .env from compose environment variables, run Panda codegen, then start Vite
+CMD ["sh", "-c", "printenv | grep '^VITE_' > .env && cd /workspace/packages/ui && pnpm panda codegen && cd /workspace/packages/dashboard && pnpm panda codegen && pnpm dev -- --host 0.0.0.0"]

.workflows/dev/up.sh

@@ -72,6 +72,7 @@ mailpit_ui_host_port=$(_allocate_port_for_key MAILPIT_UI_HOST_PORT)
 mailpit_smtp_host_port=$(_allocate_port_for_key MAILPIT_SMTP_HOST_PORT)
 postgres_host_port=$(_allocate_port_for_key POSTGRES_HOST_PORT)
 redis_host_port=$(_allocate_port_for_key REDIS_HOST_PORT)
+dashboard_host_port=$(_allocate_port_for_key DASHBOARD_HOST_PORT)
 
 cat > "$PORTS_FILE" <<EOF
 WEBSITE_HOST_PORT=$website_host_port
@@ -82,6 +83,7 @@ MAILPIT_UI_HOST_PORT=$mailpit_ui_host_port
 MAILPIT_SMTP_HOST_PORT=$mailpit_smtp_host_port
 POSTGRES_HOST_PORT=$postgres_host_port
 REDIS_HOST_PORT=$redis_host_port
+DASHBOARD_HOST_PORT=$dashboard_host_port
 EOF
 
 if ! WEBSITE_HOST_PORT="$website_host_port" \
@@ -92,6 +94,7 @@ if ! WEBSITE_HOST_PORT="$website_host_port" \
    MAILPIT_SMTP_HOST_PORT="$mailpit_smtp_host_port" \
    POSTGRES_HOST_PORT="$postgres_host_port" \
    REDIS_HOST_PORT="$redis_host_port" \
+   DASHBOARD_HOST_PORT="$dashboard_host_port" \
        "${DC[@]}" up --detach --build --force-recreate --wait; then
     echo ""
     echo "=============================================="
@@ -113,6 +116,7 @@ echo "  Arrhes Development Environment"
 echo "=============================================="
 echo ""
 echo "  Services:"
+echo "    Dashboard:  http://localhost:$dashboard_host_port"
 echo "    Website:    http://localhost:$website_host_port"
 echo "    API:        http://localhost:$api_host_port"
 echo ""
@@ -134,3 +138,4 @@ echo "    Password:   admin"
 echo ""
 echo "  Logs: docker compose -f $COMPOSE_FILE logs -f"
 echo "=============================================="
+echo ""