manage-dashboard-widgets

द्वारा posthog

PostHog इंजीनियरों को डैशबोर्ड विजेट प्लेटफ़ॉर्म कार्य में मार्गदर्शन करता है — एक नया widget_type (WIDGET_REGISTRY, कैटलॉग, run_widgets, WidgetCard) शिप करें या अपडेट करें…

npx skills add https://github.com/posthog/posthog-foss --skill manage-dashboard-widgets

Managing dashboard widgets

For PostHog engineers working on dashboard widget tiles in the repo.

Human overview: products/dashboards/CONTRIBUTING.md

In scope: widget tiles (widget_id on DashboardTile) — ship new types or change shipped types.

Out of scope: adding an existing type to a dashboard (MCP dashboard-widget-catalog-list → dashboard-widgets-batch-add); insight tiles, text cards, button tiles.

1. Route first

RequestPathStart here
New widget_type that does not existShip§2 Ship a new type — intake mandatory
Change a shipped type (config, query, UI, layout, RBAC, deprecate)Update§3 Update a shipped type — skip intake
Add existing type to a dashboard—MCP only — not this skill
Chart / trend / graph for product metrics on a dashboard—Insight tile — architecture.md § Charts

Shipped types (code truth): architecture.md § Shipped types.

2. Ship a new widget_type

Intake — ask before coding

Mandatory for new types only. Read widget-intake.md and:

  1. Discover product UI in the repo — concrete components/scenes before generic tile-body questions.
  2. Apply defaults and inference (groupId, copy spine, list UX) — never AskQuestion banned topics.
  3. Resolve ambiguity — one batched follow-up for gaps, max 6 questions (open fields).
  4. Post the spec table; get confirmation before checklist §1.

Execute

After spec confirmation → checklist-new-widget-type.md §1 → §8. §5b (dedicated stories — required before the PR, not a follow-up) is sequenced once MVP tests are green.

Self-updating / real-time tile? Read live-widgets.md first — the live contract (is_live, creation_flag, generatedAt seeds) and the widgets/live/ toolkit.

3. Update a shipped type

Skip intake. Identify the type from the request or EXPECTED_WIDGET_TYPES in widget_registry.py.

  1. Read managing-existing-widgets.md — "What kind of change?" routing table for primary files.
  2. Confirm: which type, what changes, backward-compatible config migration?
  3. Follow linked references from that table — do not re-read the new-type checklist.

Cannot change in place: widget_type string on existing rows; stored w/h when catalog defaults change.

New visualization kind = ship (§2). Chart-primary = insight tile (architecture.md § Charts).

4. Platform invariants

Both paths:

  1. RBAC registry-driven — no widget_type branches in dashboard.py. permissions-and-sharing.md § Product RBAC
  2. One widget_type everywhere — registries + both catalogs + FE registry; variants share groupId only.
  3. Per-type code in product paths — not platform shells. architecture.md § Platform files
  4. WidgetCard compound pattern — composition.md
  5. Config contract = Pydantic SSOT — widget_specs/configs.py + WidgetSpec in registry.py; hogli build:openapi for OpenAPI/FE Zod/MCP. Runtime PATCH stays JSONField. See config-and-codegen.md.
  6. No chart-primary widgets — architecture.md § Charts

New widget_type strings need no migration — register registries + catalogs only.

5. Companion skills

SkillWhen
improving-drf-endpointsdashboard @extend_schema (config serializers auto-derive from WIDGET_SPECS)
writing-kea-logicsedit*WidgetModalLogic.ts or dashboardLogic.tsx
django-migrationsDashboardWidget / DashboardTile schema only
adopting-generated-api-typesTile PATCH in frontend/utils.ts

6. Verify

MVP smoke (renders + core tests — not a ship point):

hogli test products/dashboards/backend/api/test/test_run_widgets.py
hogli test products/dashboards/backend/api/test/test_dashboard_widgets.py
hogli test products/dashboards/frontend/widgets/registry.test.tsx

Ship gate (required before the PR): checklist §8 + hogli build:openapi + dedicated Storybook stories per checklist §5b (component + edit modal — required, not just the catalog overview).

Config SSOT changes (also run after widget_specs/ edits):

hogli test products/dashboards/backend/api/test/test_widget_config_schema_parity.py
hogli test products/dashboards/frontend/widgets/widgetConfigSchemaParity.test.ts
hogli test products/dashboards/backend/api/test/test_widget_openapi_enums.py   # new widget_type only

Update: tests for layers touched — at minimum test_run_widgets.py if BE changed, products/dashboards/frontend/widgets/ if FE changed, hogli build:openapi if config OpenAPI changed. See managing-existing-widgets.md routing table Also check column.

Reference appendix

TopicDoc
Intake (new types only)widget-intake.md — canonical defaults + spec recap
New type checklistchecklist-new-widget-type.md
Update shipped typemanaging-existing-widgets.md
Architecturearchitecture.md — file map, invariants
Config + codegenconfig-and-codegen.md
WidgetCard / edit modalcomposition.md
List footer / tile filterslist-widget-patterns.md
Live / self-updating tileslive-widgets.md — contract + widgets/live/ toolkit
Tile min/maxlayout-and-ux.md
RBAC / sharingpermissions-and-sharing.md
Setup gatesavailability-and-gating.md
MCP after shipmcp.md
Skill doc maintenanceskill-maintenance.md

posthog की और Skills

error-tracking-hono
posthog
PostHog द्वारा Hono के लिए त्रुटि ट्रैकिंग
tuning-incremental-sync-config
posthog
एक सिंक का कॉन्फ़िगरेशन ExternalDataSchema पर रहता है और इसे external-data-schemas-partial-update के माध्यम से कभी भी बदला जा सकता है। अधिकांश परिवर्तन गैर-विनाशकारी होते हैं (अगले सिंक पर प्रभावी होते हैं), लेकिन कुछ (sync_type बदलना, प्राथमिक कुंजियाँ बदलना) को सिंक किए गए डेटा को दूषित होने से बचाने के लिए सावधानीपूर्वक संभालने की आवश्यकता होती है।
playwright-test
posthog
प्लेराइट परीक्षण लिखें, सुनिश्चित करें कि यह चले, और अस्थिर न हो।
error-tracking-ruby
posthog
PostHog द्वारा Ruby के लिए त्रुटि ट्रैकिंग
authoring-log-alerts
posthog
PostHog प्रोजेक्ट में सेवाओं पर उपयोगी, कम-शोर वाले लॉग अलर्ट लिखें। जब उपयोगकर्ता अपने लॉग के लिए अलर्ट सेट करने, जोड़ने के लिए सुझाव देने आदि के लिए कहे, तब उपयोग करें।
making-scenes-tab-aware
posthog
Guides converting PostHog frontend scenes to be tab aware for internal scene tabs. Use when adding or refactoring a `SceneExport` scene, fixing state leaking…
posthog-survey-creator
posthog
PostHog में सर्वेक्षण बनाएँ और कॉन्फ़िगर करें, मार्गदर्शित बातचीत के माध्यम से। इस कौशल का उपयोग तब करें जब कोई उपयोगकर्ता सर्वेक्षण बनाना चाहता है, उपयोगकर्ता प्रतिक्रिया एकत्र करना चाहता है, चलाना चाहता है…
authoring-scouts
posthog
PostHog Signals स्काउट्स को लिखने, संपादित करने और अनुकूलित करने का तरीका — ये निर्धारित एजेंट हैं जो किसी प्रोजेक्ट को स्कैन करते हैं और Signals इनबॉक्स में रिपोर्ट लिखते हैं। उपयोग तब करें जब कोई उपयोगकर्ता…