mirror of
https://github.com/supabase/supabase.git
synced 2026-05-06 17:00:27 -04:00
1545df1fe6
## Problem There was no way to trigger resource warning banners in the dev toolbar, making it hard to test different warning states (warn/critical, read-only mode) without manually mocking API responses or waiting for real exhaustion events. ## Fix - Adds an ExtraTab extension point to DevToolbar so Studio can inject custom tabs without coupling the package to app-specific hooks - Adds a ResourceWarningsTab in Studio with per-type off/warn/crit toggles for disk IO, CPU, memory, disk space, and auth rate limit warnings, plus a read-only mode toggle - Auth rate limit only exposes warn (no crit) since critical is not a valid API return value - The tab component is dynamically imported so it stays out of production bundles, controlled by the same NEXT_PUBLIC_ENVIRONMENT guard used by the toolbar ## How to test 1. Run Studio locally or open a Vercel preview deployment 2. Open the browser console and run window.devTelemetry() to enable the toolbar 3. Click the toolbar trigger to open the panel 4. Switch to the "Warnings" tab 5. Toggle any warning type to "Warn" or "Crit" and confirm the banner appears at the top of the page 6. Toggle read-only mode on and confirm the read-only banner appears 7. Click "Reset to real data" and confirm banners return to their actual state 8. Confirm the Auth Rate Limit row only has Off and Warn buttons (no Crit) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * New "Warnings" tab in the developer toolbar (enabled in local and staging) for managing resource warning banners. * Per-resource severity overrides (Off / Warning / Critical) with immediate preview in the toolbar. * Local "read-only" toggle to simulate read-only mode. * "Reset to real data" clears overrides, disables the local toggle, and refreshes server state. * Tab loads lazily and shows a disabled/loading state if org/project context is unavailable. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
42 lines
936 B
TypeScript
42 lines
936 B
TypeScript
import type { Dispatch, ReactNode, SetStateAction } from 'react'
|
|
|
|
export interface DevTelemetryEvent {
|
|
id: string
|
|
timestamp: number
|
|
source: 'client' | 'server'
|
|
eventType: string
|
|
eventName: string
|
|
distinctId?: string
|
|
properties?: Record<string, unknown>
|
|
}
|
|
|
|
export interface ServerTelemetryEvent {
|
|
id: string
|
|
timestamp: number
|
|
sessionId: string
|
|
eventType: 'capture' | 'identify' | 'groupIdentify' | 'alias'
|
|
eventName: string
|
|
distinctId: string
|
|
properties?: Record<string, unknown>
|
|
groups?: Record<string, string | number>
|
|
}
|
|
|
|
export interface DevToolbarConfig {
|
|
apiUrl: string
|
|
}
|
|
|
|
export interface ExtraTab {
|
|
id: string
|
|
label: string
|
|
content: ReactNode
|
|
}
|
|
|
|
export interface DevTelemetryToolbarContextType {
|
|
isEnabled: boolean
|
|
isOpen: boolean
|
|
setIsOpen: (open: boolean) => void
|
|
events: DevTelemetryEvent[]
|
|
setEvents: Dispatch<SetStateAction<DevTelemetryEvent[]>>
|
|
dismissToolbar: () => void
|
|
}
|