[WEB-4405] chore: workspace settings events#7312
Conversation
…e/plane into fix-workspace-events
fix: workspace events
* chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * chore: update tracker elements * chore: check for closest element with data-ph-element attribute --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local>
…into refactor-event-trackers
* chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * refactor: module tracker event and element * chore: update tracker element * chore: revert unnecessary changes --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local>
…into refactor-event-trackers
…s and sidebar related events
refactor: global views, product tour, notifications, onboarding, users and sidebar related events
* chore: member-tracker-events * fix: constants
* chore: state events * fix: refactor
* chore: project-events * fix: refactor
* added events for most page events * refactor: simplify lock button event handling in PageLockControl --------- Co-authored-by: Palanikannan M <akashmalinimurugu@gmail.com> Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com>
Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
|
""" WalkthroughThis change introduces a comprehensive set of event and element tracking constants for workspace settings, and integrates event tracking calls into various user actions related to billing, CSV export, and webhook lifecycle (create, delete, update, toggle). UI elements such as buttons and toggles now include data attributes for tracking, and success/error telemetry is captured throughout relevant workflows. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant UI_Component
participant Tracker
participant API
User->>UI_Component: Clicks tracked button/toggle (e.g., Add Webhook, Export CSV)
UI_Component->>Tracker: captureClick/captureSuccess/captureError (with event/element details)
UI_Component->>API: Performs action (e.g., create, update, delete, export)
API-->>UI_Component: Returns success or error
alt Success
UI_Component->>Tracker: captureSuccess (event, payload)
else Error
UI_Component->>Tracker: captureError (event, payload, error)
end
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (4)
🚧 Files skipped from review as they are similar to previous changes (4)
⏰ Context from checks skipped due to timeout of 90000ms (1)
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
Pull Request Linked with Plane Work Items
Comment Automatically Generated by Plane |
…re-workspace-events
|
Prateek Shourya seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account. You have signed the CLA already but the status is still pending? Let us recheck it. |
gakshita
changed the title
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
packages/constants/src/event-tracker/core.ts(2 hunks)web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/webhooks/[webhookId]/page.tsx(3 hunks)web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/webhooks/page.tsx(4 hunks)web/ce/components/workspace/billing/comparison/plan-detail.tsx(4 hunks)web/core/components/exporter/export-form.tsx(4 hunks)web/core/components/web-hooks/create-webhook-modal.tsx(3 hunks)web/core/components/web-hooks/delete-webhook-modal.tsx(2 hunks)web/core/components/web-hooks/form/delete-section.tsx(2 hunks)web/core/components/web-hooks/form/form.tsx(2 hunks)web/core/components/web-hooks/form/toggle.tsx(2 hunks)web/core/components/web-hooks/webhooks-list-item.tsx(2 hunks)
🧰 Additional context used
🧠 Learnings (2)
web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/webhooks/page.tsx (1)
Learnt from: vamsikrishnamathala
PR: makeplane/plane#7061
File: web/core/components/workspace-notifications/root.tsx:18-18
Timestamp: 2025-05-14T13:16:23.323Z
Learning: In the Plane project codebase, the path alias `@/plane-web` resolves to the `ce` directory, making imports like `@/plane-web/hooks/use-notification-preview` correctly resolve to files in `web/ce/hooks/`.
web/core/components/web-hooks/webhooks-list-item.tsx (1)
Learnt from: vamsikrishnamathala
PR: makeplane/plane#7061
File: web/core/components/workspace-notifications/root.tsx:18-18
Timestamp: 2025-05-14T13:16:23.323Z
Learning: In the Plane project codebase, the path alias `@/plane-web` resolves to the `ce` directory, making imports like `@/plane-web/hooks/use-notification-preview` correctly resolve to files in `web/ce/hooks/`.
🧬 Code Graph Analysis (4)
web/core/components/web-hooks/form/form.tsx (1)
packages/constants/src/event-tracker/core.ts (1)
WORKSPACE_SETTINGS_TRACKER_ELEMENTS(286-300)
web/core/components/web-hooks/form/delete-section.tsx (1)
packages/constants/src/event-tracker/core.ts (1)
WORKSPACE_SETTINGS_TRACKER_ELEMENTS(286-300)
web/core/components/web-hooks/form/toggle.tsx (2)
web/helpers/event-tracker.helper.ts (1)
captureClick(52-54)packages/constants/src/event-tracker/core.ts (1)
WORKSPACE_SETTINGS_TRACKER_ELEMENTS(286-300)
web/core/components/exporter/export-form.tsx (2)
web/helpers/event-tracker.helper.ts (2)
captureSuccess(112-114)captureError(126-128)packages/constants/src/event-tracker/core.ts (2)
WORKSPACE_SETTINGS_TRACKER_EVENTS(274-285)WORKSPACE_SETTINGS_TRACKER_ELEMENTS(286-300)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Analyze (javascript)
🔇 Additional comments (20)
packages/constants/src/event-tracker/core.ts (2)
274-285: LGTM: Well-structured event tracking constants.The event tracking constants follow consistent naming conventions (snake_case) and cover all necessary webhook lifecycle events.
286-300: LGTM: Comprehensive element tracking constants.The element tracking constants provide good coverage for UI elements across billing, exports, and webhooks features. The function approach for the billing upgrade button is a good design choice to handle different subscription types.
web/core/components/web-hooks/form/delete-section.tsx (2)
5-5: LGTM: Proper import for tracking constants.The import is correctly added and will be used for the tracking attribute.
40-46: LGTM: Clean implementation of element tracking.The data attribute is properly added to the delete button using the appropriate constant, enabling tracking without affecting existing functionality.
web/core/components/web-hooks/form/form.tsx (2)
6-6: LGTM: Proper import for tracking constants.The import is correctly added for the workspace settings tracking elements.
97-103: LGTM: Consistent element tracking implementation.The data attribute is properly added to the update button using the appropriate constant, maintaining consistency with other webhook tracking implementations.
web/core/components/web-hooks/form/toggle.tsx (2)
5-10: LGTM: Proper imports for tracking functionality.The imports are correctly added for both the tracking constants and the captureClick helper function.
26-30: LGTM: Well-implemented toggle tracking.The click tracking is properly implemented by calling
captureClickbefore the originalonChangehandler, ensuring both tracking and functionality work correctly.web/core/components/web-hooks/create-webhook-modal.tsx (3)
6-14: LGTM: Proper imports for event tracking.The imports are correctly added for both the tracking event constants and the success/error capture helper functions.
72-77: LGTM: Comprehensive success tracking implementation.The success tracking is properly implemented with the appropriate event name and payload containing the webhook URL.
90-96: LGTM: Thorough error tracking implementation.The error tracking includes both the event name, webhook URL payload, and the error object, providing comprehensive debugging information.
web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/webhooks/page.tsx (1)
75-80: Event tracking implementation looks good!The click tracking is properly implemented for both "Add Webhook" buttons with distinct element identifiers. The existing functionality is preserved while adding comprehensive telemetry.
Also applies to: 98-103
web/core/components/web-hooks/delete-webhook-modal.tsx (1)
40-66: Comprehensive success and error tracking implemented correctly.The webhook deletion tracking captures both success and error scenarios with appropriate payload data including the webhook ID. The implementation maintains existing error handling while adding proper telemetry.
web/core/components/exporter/export-form.tsx (1)
185-190: Export button tracking attribute implemented correctly.The data-ph-element attribute is properly added using the centralized tracking constant.
web/ce/components/workspace/billing/comparison/plan-detail.tsx (2)
55-60: Billing upgrade tracking implemented correctly.The success tracking captures the subscription type and fires before the redirect, providing proper analytics for upgrade interactions.
113-121: Conditional tracking attribute for subscription button is well implemented.The data-ph-element attribute correctly differentiates between upgrade and "talk to sales" buttons based on subscription state.
web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/webhooks/[webhookId]/page.tsx (4)
7-7: LGTM - Clean import addition.The import for
WORKSPACE_SETTINGS_TRACKER_EVENTSfollows the existing import pattern and is correctly grouped with other constant imports.
17-17: LGTM - Proper helper function import.The import for event tracking helpers is correctly placed with other helper imports and follows the established import structure.
59-64: LGTM - Well-implemented success tracking.The event tracking implementation is excellent:
- Placed at the correct location in the promise chain
- Uses consistent payload structure with webhook ID
- Executed before user-facing toast notification
- Leverages the existing guard clause protection for
formData.id
72-78: LGTM - Comprehensive error tracking.The error tracking implementation is thorough and well-structured:
- Captures both the webhook ID and error object for debugging
- Maintains consistency with success tracking payload structure
- Properly types the error object
- Positioned correctly before error toast
…re-workspace-events
* feat: event tracker helper * feat: track click events for `data-ph-element` * fix: handled click events * fix: handled name * chore: tracker element updates * chore: remove export * chore: tracker element type * chore: track element and event helper. * chore: minor improvements * chore: minor refactors * fix: workspace events * fix: added slug * fix: changes nomenclature * fix: nomenclature * chore: update event tracker helper types * fix: data id * refactor: cycle events (#7290) * chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * chore: update tracker elements * chore: check for closest element with data-ph-element attribute --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> * Refactor module events (#7291) * chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * refactor: module tracker event and element * chore: update tracker element * chore: revert unnecessary changes --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> * refactor: global views, product tour, notifications, onboarding, users and sidebar related events * chore: member tracker events (#7302) * chore: member-tracker-events * fix: constants * refactor: update event tracker constants * refactor: auth related event trackers (#7306) * Chore: state events (#7307) * chore: state events * fix: refactor * chore: project events (#7305) * chore: project-events * fix: refactor * fix: removed hardcoded values * fix: github redirection event * chore: project page tracker events (#7304) * added events for most page events * refactor: simplify lock button event handling in PageLockControl --------- Co-authored-by: Palanikannan M <akashmalinimurugu@gmail.com> Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> * chore: minor cleanup and import fixes * refactor: added tracker elements for buttons (#7308) Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com> * fix: event type * refactor: posthog group event * chore: removed instances of event tracker (#7309) * refactor: remove event tracker stores and hooks * refactor: remove event tracker store * fix: build errors * clean up event tracker payloads * chore: workspace-settings-events * fix: refactor --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com> Co-authored-by: Palanikannan M <akashmalinimurugu@gmail.com> Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> Co-authored-by: Vamsi Krishna <46787868+vamsikrishnamathala@users.noreply.github.com>
6 participants
Description
Implemented posthog events for workspace settings
Summary by CodeRabbit
New Features
Bug Fixes