adonisjs-pulse 0.0.1

package/build/resources/views/livewire/period-selector.edge

@@ -0,0 +1,11 @@
+<div class="flex items-center gap-2">
+  <select
+    wire:model.live="period"
+    class="block w-full rounded-md border-0 bg-white dark:bg-gray-800 py-1.5 pl-3 pr-10 text-gray-900 dark:text-gray-100 ring-1 ring-inset ring-gray-300 dark:ring-gray-700 focus:ring-2 focus:ring-indigo-600 sm:text-sm sm:leading-6"
+  >
+    <option value="1_hour">Last hour</option>
+    <option value="6_hours">Last 6 hours</option>
+    <option value="24_hours">Last 24 hours</option>
+    <option value="7_days">Last 7 days</option>
+  </select>
+</div>

package/build/resources/views/livewire/servers.edge

@@ -0,0 +1,86 @@
+<x-pulse::card :cols="cols ?? 'full'" :rows="rows ?? 1">
+  <x-pulse::scroll>
+    @if(servers && servers.length > 0)
+      <div class="grid grid-cols-[max-content,minmax(max-content,1fr),max-content,minmax(min-content,2fr),max-content,minmax(min-content,2fr),minmax(max-content,1fr)] gap-x-1">
+        <div></div>
+        <div></div>
+        <div class="text-xs uppercase text-left text-gray-500 dark:text-gray-400 font-bold py-2">CPU</div>
+        <div></div>
+        <div class="text-xs uppercase text-left text-gray-500 dark:text-gray-400 font-bold py-2">Memory</div>
+        <div></div>
+        <div class="text-xs uppercase text-left text-gray-500 dark:text-gray-400 font-bold py-2">Storage</div>
+        @each(server in servers)
+          <div class="flex items-center {{ servers.length > 1 ? 'py-2' : '' }}" title="{{ server.recently_reported ? 'Online' : 'Offline' }}">
+            @if(server.recently_reported)
+              <div class="w-5 flex justify-center mr-1">
+                <div class="h-1 w-1 bg-green-500 rounded-full animate-pulse"></div>
+              </div>
+            @else
+              <svg xmlns="http://
+www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" class="w-5 h-5 stroke-red-500 mr-1">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M3 3l8.735 8.735m0 0a.374.374 0 11.53.53m-.53-.53l.53.53m0 0L21 21M14.652 9.348a3.75 3.75 0 010 5.304m2.121-7.425a6.75 6.75 0 010 9.546m2.121-11.667c3.808 3.807 3.808 9.98 0 13.788m-9.546-4.242a3.733 3.733 0 01-1.06-2.122m-1.061 4.243a6.75 6.75 0 01-1.625-6.929m-.496 9.05c-3.068-3.067-3.664-7.67-1.79-11.334M12 12h.008v.008H12V12z" />
+              </svg>
+            @end
+          </div>
+          <div class="flex items-center pr-8 xl:pr-12 {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" class="w-6 h-6 mr-2 stroke-gray-500 dark:stroke-gray-400">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 17.25v-.228a4.5 4.5 0 0 0-.12-1.03l-2.268-9.64a3.375 3.375 0 0 0-3.285-2.602H7.923a3.375 3.375 0 0 0-3.285 2.602l-2.268 9.64a4.5 4.5 0 0 0-.12 1.03v.228m19.5 0a3 3 0 0 1-3 3H5.25a3 3 0 0 1-3-3m19.5 0a3 3 0 0 0-3-3H5.25a3 3 0 0 0-3 3m16.5 0h.008v.008h-.008v-.008Zm-3 0h.008v.008h-.008v-.008Z" />
+            </svg>
+            <span class="text-base font-bold text-gray-600 dark:text-gray-300">{{ server.name }}</span>
+          </div>
+          <div class="flex items-center {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            <div class="text-xl font-bold text-gray-700 dark:text-gray-200 w-14 whitespace-nowrap tabular-nums">
+              {{ server.cpu }}%
+            </div>
+          </div>
+          <div class="flex items-center pr-8 xl:pr-12 {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            <div class="w-full min-w-[5rem] max-w-xs h-9 relative">
+              <div class="w-full h-full ring-1 ring-gray-900/5 bg-gray-100 dark:bg-gray-800 rounded-md shadow-sm overflow-hidden">
+                <div class="h-full bg-purple-500 transition-all duration-300" style="width: {{ server.cpu }}%"></div>
+              </div>
+            </div>
+          </div>
+          <div class="flex items-center {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            <div class="w-36 flex-shrink-0 whitespace-nowrap tabular-nums">
+              <span class="text-xl font-bold text-gray-700 dark:text-gray-200">
+                {{ formatBytes(server.memory_used) }}
+              </span>
+              <span class="text-sm font-medium text-gray-500 dark:text-gray-400">
+                / {{ formatBytes(server.memory_total) }}
+              </span>
+            </div>
+          </div>
+          <div class="flex items-center pr-8 xl:pr-12 {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            @let(memoryPercent = server.memory_total > 0 ? Math.round((server.memory_used / server.memory_total) * 100) : 0)
+            <div class="w-full min-w-[5rem] max-w-xs h-9 relative">
+              <div class="w-full h-full ring-1 ring-gray-900/5 bg-gray-100 dark:bg-gray-800 rounded-md shadow-sm overflow-hidden">
+                <div class="h-full bg-purple-500 transition-all duration-300" style="width: {{ memoryPercent }}%"></div>
+              </div>
+            </div>
+          </div>
+          <div class="flex items-center gap-8 {{ servers.length > 1 ? 'py-2' : '' }} {{ !server.recently_reported ? 'opacity-25 animate-pulse' : '' }}">
+            @if(server.storage && server.storage.length > 0)
+              @each(disk in server.storage)
+                <div class="flex items-center gap-4" title="Directory: {{ disk.directory }}">
+                  <div class="whitespace-nowrap tabular-nums">
+                    <span class="text-xl font-bold text-gray-700 dark:text-gray-200">{{ formatBytes(disk.used) }}</span>
+                    <span class="text-sm font-medium text-gray-500 dark:text-gray-400">/ {{ formatBytes(disk.total) }}</span>
+                  </div>
+                  @let(diskPercent = disk.total > 0 ? Math.round((disk.used / disk.total) * 100) : 0)
+                  <div class="relative h-8 w-8">
+                    <svg class="h-8 w-8 -rotate-90" viewBox="0 0 36 36">
+                      <circle cx="18" cy="18" r="14" fill="none" stroke-width="4" class="stroke-purple-500/20"></circle>
+                      <circle cx="18" cy="18" r="14" fill="none" stroke-width="4" stroke-dasharray="{{ diskPercent * 0.88 }}, 100" stroke-linecap="round" class="stroke-purple-500"></circle>
+                    </svg>
+                  </div>
+                </div>
+              @end
+            @end
+          </div>
+        @end
+      </div>
+    @else
+      <x-pulse::no-results message="No servers reporting" />
+    @end
+  </x-pulse::scroll>
+</x-pulse::card>

