Skip to content

Dashboard Overview

The SkyState dashboard is a web UI for managing your projects, remote config, usage, billing, and account settings. It provides the same capabilities as the CLI, with a visual editor for JSON config and charts for usage data.

Top Bar

The top bar runs across the top of every dashboard page and contains three sections:

Left — Brand and project selector

  • The SkyState logo and name
  • A project selector dropdown for switching between your projects
  • A gear icon (link to Project Settings for the selected project)

Center — Tab bar

  • Three tabs for switching between state types: Remote Config, User State, and Session State
  • The tab bar is only active when a project is selected and you are on a project-scoped page

Right — Account and tier

  • Your current subscription tier badge (e.g. Free, Hobby, Pro)
  • Your account name, which opens the account menu

Account Menu

Clicking your account name in the top-right opens a dropdown with:

  • Usage — view resource consumption meters and project breakdown
  • Billing & Plans — manage your subscription and view invoice history
  • Account Settings — view your profile, billing details, and danger zone
  • Sign out — ends your session and returns to the login page

Tab Bar

The center tab bar contains three tabs:

TabPathDescription
Remote Config/JSON config editor with versioning and diffs
User State/user-stateComing soon — user-scoped durable state
Session State/session-stateComing soon — session-scoped durable state

Clicking a tab while you have unsaved edits in the Remote Config editor triggers an "Unsaved changes" confirmation dialog before navigating away.

Page Routes

In addition to tabs, several pages are accessible through the account menu or gear icon:

PathPage
/Remote Config tab
/user-stateUser State tab
/session-stateSession State tab
/settingsProject Settings
/usageUsage
/plansBilling & Plans
/accountAccount Settings

Project Selector

The project selector in the top bar lets you switch between projects. The selected project is persisted in the URL as a ?project=<id> query parameter, so you can share or bookmark a direct link to a specific project.

When you have no projects yet, the dashboard displays a "Create a new project" form in the main content area instead of the editor.

Creating a Project

If you have no projects, the dashboard shows a creation form with:

  • Project name — human-friendly label shown in the UI
  • Slug — URL-safe identifier used in API paths (auto-derived from the name, cannot be changed after creation)
  • Environments — three fixed environments are created automatically: Development, Staging, and Production

You can also create a project from the CLI and it will appear here automatically.

URL Parameters

The dashboard preserves your selected project in the URL:

https://your-domain.com/?project=<project-id>
https://your-domain.com/settings?project=<project-id>

Navigating between tabs preserves the ?project parameter.

Unsaved Changes Guard

When you edit config in the Remote Config editor and attempt to navigate away (switch tab, switch project, or use the account menu), a dialog appears:

Unsaved changes You have unsaved changes. Do you want to discard them?

You can choose Cancel to return to editing, or Discard to proceed without saving.

Built with VitePress