mirror of
https://github.com/supabase/supabase.git
synced 2026-06-20 23:06:06 +08:00
6bbe2c3297
## Problem We need a local-only UI to inspect client and server telemetry events and override flags during development without touching non-local env behavior. This work is intended to be shared across Studio, Docs, and WWW. ## Changes - Introduced a shared `dev-tools` package with the Dev Telemetry Toolbar UI, trigger, and provider. - Wired the toolbar into Studio, Docs, and WWW app shells (local-only gating). - Added a local-only `devTelemetry()` opt-in with storage gating and SSE subscription. - Wired client PostHog events into a local listener and re-exported types. - Added local flag override cookie support in the UI and CODEOWNERS for the new package. - Added unit tests covering local/non-local behavior and flag utilities. ## Testing Manual (local only): - Start each app locally: `pnpm dev:studio`, `pnpm dev:docs`, `pnpm dev:www` - Open the app, run `devTelemetry()` in the browser console - Click around and confirm both client and server events appear (client will be page views only) - Verify feature flag overrides (PostHog + ConfigCat) persist and restore correctly - Confirm dismissing the toolbar clears local storage and hides the trigger Unblocked by https://github.com/supabase/platform/pull/29172 Resolves GROWTH-591 Demo: [github.com/user-attachments/assets/60b376db-7440-4ada-82f5-d1bd4af4db3b](https://github.com/user-attachments/assets/60b376db-7440-4ada-82f5-d1bd4af4db3b) Screenshots: <img width="1368" height="972" alt="1" src="https://github.com/user-attachments/assets/d2f20a0c-191f-4118-bb5e-15b25f5a54a9" /> <img width="1423" height="790" alt="2" src="https://github.com/user-attachments/assets/115598e2-7287-49bf-9ed7-71ecc679dee3" /> <img width="1433" height="882" alt="3" src="https://github.com/user-attachments/assets/51f666f2-9efc-410f-baec-378bdee9dbfe" /> <img width="608" height="483" alt="4" src="https://github.com/user-attachments/assets/584d6cf5-1b2f-4cee-9e6a-d55ce2e3bae5" /> <img width="628" height="305" alt="5" src="https://github.com/user-attachments/assets/991a9b39-578a-4565-b110-537a02040a53" /> <img width="659" height="447" alt="6" src="https://github.com/user-attachments/assets/95ef405c-fffa-44af-bf6a-f974b780e3fc" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Developer Toolbar (local only): view client/server telemetry, inspect events, and manage/override feature flags with persistent overrides, filtering, and clear/reload. * Client-side telemetry hooks: surface structured events to dev tooling for realtime inspection. * **Bug Fixes** * Fixed end-of-file newline in shared code. * **Chores** * Added dev-tools package, integrated provider and trigger across Studio, Docs, and marketing sites, and added CODEOWNERS entry. * **Tests** * Added comprehensive tests and test setup for the DevToolbar. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
40 lines
917 B
JSON
40 lines
917 B
JSON
{
|
|
"name": "dev-tools",
|
|
"version": "0.0.0",
|
|
"private": true,
|
|
"sideEffects": false,
|
|
"type": "module",
|
|
"main": "./index.ts",
|
|
"types": "./index.ts",
|
|
"exports": {
|
|
".": "./index.ts"
|
|
},
|
|
"scripts": {
|
|
"preinstall": "npx only-allow pnpm",
|
|
"clean": "rimraf node_modules",
|
|
"test": "vitest run",
|
|
"test:watch": "vitest",
|
|
"typecheck": "tsc --noEmit"
|
|
},
|
|
"dependencies": {
|
|
"common": "workspace:*",
|
|
"lucide-react": "*",
|
|
"ui": "workspace:*"
|
|
},
|
|
"devDependencies": {
|
|
"@testing-library/jest-dom": "^6.6.0",
|
|
"@testing-library/react": "^16.0.0",
|
|
"@testing-library/user-event": "^14.0.0",
|
|
"@types/react": "catalog:",
|
|
"@types/react-dom": "catalog:",
|
|
"next-router-mock": "^0.9.13",
|
|
"tsconfig": "workspace:*",
|
|
"typescript": "catalog:",
|
|
"vitest": "catalog:"
|
|
},
|
|
"peerDependencies": {
|
|
"react": "catalog:",
|
|
"react-dom": "catalog:"
|
|
}
|
|
}
|