package/build/resources/views/livewire/slow-queries.edge

@@ -0,0 +1,50 @@
+<x-pulse::card :cols="cols ?? 8" :rows="rows ?? 1">
+  <x-pulse::card-header title="Slow Queries" :details="'past ' + period">
+    <x-slot name="icon">
+      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5">
+        <path stroke-linecap="round" stroke-linejoin="round" d="M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75m16.5 0c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125" />
+      </svg>
+    </x-slot>
+  </x-pulse::card-header>
+
+  <x-pulse::scroll>
+    @if(queries && queries.length > 0)
+      <x-pulse::table>
+        <colgroup>
+          <col width="100%" />
+          <col width="0%" />
+          <col width="0%" />
+        </colgroup>
+        <x-pulse::thead>
+          <tr>
+            <x-pulse::th>Query</x-pulse::th>
+            <x-pulse::th class="text-right">Count</x-pulse::th>
+            <x-pulse::th class="text-right">Slowest</x-pulse::th>
+          </tr>
+        </x-pulse::thead>
+        <tbody>
+          @each(query in queries)
+            <tr class="h-2 first:h-0"></tr>
+            <tr>
+              <x-pulse::td class="max-w-[1px]">
+                <code class="block truncate text-xs text-gray-900 dark:text-gray-100" title="{{ query.sql }}">
+                  {{ query.sql }}
+                </code>
+              </x-pulse::td>
+              <x-pulse::td class="text-right tabular-nums text-gray-700 dark:text-gray-300 font-bold whitespace-nowrap">
+                {{ formatNumber(query.count) }}
+              </x-pulse::td>
+              <x-pulse::td class="text-right tabular-nums whitespace-nowrap">
+                <span class="{{ query.slowest >= 1000 ? 'text-red-600 dark:text-red-400' : query.slowest >= 500 ? 'text-yellow-600 dark:text-yellow-400' : 'text-gray-700 dark:text-gray-300' }} font-bold">
+                  {{ formatDuration(query.slowest) }}
+                </span>
+              </x-pulse::td>
+            </tr>
+          @end
+        </tbody>
+      </x-pulse::table>
+    @else
+      <x-pulse::no-results message="No slow queries" />
+    @end
+  </x-pulse::scroll>
+</x-pulse::card>

