Kuma Watch

A lightweight status dashboard for Uptime Kuma. Connects to your existing instance and displays the live status of all monitors in a modern neumorphism design — with response time charts, uptime statistics (24h/30d/365d), TLS certificate info, collapsible groups, dark/light mode, and multi-language support (DE/EN).

---

Fork & Setup

1. Fork & clone the repository

Click Fork in the top right, then:

git clone https://github.com/YOUR-USERNAME/kuma-watch.git
cd kuma-watch
npm install

2. Configure environment variables

cp .env.example .env.local

Edit .env.local:

# URL of your Uptime Kuma instance
UPTIME_KUMA_URL=https://uptime.example.com

# API Key (Uptime Kuma → Settings → API Keys → Add API Key)
UPTIME_KUMA_API_KEY=uk1_xxxxxxxxxxxxxxxxxxxxxxxx

# Slug of your Status Page (from the URL: /status/SLUG)
UPTIME_KUMA_STATUS_PAGE=my-status-page

# Auto-refresh interval in seconds
NEXT_PUBLIC_REFRESH_INTERVAL=30

# Dashboard title
NEXT_PUBLIC_APP_TITLE=Kuma Watch

# Default language: "de" or "en"
NEXT_PUBLIC_DEFAULT_LOCALE=de

# External links for footer (optional)
NEXT_PUBLIC_IMPRINT_URL=https://example.com/imprint
NEXT_PUBLIC_PRIVACY_URL=https://example.com/privacy

3. Run locally

npm run dev

Open http://localhost:3000.

---

Customization

Colors

All colors are CSS variables in app/globals.css — :root for light, .dark for dark mode. Neumorphism shadows adapt automatically.

Logo

Replace public/logo/kuma-watch-logo.svg with your own SVG.

Add a language

1. Create a new file in messages/ (e.g. fr.json, copy structure from de.json)
2. Add the locale in i18n/routing.ts: locales: ["de", "en", "fr"]
3. Add a button in components/theme/LocaleSwitcher.tsx

---

Deployment

Vercel (recommended)

1. Connect your repo on Vercel
2. Add the environment variables from .env.local in the Vercel project settings
3. Deploy — done

Self-Hosted (Node.js)

npm run build
npm start

Place behind a reverse proxy (nginx, Caddy, Traefik).

---

Requirements

• Node.js 18.17+
• Uptime Kuma 1.23+ with a configured Status Page and API Key
• For 30d/365d uptime values: enable Prometheus Metrics in Uptime Kuma

License

MIT

---

Note: Please keep the footer credit ("Built by panic-Patrick") visible. You're free to fork and customize everything else — just leave the attribution in place. Thank you! npm run build npm start

## Deployment (Coolify)

1. Repository in Coolify hinzufügen
2. **Build Command:** `npm run build`
3. **Start Command:** `npm start`
4. Umgebungsvariablen im Coolify UI eintragen (ohne `NEXT_PUBLIC_` Prefix für Server-only vars)
5. Custom Domain konfigurieren

## API Routes

| Route | Beschreibung |
|---|---|
| `GET /api/status` | Gesamtstatus (Up/Down Zahlen) |
| `GET /api/monitors` | Alle Monitore mit Heartbeats |
| `GET /api/monitors/[id]` | Einzelner Monitor |
| `GET /api/heartbeats/[id]` | Heartbeat-Historie |

## Sprachunterstützung

Das Dashboard unterstützt **Deutsch** (Standard) und **Englisch**:

- `/de` → Deutsch
- `/en` → English

Die Sprache kann über den Globe-Button im Header gewechselt werden.