Dashboard Features

The VIJ Admin dashboard provides comprehensive error monitoring, AI-powered analysis, and powerful search and filtering capabilities.

Dashboard Overview

The dashboard home provides real-time insights into your application health.

Key Metrics

Total Errors

Track the total number of errors across all applications and environments

Error Rate

Monitor error frequency trends over time periods

Active Groups

View the number of unique error groups (deduplicated errors)

Dashboard Components

Error Trends Chart

Visualizes error frequency over time:

Time ranges: Last hour, 24 hours, 7 days, 30 days
Grouping: Hourly or daily buckets
Severity breakdown: Stacked by error, warning, info levels

// Example data structure
{
  timestamp: "2024-01-01T12:00:00Z",
  errors: 45,
  warnings: 12,
  info: 3
}

Hover over data points to see exact counts and timestamps.

Severity Distribution

Pie chart showing error distribution by severity:

Error (red) - Critical errors
Warning (yellow) - Non-critical issues
Info (blue) - Informational logs

Use Case: Quickly identify if your application has critical errors that need immediate attention.

Recent Errors

List of the most recent 10 errors with:

Error message
Severity badge
Application ID
Environment
Timestamp
Quick link to details

Quick Actions:

Click any error to view full details
Filter by clicking severity badges
Navigate to full logs view

Top Error Groups

Most frequently occurring errors (grouped by fingerprint): Shows:

Error message
Occurrence count
First seen timestamp
Last seen timestamp
Severity

Error grouping uses intelligent fingerprinting to deduplicate similar errors. Learn more about grouping →

Logs View

The logs page (/logs) provides comprehensive error browsing and filtering.

Logs Table

Columns:

Severity - Color-coded badge (error/warning/info)
Message - Error message preview (truncated)
App ID - Application identifier
Environment - Environment name
Timestamp - When the error occurred
Actions - View details button

Features:

Sorting: Click column headers to sort
Pagination: Navigate through large result sets
Row highlighting: Errors highlighted in red
Responsive: Optimized for mobile and desktop

Filtering Options

Quick Filters

Pre-built filters for common queries:

Severity
Environment
Application
Time Range

// Filter by severity
severity=error
severity=warning
severity=info

UI: Pill buttons at top of page

Advanced Filters

Combine multiple filters for precise queries:

severity=error&environment=production&appId=my-app&startDate=2024-01-01

Supported Operators:

= - Exact match
!= - Not equal
> / < - Greater/less than (timestamps)
~ - Contains (text search)

Filters are reflected in the URL, making it easy to bookmark or share specific views.

Full-Text Search

Search across error messages and stack traces:

search=TypeError: Cannot read property

Search Features:

Case-insensitive
Searches both message and stack fields
MongoDB text index for performance
Highlights matches in results

Search Tips:

// Find specific errors
"undefined is not an object"

// Find errors in a file
"checkout.js"

// Find errors from a function
"processPayment"

// Combine with filters
search=TypeError&severity=error&environment=production

Bulk Actions

Select multiple logs for bulk operations:

Delete - Remove selected logs
Export - Download as JSON or CSV
Mark as resolved - Archive errors

Deleted logs cannot be recovered. Export important data before deletion.

Error Details

Click any error to view comprehensive details.

Error Overview

Header Section:

Error name and message
Severity badge
Timestamp (relative and absolute)
Application ID and environment

Actions:

Share link
Export as JSON
Delete error
Mark as resolved

Stack Trace

Full stack trace with:

Line-by-line breakdown
File names and line numbers
Function names
Syntax highlighting

Error: Payment processing failed
    at processPayment (payment.js:45:12)
    at handleCheckout (checkout.js:123:5)
    at onClick (Button.tsx:67:20)

Click file paths to see context (if source maps are available).

Metadata Cards

Custom metadata displayed in organized cards:

User Context
Request Context
Application Context

{
  "userId": "user-123",
  "userEmail": "user@example.com",
  "userRole": "premium",
  "loginTime": "2024-01-01T10:00:00Z"
}

Display Rules:

Nested objects expanded by default
Arrays displayed as lists
Timestamps formatted relative
URLs made clickable

Browser/Node Context

Automatically collected environment information:

Browser
Node.js

Viewport:

Width: 1920px
Height: 1080px

Screen:

Resolution: 1920x1080
Color Depth: 24-bit

Browser:

User Agent: Mozilla/5.0…
Language: en-US
Platform: MacIntel
Cookies: Enabled

Network (if available):

Connection: 4G
Downlink: 10 Mbps
RTT: 50ms

AI Analysis (Optional)

If Google Gemini is configured, view AI-powered insights:

AI Summary

Concise description of what went wrong:

The error occurred when attempting to process a payment
transaction. The application tried to access a property
on an undefined object, suggesting that the payment data
was not properly validated before processing.

Possible Cause

Root cause analysis:

The payment object is likely undefined or null because:
The API request failed silently
The user session expired before checkout
The payment gateway timed out

Suggested Fix

Actionable recommendations:

Add null check before accessing payment.amount
Implement proper error handling for API failures
Add timeout handling with user feedback
Log API response for debugging