package/build/resources/views/livewire/slow-requests.edge

@@ -0,0 +1,62 @@
+<x-pulse::card :cols="cols ?? 6" :rows="rows ?? 1">
+  <x-pulse::card-header title="Slow Requests" :details="'past ' + period">
+    <x-slot name="icon">
+      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5">
+        <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
+      </svg>
+    </x-slot>
+  </x-pulse::card-header>
+
+  <x-pulse::scroll>
+    @if(requests && requests.length > 0)
+      <x-pulse::table>
+        <colgroup>
+          <col width="0%" />
+          <col width="100%" />
+          <col width="0%" />
+          <col width="0%" />
+        </colgroup>
+        <x-pulse::thead>
+          <tr>
+            <x-pulse::th>Method</x-pulse::th>
+            <x-pulse::th>Route</x-pulse::th>
+            <x-pulse::th class="text-right">Count</x-pulse::th>
+            <x-pulse::th class="text-right">Slowest</x-pulse::th>
+          </tr>
+        </x-pulse::thead>
+        <tbody>
+          @each(request in requests)
+            <tr class="h-2 first:h-0"></tr>
+            <tr>
+              <x-pulse::td class="whitespace-nowrap">
+                <span class="inline-flex items-center rounded px-1.5 py-0.5 text-xs font-medium {{ request.method === 'GET' ? 'bg-blue-100 text-blue-700 dark:bg-blue-900/50 dark:text-blue-300' : request.method === 'POST' ? 'bg-green-100 text-green-700 dark:bg-green-900/50 dark:text-green-300' : request.method === 'PUT' || request.method === 'PATCH' ? 'bg-yellow-100 text-yellow-700 dark:bg-yellow-900/50 dark:text-yellow-300' : request.method === 'DELETE' ? 'bg-red-100 text-red-700 dark:bg-red-900/50 dark:text-red-300' : 'bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300' }}">
+                  {{ request.method }}
+                </span>
+              </x-pulse::td>
+              <x-pulse::td class="max-w-[1px]">
+                <div class="truncate text-gray-900 dark:text-gray-100" title="{{ request.uri }}">
+                  {{ request.uri }}
+                </div>
+                @if(request.action)
+                  <div class="mt-0.5 truncate text-xs text-gray-500 dark:text-gray-400" title="{{ request.action }}">
+                    {{ request.action }}
+                  </div>
+                @end
+              </x-pulse::td>
+              <x-pulse::td class="text-right tabular-nums text-gray-700 dark:text-gray-300 font-bold whitespace-nowrap">
+                {{ formatNumber(request.count) }}
+              </x-pulse::td>
+              <x-pulse::td class="text-right tabular-nums whitespace-nowrap">
+                <span class="{{ request.slowest >= 1000 ? 'text-red-600 dark:text-red-400' : request.slowest >= 500 ? 'text-yellow-600 dark:text-yellow-400' : 'text-gray-700 dark:text-gray-300' }} font-bold">
+                  {{ formatDuration(request.slowest) }}
+                </span>
+              </x-pulse::td>
+            </tr>
+          @end
+        </tbody>
+      </x-pulse::table>
+    @else
+      <x-pulse::no-results message="No slow requests" />
+    @end
+  </x-pulse::scroll>
+</x-pulse::card>

package/build/resources/views/livewire/usage.edge

