chore: merge aurora-backoffice in the monorepo

.github/workflows/semantic-release.yaml

@@ -15,10 +15,10 @@ jobs:
     if: ${{ needs.versioning.outputs.next-version != '' }}
 
     with:
-      projects: '["apps/aurora-core", "apps/aurora-client"]'
+      projects: '["apps/aurora-core", "apps/aurora-client", "apps/aurora-backoffice"]'
       version: ${{ needs.versioning.outputs.next-version }}
       docker-registry: 'abc.docker-registry.gewis.nl'
-      docker-paths: '["nc/aurora/core", "nc/aurora/client"]'
+      docker-paths: '["nc/aurora/core", "nc/aurora/client", "nc/aurora/backoffice"]'
       github-registry: 'true'
     secrets:
       REGISTRY_USERNAME: ${{ secrets.SVC_GH_ABCNC_USERNAME }}

.gitignore

@@ -6,6 +6,7 @@ yarn-debug.log*
 yarn-error.log*
 lerna-debug.log*
 .pnpm-debug.log*
+.pnpm-store
 
 # Coverage directory used by tools like istanbul
 coverage

README.md

@@ -50,9 +50,9 @@ All subscribers authenticate with an API key, then maintain a persistent SocketI
 
 | Repository                                                                  | Role                                                                                       | Tech                         |
 | --------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ | ---------------------------- |
