[WEB-4405] chore: workspace settings events (#7312)

* 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>
This commit is contained in:
Akshita Goyal 2025-07-10 16:54:06 +05:30 committed by GitHub
parent 4d0a7e4658
commit c6fbbfd8cc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 188 additions and 16 deletions

View file

@ -1,9 +1,16 @@
import { useState } from "react";
import { intersection } from "lodash";
import { Controller, useForm } from "react-hook-form";
import { EUserPermissions, EUserPermissionsLevel, EXPORTERS_LIST } from "@plane/constants";
import {
EUserPermissions,
EUserPermissionsLevel,
EXPORTERS_LIST,
WORKSPACE_SETTINGS_TRACKER_EVENTS,
WORKSPACE_SETTINGS_TRACKER_ELEMENTS,
} from "@plane/constants";
import { useTranslation } from "@plane/i18n";
import { Button, CustomSearchSelect, CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
import { useProject, useUser, useUserPermissions } from "@/hooks/store";
import { ProjectExportService } from "@/services/project/project-export.service";
@ -73,6 +80,12 @@ export const ExportForm = (props: Props) => {
.then(() => {
mutateServices();
setExportLoading(false);
captureSuccess({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.csv_exported,
payload: {
provider: formData.provider.provider,
},
});
setToast({
type: TOAST_TYPE.SUCCESS,
title: t("workspace_settings.settings.exports.modal.toasts.success.title"),
@ -88,8 +101,15 @@ export const ExportForm = (props: Props) => {
}),
});
})
.catch(() => {
.catch((error) => {
setExportLoading(false);
captureError({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.csv_exported,
payload: {
provider: formData.provider.provider,
},
error: error as Error,
});
setToast({
type: TOAST_TYPE.ERROR,
title: t("error"),
@ -163,7 +183,12 @@ export const ExportForm = (props: Props) => {
</div>
</div>
<div className="flex items-center justify-between ">
<Button variant="primary" type="submit" loading={exportLoading}>
<Button
variant="primary"
type="submit"
loading={exportLoading}
data-ph-element={WORKSPACE_SETTINGS_TRACKER_ELEMENTS.EXPORT_BUTTON}
>
{exportLoading ? `${t("workspace_settings.settings.exports.exporting")}...` : t("export")}
</Button>
</div>

View file

@ -3,6 +3,7 @@
import React, { useState } from "react";
import { useParams } from "next/navigation";
// types
import { WORKSPACE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
import { useTranslation } from "@plane/i18n";
import { IWebhook, IWorkspace, TWebhookEventTypes } from "@plane/types";
// ui
@ -10,6 +11,7 @@ import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@p
// helpers
import { csvDownload } from "@plane/utils";
// hooks
import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
import useKeypress from "@/hooks/use-keypress";
// components
import { WebhookForm } from "./form";
@ -67,6 +69,12 @@ export const CreateWebhookModal: React.FC<ICreateWebhookModal> = (props) => {
await createWebhook(workspaceSlug.toString(), payload)
.then(({ webHook, secretKey }) => {
captureSuccess({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_created,
payload: {
webhook: formData?.url,
},
});
setToast({
type: TOAST_TYPE.SUCCESS,
title: t("workspace_settings.settings.webhooks.toasts.created.title"),
@ -79,6 +87,13 @@ export const CreateWebhookModal: React.FC<ICreateWebhookModal> = (props) => {
csvDownload(csvData, `webhook-secret-key-${Date.now()}`);
})
.catch((error) => {
captureError({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_created,
payload: {
webhook: formData?.url,
},
error: error as Error,
});
setToast({
type: TOAST_TYPE.ERROR,
title: t("workspace_settings.settings.webhooks.toasts.not_created.title"),

View file

@ -3,8 +3,10 @@
import React, { FC, useState } from "react";
import { useParams } from "next/navigation";
// ui
import { WORKSPACE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
// hooks
import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
import { useWebhook } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
@ -35,6 +37,12 @@ export const DeleteWebhookModal: FC<IDeleteWebhook> = (props) => {
removeWebhook(workspaceSlug.toString(), webhookId.toString())
.then(() => {
captureSuccess({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_deleted,
payload: {
webhook: webhookId,
},
});
setToast({
type: TOAST_TYPE.SUCCESS,
title: "Success!",
@ -42,13 +50,20 @@ export const DeleteWebhookModal: FC<IDeleteWebhook> = (props) => {
});
router.replace(`/${workspaceSlug}/settings/webhooks/`);
})
.catch((error) =>
.catch((error) => {
captureError({
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_deleted,
payload: {
webhook: webhookId,
},
error: error as Error,
});
setToast({
type: TOAST_TYPE.ERROR,
title: "Error!",
message: error?.error ?? "Something went wrong. Please try again.",
})
)
});
})
.finally(() => setIsDeleting(false));
};

View file

@ -2,6 +2,7 @@
import { ChevronDown, ChevronUp } from "lucide-react";
import { Disclosure, Transition } from "@headlessui/react";
import { WORKSPACE_SETTINGS_TRACKER_ELEMENTS } from "@plane/constants";
import { Button } from "@plane/ui";
type Props = {
@ -36,7 +37,11 @@ export const WebhookDeleteSection: React.FC<Props> = (props) => {
webhook.
</span>
<div>
<Button variant="danger" onClick={openDeleteModal}>
<Button
variant="danger"
onClick={openDeleteModal}
data-ph-element={WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_DELETE_BUTTON}
>
Delete webhook
</Button>
</div>

View file

@ -3,6 +3,7 @@
import React, { FC, useEffect, useState } from "react";
import { observer } from "mobx-react";
import { Controller, useForm } from "react-hook-form";
import { WORKSPACE_SETTINGS_TRACKER_ELEMENTS } from "@plane/constants";
import { useTranslation } from "@plane/i18n";
import { IWebhook, TWebhookEventTypes } from "@plane/types";
// hooks
@ -93,7 +94,11 @@ export const WebhookForm: FC<Props> = observer((props) => {
{data ? (
<div className="pt-0 space-y-5">
<WebhookSecretKey data={data} />
<Button type="submit" loading={isSubmitting}>
<Button
type="submit"
loading={isSubmitting}
data-ph-element={WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_UPDATE_BUTTON}
>
{isSubmitting ? t("updating") : t("update")}
</Button>
</div>

View file

@ -1,10 +1,13 @@
"use client";
import { Control, Controller } from "react-hook-form";
// constants
import { WORKSPACE_SETTINGS_TRACKER_ELEMENTS } from "@plane/constants";
import { IWebhook } from "@plane/types";
// ui
import { ToggleSwitch } from "@plane/ui";
// types
// hooks
import { captureClick } from "@/helpers/event-tracker.helper";
interface IWebHookToggle {
control: Control<IWebhook, any>;
@ -20,6 +23,9 @@ export const WebhookToggle = ({ control }: IWebHookToggle) => (
<ToggleSwitch
value={value}
onChange={(val: boolean) => {
captureClick({
elementName: WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_DETAILS_PAGE_TOGGLE_SWITCH,
});
onChange(val);
}}
size="sm"

View file

@ -3,9 +3,11 @@
import { FC } from "react";
import Link from "next/link";
import { useParams } from "next/navigation";
import { WORKSPACE_SETTINGS_TRACKER_ELEMENTS, WORKSPACE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
import { IWebhook } from "@plane/types";
// hooks
import { ToggleSwitch } from "@plane/ui";
import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
import { useWebhook } from "@/hooks/store";
// ui
// types
@ -23,8 +25,35 @@ export const WebhooksListItem: FC<IWebhookListItem> = (props) => {
const handleToggle = () => {
if (!workspaceSlug || !webhook.id) return;
updateWebhook(workspaceSlug.toString(), webhook.id, { is_active: !webhook.is_active });
updateWebhook(workspaceSlug.toString(), webhook.id, { is_active: !webhook.is_active })
.then(() => {
captureElementAndEvent({
element: {
elementName: WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_LIST_ITEM_TOGGLE_SWITCH,
},
event: {
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_toggled,
state: "SUCCESS",
payload: {
webhook: webhook.url,
},
},
});
})
.catch(() => {
captureElementAndEvent({
element: {
elementName: WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_LIST_ITEM_TOGGLE_SWITCH,
},
event: {
eventName: WORKSPACE_SETTINGS_TRACKER_EVENTS.webhook_toggled,
state: "ERROR",
payload: {
webhook: webhook.url,
},
},
});
});
};
return (