@@ -0,0 +1,63 @@
+<x-pulse::card :cols="cols ?? 4" :rows="rows ?? 2">
+  <x-pulse::card-header title="Application Usage">
+    <x-slot name="actions">
+      <select
+        wire:model.live="type"
+        class="block rounded border-0 bg-transparent py-0.5 pl-2 pr-7 text-xs text-gray-500 dark:text-gray-400 ring-1 ring-inset ring-gray-300 dark:ring-gray-700 focus:ring-2 focus:ring-indigo-600"
+      >
+        <option value="requests">Requests</option>
+        <option value="slow_requests">Slow Requests</option>
+        <option value="jobs">Jobs</option>
+      </select>
+    </x-slot>
+  </x-pulse::card-header>
+
+  <x-pulse::scroll>
+    @if(users && users.length > 0)
+      <div class="divide-y divide-gray-200 dark:divide-gray-700">
+        @each(user in users)
+          <div class="flex items-center gap-3 px-4 py-3 hover:bg-gray-50 dark:hover:bg-gray-700/50">
+            <div class="flex-shrink-0">
+              @if(user.avatar)
+                <img
+                  src="{{ user.avatar }}"
+                  alt="{{ user.name }}"
+                  class="h-8 w-8 rounded-full object-cover"
+                />
+              @else
+                <div class="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200 dark:bg-gray-700 text-sm font-medium text-gray-600 dark:text-gray-300">
+                  {{ user.name ? user.name.charAt(0).toUpperCase() : '?' }}
+                </div>
+              @end
+            </div>
+            <div class="min-w-0 flex-1">
+              <div class="truncate text-sm font-medium text-gray-900 dark:text-gray-100">
+                {{ user.name || 'Unknown' }}
+              </div>
+              @if(user.email)
+                <div class="truncate text-xs text-gray-500 dark:text-gray-400">
+                  {{ user.email }}
+                </div>
+              @end
+            </div>
+            <div class="flex-shrink-0 text-right">
+              <div class="text-sm font-medium tabular-nums text-gray-900 dark:text-gray-100">
+                {{ formatNumber(user.count) }}
+              </div>
+              @if(user.percentage)
+                <div class="mt-0.5 h-1 w-16 overflow-hidden rounded-full bg-gray-200 dark:bg-gray-700">
+                  <div
+                    class="h-full rounded-full bg-indigo-500"
+                    style="width: {{ user.percentage }}%"
+                  ></div>
+                </div>
+              @end
+            </div>
+          </div>
+        @end
+      </div>
+    @else
+      <x-pulse::no-results message="No usage data" />
+    @end
+  </x-pulse::scroll>
+</x-pulse::card>

package/build/services/pulse.d.ts

@@ -0,0 +1,3 @@
+import type { Pulse } from '../src/pulse.js';
+declare let pulse: Pulse;
+export { pulse as default };

package/build/services/pulse.js

@@ -0,0 +1,6 @@
+import app from '@adonisjs/core/services/app';
+let pulse;
+await app.booted(async () => {
+    pulse = await app.container.make('pulse');
+});
+export { pulse as default };

package/build/src/entry.d.ts

@@ -0,0 +1,24 @@
+import type { AggregationType, EntryAttributes } from './types.js';
+export declare class Entry {
+    timestamp: number;
+    type: string;
+    key: string;
+    value: number | null;
+    protected aggregations: AggregationType[];
+    protected onlyBucketsFlag: boolean;
+    constructor(timestamp: number, type: string, key: string, value?: number | null);
+    count(): this;
+    min(): this;
+    max(): this;
+    sum(): this;
+    avg(): this;
+    onlyBuckets(): this;
+    getAggregations(): AggregationType[];
+    isCount(): boolean;
+    isMin(): boolean;
+    isMax(): boolean;
+    isSum(): boolean;
+    isAvg(): boolean;
+    isOnlyBuckets(): boolean;
+    attributes(): EntryAttributes;
+}

package/build/src/entry.js

@@ -0,0 +1,67 @@
+export class Entry {
+    timestamp;
+    type;
+    key;
+    value;
+    aggregations = [];
+    onlyBucketsFlag = false;
+    constructor(timestamp, type, key, value = null) {
+        this.timestamp = timestamp;
+        this.type = type;
+        this.key = key;
+        this.value = value;
+    }
+    count() {
+        this.aggregations.push('count');
+        return this;
+    }
+    min() {
+        this.aggregations.push('min');
+        return this;
+    }
+    max() {
+        this.aggregations.push('max');
+        return this;
+    }
+    sum() {
+        this.aggregations.push('sum');
+        return this;
+    }
+    avg() {
+        this.aggregations.push('avg');
+        return this;
+    }
+    onlyBuckets() {
+        this.onlyBucketsFlag = true;
+        return this;
+    }
+    getAggregations() {
+        return this.aggregations;
+    }
+    isCount() {
+        return this.aggregations.includes('count');
+    }
+    isMin() {
+        return this.aggregations.includes('min');
+    }
+    isMax() {
+        return this.aggregations.includes('max');
+    }
+    isSum() {
+        return this.aggregations.includes('sum');
+    }
+    isAvg() {
+        return this.aggregations.includes('avg');
+    }
+    isOnlyBuckets() {
+        return this.onlyBucketsFlag;
+    }
+    attributes() {
+        return {
+            timestamp: this.timestamp,
+            type: this.type,
+            key: this.key,
+            value: this.value,
+        };
+    }
+}