-| [aurora-core](https://github.com/GEWIS/aurora-core)                         | Central publisher — receives commands and pushes state to all subscribers                  | TypeScript, NodeJS, SocketIO |
-| [aurora-backoffice](https://github.com/GEWIS/aurora-backoffice)             | Web management UI for humans to control Aurora                                             | TypeScript, React, SocketIO  |
-| [aurora-client](https://github.com/GEWIS/aurora-client)                     | Narrowcasting screen client — displays posters and information on screens                  | TypeScript, NodeJS, SocketIO |
+| `aurora-core` (this repo)                                                   | Central publisher — receives commands and pushes state to all subscribers                  | TypeScript, NodeJS, SocketIO |
+| `aurora-backoffice` (this repo)                                             | Web management UI for humans to control Aurora                                             | TypeScript, Vue, PrimeVue    |
+| `aurora-client` (this repo)                                                 | Narrowcasting screen client — displays posters and information on screens                  | TypeScript, NodeJS, SocketIO |
 | [aurora-audio-player](https://github.com/GEWIS/aurora-audio-player)         | Audio subscriber — plays music as commanded by the core                                    | TypeScript, NodeJS           |
 | [aurora-lights-proxy](https://github.com/GEWIS/aurora-lights-proxy)         | DMX controller bridge — forwards DMX packets from core to ArtNet hardware                  | Python, Art-Net              |
 | [aurora-lights-simulator](https://github.com/GEWIS/aurora-lights-simulator) | Lights effect development tool — simulate DMX output without physical hardware             | TypeScript, NodeJS           |
@@ -85,7 +85,7 @@ cd apps/aurora-core && pnpm dev
 
 ## Development with Docker Compose
 
-The monorepo includes a one-command Docker Compose setup that runs the core, client (narrowcasting), and their dependencies together.
+The monorepo includes a one-command Docker Compose setup that runs the core, backoffice, client (narrowcasting), and their dependencies together.
 
 ### Prerequisites
 
@@ -96,27 +96,29 @@ The monorepo includes a one-command Docker Compose setup that runs the core, cli
 
 ```bash
 # Start everything
-pnpm dev-up
+pnpm dev
 ```
 
 This will:
 
 1. Start the **core** (`http://localhost:3000`) with a pre-seeded SQLite database (GEWIS data set)
-2. Start the **client** (`http://localhost:8081`) with Vite dev server proxying API calls to the core
-3. Wait for the core to be ready and the database seeded
-4. Extract the first screen's API key from the database
-5. Open `http://localhost:8081?key=<screen-key>` in your browser — you are authenticated as that screen
+2. Start the **backoffice** (`http://localhost:8080`)
+3. Start the **client** (`http://localhost:8081`) with Vite dev server proxying API calls to the core
+4. Wait for the core to be ready and the database seeded
+5. Extract the first screen's API key from the database
+6. Open the client, backoffice, and API docs in your browser
+7. Stay running in the foreground — press **Ctrl-C** to stop the environment gracefully
 
 ### Teardown
 
 ```bash
-pnpm dev-down
+docker compose down
 ```
 
 Containers are removed but the `node_modules` volume is kept for fast restarts. To fully reset:
 
 ```bash
-pnpm dev-down -v    # also removes cached node_modules
+docker compose down -v    # also removes cached node_modules
 ```
 
 ## External Integrations
@@ -139,8 +141,8 @@ If you want to integrate your own service with Aurora — to fetch data, send co
 1. Fork the repository.
 2. Create a feature branch: `git checkout -b feat/your-feature-name`.
 3. Make your changes.
-4. Run tests: `pnpm --filter aurora-core test`.
-5. Run linting: `pnpm --filter aurora-core lint-fix`.
+4. Run tests: `pnpm --filter @gewis/aurora-core test`.
+5. Run linting: `pnpm lint`.
 6. Commit using [Conventional Commits](https://www.conventionalcommits.org/): `git commit -m "feat: add your feature"`.
 7. Push: `git push origin feat/your-feature-name`.
 8. Open a Pull Request.

apps/aurora-backoffice/.gitignore

@@ -0,0 +1,5 @@
+# Build output
+dist
+
+# Local dev
+.env

apps/aurora-backoffice/Dockerfile

@@ -0,0 +1,23 @@
+# build context: the output of `pnpm turbo prune @gewis/aurora-backoffice --docker`
+FROM node:22 AS builder
+ENV CI=true
+WORKDIR /app
+
+COPY json/ ./
+COPY full/ ./
+
+RUN corepack enable
+RUN pnpm install --no-frozen-lockfile
+RUN pnpm --filter @gewis/aurora-api-client run sync
+RUN pnpm --filter @gewis/aurora-api-client run build
+RUN pnpm --filter @gewis/aurora-backoffice run build
+
+FROM nginx:alpine
+WORKDIR /usr/src/app
+
+COPY full/apps/aurora-backoffice/docker/nginx.conf /etc/nginx/nginx.conf
+COPY full/apps/aurora-backoffice/public /usr/src/app/public
+COPY --from=builder /app/apps/aurora-backoffice/dist /usr/src/app
+
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

apps/aurora-backoffice/README.md

@@ -0,0 +1,24 @@
+# Aurora Backoffice
+
+This is the **management interface** of the Aurora suite — the web UI used to control DMX lighting, narrowcasting screens, and music playback. The backoffice sends commands to the core over HTTP and receives real-time state updates over SocketIO.
+See the root [README](../README.md) for the full architecture overview and list of all Aurora repositories.
+
+## Prerequisites
+
+- NodeJS 22.
+
+## Development setup
+
+1. Run `pnpm install` from the monorepo root.
+1. Run `pnpm dev`.
+1. The application is now running at http://localhost:8080.
+   In development mode, you are automatically logged in without OIDC credentials (mock auth).
+
+By default, the dev server proxies API requests to `http://localhost:3000`. To use a different core URL, set `VITE_CORE_URL` in the environment.
+
+## Deployment
+
+Deployment is handled by Docker Compose from the monorepo root alongside Aurora Core.
+The backoffice can be built standalone with `pnpm docker-build` from this directory.
+
+In production, the backoffice authenticates via OIDC (Keycloak). The `VITE_OIDC_*` environment variables must be configured for the production build.

apps/aurora-backoffice/docker/nginx.conf

@@ -0,0 +1,84 @@
+user  nginx;
+worker_processes  1;
+error_log  /var/log/nginx/error.log warn;
+pid        /var/run/nginx.pid;
+
+events {
+    worker_connections  1024;
+}
+
+http {
+
+    upstream aurora_core {
+        server core:3000;
+    }
+
+    include       /etc/nginx/mime.types;
+    default_type  application/octet-stream;
+    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
+                    '$status $body_bytes_sent "$http_referer" '
+                    '"$http_user_agent" "$http_x_forwarded_for"';
+    access_log  /var/log/nginx/access.log  main;
+    sendfile        on;
+    keepalive_timeout  65;
+    server {
+        listen       80;
+        server_name  localhost;
+        location / {
+            root   /usr/src/app;
+            index  index.html;
+            try_files $uri $uri/ /index.html;
+        }
+
+        location /api-docs {
+            proxy_pass http://aurora_core;
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header Host $host;
+            proxy_redirect off;
+
+            proxy_http_version 1.1;
+            proxy_set_header Upgrade $http_upgrade;
+            proxy_set_header Connection "Upgrade";
+        }
+
+        location /api/ {
+            proxy_pass http://aurora_core;
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header Host $host;
+            proxy_redirect off;
+
+            proxy_http_version 1.1;
+            proxy_set_header Upgrade $http_upgrade;
+            proxy_set_header Connection "Upgrade";
+        }
+
+        location /socket.io/ {
+            proxy_pass http://aurora_core;
+            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+            proxy_set_header Host $host;
+            proxy_redirect off;
+
+            proxy_http_version 1.1;
+            proxy_set_header Upgrade $http_upgrade;
+            proxy_set_header Connection "Upgrade";
+        }
+
+        location /static/posters/ {
+            alias /usr/src/app/data/posters/;
+        }
+
+        location /static/local-posters/ {
+            alias /usr/src/app/data/local-posters/;
+        }
+
+        location /static/audio/ {
+            alias /usr/src/app/data/audio/;
+        }
+
+
+        error_page   500 502 503 504  /50x.html;
+        location = /50x.html {
+            root   /usr/share/nginx/html;
+        }
+    }
+}

apps/aurora-backoffice/env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

apps/aurora-backoffice/eslint.config.mjs

@@ -0,0 +1,5 @@
+import { eslintConfig as common } from '@gewis/eslint-config-typescript';
+import { eslintConfig as vue } from '@gewis/eslint-config-vue';
+import { eslintConfig as prettier } from '@gewis/prettier-config';
+
+export default [...common, ...vue, prettier];

apps/aurora-backoffice/index.html

@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+    <link rel="manifest" href="/site.webmanifest" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Aurora</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

apps/aurora-backoffice/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@gewis/aurora-backoffice",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "preview": "vite preview",
+    "build": "vite build",
+    "typecheck": "vue-tsc -b --noEmit",
+    "lint": "eslint src --max-warnings=1",
+    "lint-fix": "eslint src --fix",
+    "docker-build": "pnpm turbo prune @gewis/aurora-backoffice --docker && docker build -f Dockerfile -t aurora-backoffice ../../out"
+  },
+  "dependencies": {
+    "@gewis/aurora-api-client": "workspace:*",
+    "@gewis/splash": "2.4.0",
+    "@primeuix/themes": "1.2.0",
+    "@primevue/core": "4.3.6",
+    "@tailwindcss/postcss": "4.1.14",
+    "@vee-validate/yup": "4.15.1",
+    "cronstrue": "2.61.0",
+    "dotenv": "16.6.1",
+    "pinia": "3.0.3",
+    "primeicons": "7.0.0",
+    "primevue": "4.3.6",
+    "socket.io-client": "4.8.1",
+    "tailwind": "4.0.0",
+    "tailwindcss-primeui": "0.6.1",
+    "uuid": "11.1.0",
+    "vue": "3.5.22",
+    "vue-router": "4.5.1",
+    "vue-timeago3": "2.3.2",
+    "yup": "1.6.1"
+  },
+  "devDependencies": {
+    "@gewis/eslint-config-typescript": "2.3.0",
+    "@gewis/eslint-config-vue": "2.3.0",
+    "@gewis/prettier-config": "2.2.2",
+    "@tsconfig/node22": "22.0.2",
+    "@types/lodash": "4.17.20",
+    "@types/uuid": "10.0.0",
+    "@vitejs/plugin-vue": "5.2.4",
+    "@vue/tsconfig": "0.7.0",
+    "autoprefixer": "10.4.21",
+    "eslint": "9.31.0",
+    "lodash": "4.17.21",
+    "npm-run-all": "4.1.5",
+    "postcss": "8.5.6",
+    "sass": "1.89.2",
+    "tailwindcss": "4.1.11",
+    "typescript": "5.8.3",
+    "vite": "6.3.5",
+    "vite-plugin-chunk-split": "0.5.0",
+    "vue-tsc": "2.2.12"
+  },
+  "engines": {
+    "node": ">=22.0.0"
+  }
+}

apps/aurora-backoffice/postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    autoprefixer: {},
+  },
+};

apps/aurora-backoffice/public/site.webmanifest

@@ -0,0 +1,11 @@
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" },
+    { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

apps/aurora-backoffice/src/App.vue

@@ -0,0 +1,4 @@
+<template>
+  <ConfirmDialog />
+  <RouterView />
+</template>

apps/aurora-backoffice/src/assets/layout/_content.scss

@@ -0,0 +1,14 @@
+@use './_variables' as *;
+
+.layout-main-container {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  justify-content: space-between;
+  padding: 7rem 2rem 2rem 4rem;
+  transition: margin-left $transitionDuration;
+}
+
+.layout-main {
+  flex: 1 1 auto;
+}