Files
Jordi EnricandClaude Sonnet 4.6 34925ac0fb feat(dev-tools): extend toolbar for preview envs and add resource warnings tab
- Enable DevToolbar in Vercel preview deployments by checking
  NEXT_PUBLIC_VERCEL_ENV === 'preview' alongside NODE_ENV === 'development'
  in all guards and the index.ts tree-shaking condition
- Rename "Dev Telemetry" → "Dev Toolbar"; badge shows "Preview" or "Local"
- Add ExtraTab extension point to DevToolbar so consumers can inject tabs
- Add ResourceWarningsTab in studio: same off/warn/crit toggles for all
  resource warning types, wired into the existing DevToolbar via _app.tsx
- Remove standalone SupabaseDevToolbar (superseded by the tab above)
- localStorage persistence already handled by the existing STORAGE_KEY
  logic in DevToolbarContext — enabled state survives refreshes

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-13 11:50:54 +02:00

43 lines
1.6 KiB
TypeScript

import type { ReactNode } from 'react'
import * as DevToolbarModule from './DevToolbar'
import * as DevToolbarContextModule from './DevToolbarContext'
import * as DevToolbarTriggerModule from './DevToolbarTrigger'
import type { DevTelemetryToolbarContextType } from './types'
// Tree-shaking pattern: conditionally export stubs in production
// The bundler replaces process.env.NODE_ENV at build time, making the
// ternary static. Combined with sideEffects: false, the implementation
// modules are eliminated from the production bundle.
const noopContext: DevTelemetryToolbarContextType = {
isEnabled: false,
isOpen: false,
setIsOpen: () => {},
events: [],
setEvents: () => {},
dismissToolbar: () => {},
}
export const DevToolbarProvider =
process.env.NODE_ENV !== 'development' && process.env.NEXT_PUBLIC_VERCEL_ENV !== 'preview'
? ({ children }: { children: ReactNode; apiUrl?: string }) => children
: DevToolbarContextModule.DevToolbarProvider
export const useDevToolbar =
process.env.NODE_ENV !== 'development' && process.env.NEXT_PUBLIC_VERCEL_ENV !== 'preview'
? () => noopContext
: DevToolbarContextModule.useDevToolbar
export const DevToolbar =
process.env.NODE_ENV !== 'development' && process.env.NEXT_PUBLIC_VERCEL_ENV !== 'preview'
? () => null
: DevToolbarModule.DevToolbar
export const DevToolbarTrigger =
process.env.NODE_ENV !== 'development' && process.env.NEXT_PUBLIC_VERCEL_ENV !== 'preview'
? () => null
: DevToolbarTriggerModule.DevToolbarTrigger
export type { DevTelemetryEvent, DevToolbarConfig, ExtraTab } from './types'