package/build/src/livewire/cache.d.ts

@@ -0,0 +1,4 @@
+import { Card } from './card.js';
+export declare class Cache extends Card {
+    render(): Promise<string>;
+}

package/build/src/livewire/cache.js

@@ -0,0 +1,33 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { lazy } from 'adonisjs-livewire';
+import { Card } from './card.js';
+let Cache = class Cache extends Card {
+    async render() {
+        const totals = await this.aggregateTotal(['cache_hit', 'cache_miss'], 'count');
+        const allCacheInteractions = {
+            hits: totals['cache_hit'] ?? 0,
+            misses: totals['cache_miss'] ?? 0,
+        };
+        const cacheKeyInteractions = await this.aggregateTypes(['cache_hit', 'cache_miss'], 'count', 'cache_hit', 'desc', 101);
+        const keys = cacheKeyInteractions.map((row) => ({
+            key: row.key,
+            hits: row['cache_hit'] ?? 0,
+            misses: row['cache_miss'] ?? 0,
+        }));
+        return await this.view.render('pulse::livewire/cache', {
+            period: this.periodForHumans(),
+            config: { sampleRate: 1, groups: {} },
+            allCacheInteractions,
+            cacheKeyInteractions: keys,
+        });
+    }
+};
+Cache = __decorate([
+    lazy()
+], Cache);
+export { Cache };

package/build/src/livewire/card.d.ts

@@ -0,0 +1,22 @@
+import { Component } from 'adonisjs-livewire';
+import type { AggregationType, AggregateResult, AggregateTypesResult, StoredValue } from '../types.js';
+export declare abstract class Card extends Component {
+    cols: number | 'full' | null;
+    rows: number | 'full' | null;
+    expand: boolean;
+    class: string;
+    period: string;
+    placeholder(): string;
+    placeholderData(): Record<string, any>;
+    protected periodAsInterval(): number;
+    protected periodForHumans(): string;
+    protected values(type: string, keys?: string[]): Promise<StoredValue[]>;
+    protected graph(types: string[], aggregate: AggregationType): Promise<Map<number, Map<string, number>>>;
+    protected aggregate(type: string, aggregates: AggregationType | AggregationType[], orderBy?: AggregationType, direction?: 'asc' | 'desc', limit?: number): Promise<Map<string, AggregateResult>>;
+    protected aggregateTypes(types: string[], aggregate: AggregationType, orderBy?: string, direction?: 'asc' | 'desc', limit?: number): Promise<AggregateTypesResult[]>;
+    protected aggregateTotal(types: string[], aggregate: AggregationType): Promise<Record<string, number>>;
+    protected formatBytes(bytes: number): string;
+    protected formatNumber(num: number): string;
+    protected formatDuration(ms: number): string;
+    protected timeAgo(timestamp: number): string;
+}

package/build/src/livewire/card.js