AI analysis is generated on-demand and cached for performance. It may take a few seconds on first load.

Similar Errors

View other errors in the same group:

Shows up to 10 similar errors
Sorted by most recent
Quick navigation between occurrences
Metadata comparison

Use Case: Identify patterns across multiple occurrences of the same error.

Error Groups

The groups page (/groups) shows deduplicated errors.

Groups Table

Columns:

Error Message - Representative message
Count - Number of occurrences
First Seen - When first occurred
Last Seen - Most recent occurrence
Severity - Highest severity in group
Actions - View all occurrences

Grouping Algorithm

Errors are grouped using a fingerprint generated from:

Error name - TypeError, ReferenceError, etc.
Error message - With dynamic values normalized
Stack trace - Top 3 stack frames

Example:

// These errors are grouped together:
"Error: User 123 not found"
"Error: User 456 not found"
"Error: User 789 not found"

// Fingerprint: Error:User_not_found

Learn more about error grouping →

Group Actions

View all occurrences - See all errors in group
Mark as resolved - Archive entire group
Set alert - Get notified on new occurrences
Export group - Download all occurrences

Real-Time Updates

The dashboard updates in real-time as new errors arrive:

Polling: Checks for new errors every 10 seconds
Visual indicator: New error badge
Auto-refresh: Optionally enable auto-refresh
Notifications: Browser notifications for critical errors

Enable browser notifications to get alerted immediately when critical errors occur.

Export Options

JSON Export
CSV Export
PDF Report

{
  "logs": [
    {
      "message": "Error message",
      "stack": "...",
      "timestamp": "2024-01-01T00:00:00Z",
      "metadata": {},
      "context": {}
    }
  ],
  "exportedAt": "2024-01-01T12:00:00Z",
  "totalCount": 100
}

Shareable Links

Generate shareable links to specific views:

# Specific error
https://vij.example.com/logs/abc123

# Filtered view
https://vij.example.com/logs?severity=error&environment=production

# Error group
https://vij.example.com/groups/group-fingerprint

Ensure your VIJ instance has proper authentication before sharing links externally.

Keyboard Shortcuts

Speed up navigation with keyboard shortcuts:

G then D - Go to Dashboard
G then L - Go to Logs
G then G - Go to Groups
/ - Focus search
ESC - Close modals
← / → - Navigate pagination

Press ? to view all keyboard shortcuts.

Performance Optimization

The dashboard is optimized for large datasets:

Virtualized tables: Render only visible rows
Lazy loading: Load data on scroll
Pagination: 50 items per page (configurable)
MongoDB indexes: Fast queries even with millions of logs
Caching: AI analysis and stats cached

Handling Large Datasets:

Use filters to narrow results
Archive old logs periodically
Implement log retention policies
Consider partitioning by time period

Customization

Theme

Toggle between light and dark modes:

// Auto-detect system preference
const theme = window.matchMedia('(prefers-color-scheme: dark)').matches
  ? 'dark'
  : 'light';

Columns

Customize which columns appear in logs table:

Show/hide columns
Reorder columns
Adjust column widths
Save preferences to local storage

Filters

Save custom filter presets:

// Save preset
{
  name: "Critical Production Errors",
  filters: {
    severity: "error",
    environment: "production"
  }
}

Next Steps

Dashboard Setup

Learn how to set up and configure the dashboard

Filtering & Search

Master advanced filtering and search techniques

Error Grouping

Understand how VIJ groups similar errors

AI Integration

Enable and configure AI-powered error analysis

Getting started

SDK

Dashboard

Advanced

​Dashboard Overview

​Key Metrics

Total Errors

Error Rate

Active Groups

​Dashboard Components

​Error Trends Chart

​Severity Distribution

​Recent Errors

​Top Error Groups

​Logs View

​Logs Table

​Filtering Options

​Quick Filters

​Advanced Filters

​Full-Text Search

​Bulk Actions

​Error Details

​Error Overview

​Stack Trace

​Metadata Cards

​Browser/Node Context

​AI Analysis (Optional)

​Similar Errors

​Error Groups

​Groups Table

​Grouping Algorithm

​Group Actions

​Real-Time Updates

​Export and Sharing

​Export Options

​Shareable Links

​Keyboard Shortcuts

​Performance Optimization

​Customization

​Theme

​Columns

​Filters

​Next Steps

Dashboard Setup

Filtering & Search

Error Grouping

AI Integration

Dashboard Overview

Key Metrics

Dashboard Components

Error Trends Chart

Severity Distribution

Recent Errors

Top Error Groups

Logs View

Logs Table

Filtering Options

Quick Filters

Advanced Filters

Full-Text Search

Bulk Actions

Error Details

Error Overview

Stack Trace

Metadata Cards

Browser/Node Context

AI Analysis (Optional)

Similar Errors

Error Groups

Groups Table

Grouping Algorithm

Group Actions

Real-Time Updates

Export and Sharing

Export Options

Shareable Links

Keyboard Shortcuts

Performance Optimization

Customization

Theme

Columns

Filters

Next Steps