sts

sts, a fully open-source status page with Gatus backend and Payload CMS

✨ Features

• Gatus Integration: Works with Gatus backend for monitoring.
• Incident Management: Built-in CMS for managing and displaying service incidents with status updates. Powered by Payload CMS.
• Status Updates on Real-time: Status information is automatically updated using SWR.
• Customizable: Easily update the site title, description, logo and more.
• Brand-free Footer: No attribution required

🛠️ Stack

• Framework: Next.js
• CMS: Payload CMS for incident management
• Database: SQLite (with Turso support) for incident storage
• UI: Radix UI Primitives, so everything is accessible
• Styling: Tailwind CSS with custom OKLCH colour palettes
• Data Fetching: SWR for effective real-time updates

📢 Incident Management

sts includes a built-in CMS for managing service incidents and status updates.

How It Works

• Active Incidents: Displayed prominently at the top of the status page
• Status Updates: Track incident progress with update types (Investigating, Identified, Monitoring, Update, Resolved)
• Timeline View: Each incident shows all updates in chronological order
• Public Access: Incidents are publicly visible; management requires authentication
• History: View past incidents for up to 30 days with pagination

Managing Incidents

1. Access the admin panel at /admin
2. Create your first admin user
3. Navigate to "Incidents" in the sidebar
4. Create a new incident with:
   • Title and description
   • Multiple status updates with timestamps
   • Rich text content for detailed explanations

Status Update Types

• Investigating: Issue identified, investigation in progress
• Identified: Root cause found
• Monitoring: Fix applied, monitoring the situation
• Update: General progress update
• Resolved: Issue completely resolved

Active incidents appear at the top of your status page until marked as "Resolved".

🚀 Getting Started

Prerequisites

• Bun (default) or Node.js.
• Gatus backend.
• A SQLite database (or Turso)

Installation

# Clone the repository
git clone https://github.com/sparanoid/sts.git
cd sts

# Install dependencies.
bun install

# Set environment variables (create .env.local)
echo "GATUS_API_BASE=https://your-gatus-instance.com/api/v1" > .env.local
echo "PAYLOAD_SECRET=your-secret-key" >> .env.local

# Run the development server
bun dev

Open http://localhost:3000 to view the status page. Open http://localhost:3000/admin to access the incident management admin panel.

Installation with subpath

# Clone the repository
git clone https://github.com/sparanoid/sts.git
cd sts

# Install dependencies.
bun install

# Set environment variables (create .env.local)
echo "NEXT_PUBLIC_API_BASE_PATH=/frontend" >> .env.local
echo "GATUS_API_BASE=https://your-gatus-instance.com/frontend/api/v1" > .env.local
echo "PAYLOAD_SECRET=your-secret-key-min-32-characters" >> .env.local

# Build the app server
bun run build
# Execute server development
bun dev
# Execute server production
bun start

Open http://localhost:3000/frontend with a browser to see the output

⚙️ Configuration

You can configure sts with environment variables:

🌐 Deployment

Deploy on Vercel

The easiest way to deploy sts is with Vercel:

Self-hosting

sts can be deployed with any hosting provider that supports Next.js applications.

📝 License

Apache-2.0