@@ -0,0 +1,96 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component, url } from 'adonisjs-livewire';
+import pulse from 'adonisjs-pulse/services/pulse';
+export class Card extends Component {
+    cols = null;
+    rows = null;
+    expand = false;
+    class = '';
+    period = '1_hour';
+    placeholder() {
+        return '<div>Loading...</div>';
+    }
+    placeholderData() {
+        return {
+            cols: this.cols,
+            rows: this.rows,
+            class: this.class,
+        };
+    }
+    periodAsInterval() {
+        switch (this.period) {
+            case '1_hour':
+                return 3600;
+            case '6_hours':
+                return 21600;
+            case '24_hours':
+                return 86400;
+            case '7_days':
+                return 604800;
+            default:
+                return 3600;
+        }
+    }
+    periodForHumans() {
+        switch (this.period) {
+            case '1_hour':
+                return '1 hour';
+            case '6_hours':
+                return '6 hours';
+            case '24_hours':
+                return '24 hours';
+            case '7_days':
+                return '7 days';
+            default:
+                return '1 hour';
+        }
+    }
+    async values(type, keys) {
+        return pulse.getValues(type, keys);
+    }
+    async graph(types, aggregate) {
+        return pulse.graph(types, aggregate, this.periodAsInterval());
+    }
+    async aggregate(type, aggregates, orderBy, direction = 'desc', limit = 101) {
+        const aggregateArray = Array.isArray(aggregates) ? aggregates : [aggregates];
+        return pulse.aggregate(type, aggregateArray, this.periodAsInterval(), orderBy, direction, limit);
+    }
+    async aggregateTypes(types, aggregate, orderBy, direction = 'desc', limit = 101) {
+        return pulse.aggregateTypes(types, aggregate, this.periodAsInterval(), orderBy, direction, limit);
+    }
+    async aggregateTotal(types, aggregate) {
+        return pulse.aggregateTotal(types, aggregate, this.periodAsInterval());
+    }
+    formatBytes(bytes) {
+        if (bytes === 0)
+            return '0 B';
+        const k = 1024;
+        const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
+        const i = Math.floor(Math.log(bytes) / Math.log(k));
+        return `${Number.parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+    }
+    formatNumber(num) {
+        return num.toLocaleString();
+    }
+    formatDuration(ms) {
+        return ms >= 1000 ? `${(ms / 1000).toFixed(2)}s` : `${ms}ms`;
+    }
+    timeAgo(timestamp) {
+        const seconds = Math.floor((Date.now() - timestamp) / 1000);
+        if (seconds < 60)
+            return `${seconds}s ago`;
+        if (seconds < 3600)
+            return `${Math.floor(seconds / 60)}m ago`;
+        if (seconds < 86400)
+            return `${Math.floor(seconds / 3600)}h ago`;
+        return `${Math.floor(seconds / 86400)}d ago`;
+    }
+}
+__decorate([
+    url()
+], Card.prototype, "period", void 0);

package/build/src/livewire/exceptions.d.ts

@@ -0,0 +1,4 @@
+import { Card } from './card.js';
+export declare class Exceptions extends Card {
+    render(): Promise<string>;
+}

package/build/src/livewire/exceptions.js

@@ -0,0 +1,29 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { lazy } from 'adonisjs-livewire';
+import { Card } from './card.js';
+let Exceptions = class Exceptions extends Card {
+    async render() {
+        const aggregateData = await this.aggregate('exception', ['count'], 'count');
+        const exceptions = Array.from(aggregateData.entries()).map(([key, row]) => {
+            const [className, location] = JSON.parse(key);
+            return {
+                class: className,
+                location,
+                count: row.count ?? 0,
+            };
+        });
+        return await this.view.render('pulse::livewire/exceptions', {
+            period: this.periodForHumans(),
+            exceptions,
+        });
+    }
+};
+Exceptions = __decorate([
+    lazy()
+], Exceptions);
+export { Exceptions };

package/build/src/livewire/period_selector.d.ts

@@ -0,0 +1,5 @@
+import { Component } from 'adonisjs-livewire';
+export declare class PeriodSelector extends Component {
+    period: string;
+    render(): Promise<string>;
+}

package/build/src/livewire/period_selector.js

@@ -0,0 +1,16 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component, url } from 'adonisjs-livewire';
+export class PeriodSelector extends Component {
+    period = '1_hour';
+    async render() {
+        return await this.view.render('pulse::livewire/period-selector');
+    }
+}
+__decorate([
+    url()
+], PeriodSelector.prototype, "period", void 0);

package/build/src/livewire/servers.d.ts

@@ -0,0 +1,4 @@
+import { Card } from './card.js';
+export declare class Servers extends Card {
+    render(): Promise<string>;
+}

package/build/src/livewire/servers.js

@@ -0,0 +1,36 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { lazy } from 'adonisjs-livewire';
+import { Card } from './card.js';
+let Servers = class Servers extends Card {
+    async render() {
+        const values = await this.values('system');
+        const servers = values
+            .map((s) => {
+            try {
+                const data = JSON.parse(s.value);
+                return {
+                    ...data,
+                    recently_reported: Date.now() / 1000 - s.timestamp < 60,
+                    updated_at: s.timestamp * 1000,
+                };
+            }
+            catch {
+                return null;
+            }
+        })
+            .filter(Boolean);
+        return await this.view.render('pulse::livewire/servers', {
+            period: this.periodForHumans(),
+            servers,
+        });
+    }
+};
+Servers = __decorate([
+    lazy()
+], Servers);
+export { Servers };

package/build/src/livewire/slow_queries.d.ts

@@ -0,0 +1,5 @@
+import { Card } from './card.js';
+export declare class SlowQueries extends Card {
+    orderBy: string;
+    render(): Promise<string>;
+}