Ziggy
42 Components

Front endout of the box.

Authentication flows, MFA setup, settings dashboard, compliance views, monitoring UI, and state management — 42 React components and 8 Zustand stores ready before you write your first feature.

Section 1

Authentication UI login to lockout, handled

Login, registration, OAuth, password reset, MFA verification, invitation acceptance, and unapproved-user flows — every authentication screen is built with form validation, error handling, and responsive design before you write a line of UI code.

  • Login page with email/password, Google and Microsoft OAuth buttons, and LDAP tab
  • Registration with real-time password validation: 12+ characters, uppercase, lowercase, special
  • Forgot password and reset password flows with verification code entry
  • MFA verification modal during login with method selection (TOTP, email, backup code)
  • Invitation acceptance page with token validation and account creation
  • Unapproved user waiting screen with status messaging
Section 2

Multi-Factor Auth Experience setup wizard to trusted devices

A multi-step MFA setup wizard, mandatory enrollment flow for admin roles, trusted device management, backup code display with copy and download, and recovery email configuration — the complete MFA user experience.

  • MFA setup wizard: scan QR code, verify TOTP, save backup codes, complete
  • Mandatory MFA enrollment flow for admin roles with grace period countdown
  • Trusted device management with expiration dates and one-click revocation
  • Backup code display with copy-to-clipboard and download functionality
  • Recovery email configuration for MFA reset scenarios
  • MFA settings section in user profile with enable/disable controls
Section 3

Settings Dashboard every configuration surface built

A tabbed settings modal covering users, organizations, teams, SMTP, OAuth, AI providers, and session management. Each settings form includes validation, masked secrets, test actions, and real-time feedback.

  • Master settings modal with tab navigation across all configuration areas
  • User management: organization assignment, role changes, failed login resets
  • Organization CRUD with member counts and activation controls
  • Team management with member assignment and shared role configuration
  • SMTP email configuration with test email sending
  • Google and Microsoft OAuth provider configuration with masked secrets
  • AI provider settings for Anthropic and OpenAI with model pricing display
Section 4

Security & Compliance UI audit logs, alerts, policies

Audit log viewer with AG Grid for filtering and pagination, alert management with severity badges and acknowledgement tracking, per-user notification preferences, and password policy configuration — the compliance admin surface.

  • Audit log viewer with AG Grid — filter by organization, event type, user, date range
  • Audit log detail modal with full metadata display
  • Alert management with severity badges and acknowledgement tracking
  • Alert configuration: event-to-severity mappings, digest intervals
  • Per-user notification preferences: digest frequency, minimum severity
  • Password policy configuration: length, complexity, signup mode, MFA requirements
Section 5

Monitoring & Operations health dashboards built in

Database health, instance health, log management, AI usage tracking, and background job indicators — operational visibility without building a single monitoring component.

  • Database health dashboard: connections, cache hit ratio, dead tuples, replication lag, lock waits
  • Instance health monitoring: CPU (5s/60s averages), RAM, disk per instance
  • Configurable thresholds with warning and critical levels
  • Log level configuration and log file viewer
  • AI usage log viewer with provider, model, token, and cost details
  • Background jobs indicator with status polling and toast notifications on completion
Section 6

State Management 8 stores, typed and persistent

Eight Zustand stores with typed state shapes and async actions. Auth state with persistence, alerting with real-time updates, background job polling, health monitoring, and AI usage tracking — all wired up and ready.

  • Auth store: user session, organization context, MFA state, OAuth status with persistence
  • Alerting store: alerts list, notification preferences, settings with fetch/update actions
  • Background jobs store: active jobs with 4-second polling interval and toast notifications
  • Database and instance health stores with threshold settings and refresh
  • AI store: provider settings, usage logs with provider/model filtering
  • Consistent patterns: loading states, error handling, and typed async actions across all stores

Want to see it in action? Get in touch for a demo or trial