From fff1e59c8373017ab6fd114d47ebaf21bec46af7 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt Date: Tue, 6 Feb 2024 19:10:49 +0100 Subject: [PATCH 1/2] Add analytics for Insight Jira hint --- src/components/Insights/InsightList/index.tsx | 2 ++ src/components/Insights/tracking.ts | 3 ++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/Insights/InsightList/index.tsx b/src/components/Insights/InsightList/index.tsx index 37633d136..d8bed81c3 100644 --- a/src/components/Insights/InsightList/index.tsx +++ b/src/components/Insights/InsightList/index.tsx @@ -36,6 +36,7 @@ import { TopUsageInsight } from "../TopUsageInsight"; import { TrafficInsight } from "../TrafficInsight"; import { actions } from "../actions"; import { Description } from "../styles"; +import { trackingEvents } from "../tracking"; import { isChattyApiEndpointInsight, isCodeObjectErrorsInsight, @@ -683,6 +684,7 @@ export const InsightList = (props: InsightListProps) => { ) => { props.onJiraTicketCreate(insight, spanCodeObjectId); setIsInsightJiraTicketHintShown({ value: true }); + sendTrackingEvent(trackingEvents.JIRA_TICKET_HINT_CLOSED); }; return ( diff --git a/src/components/Insights/tracking.ts b/src/components/Insights/tracking.ts index 21667d5bb..819c1c92b 100644 --- a/src/components/Insights/tracking.ts +++ b/src/components/Insights/tracking.ts @@ -9,7 +9,8 @@ export const trackingEvents = addPrefix( JIRA_TICKET_FIELD_COPY_BUTTON_CLICKED: "jira ticket field copy button clicked", JIRA_TICKET_ATTACHMENT_DOWNLOAD_BUTTON_CLICKED: - "jira ticket attachment download button clicked" + "jira ticket attachment download button clicked", + JIRA_TICKET_HINT_CLOSED: "jira ticket hint closed" }, " " ); From 01fa67f5c530c31b266ff0a553f50fbc92d8c022 Mon Sep 17 00:00:00 2001 From: Kyrylo Shmidt Date: Tue, 6 Feb 2024 20:09:49 +0100 Subject: [PATCH 2/2] Add details about hint closure --- src/components/Insights/BottleneckInsight/index.tsx | 5 +++-- .../Insights/EndpointNPlusOneInsight/index.tsx | 7 +++++-- .../EndpointQueryOptimizationInsight/index.tsx | 7 +++++-- .../Insights/HighNumberOfQueriesInsight/index.tsx | 5 +++-- src/components/Insights/InsightList/index.tsx | 10 +++++++--- src/components/Insights/NPlusOneInsight/index.tsx | 5 +++-- .../Insights/QueryOptimizationInsight/index.tsx | 5 +++-- .../Insights/SpanBottleneckInsight/index.tsx | 7 +++++-- src/components/Insights/common/JiraButton/index.tsx | 12 +++++------- src/components/Insights/common/JiraButton/types.ts | 5 ++++- .../index.tsx | 5 ++--- src/components/Insights/types.ts | 3 ++- 12 files changed, 47 insertions(+), 29 deletions(-) diff --git a/src/components/Insights/BottleneckInsight/index.tsx b/src/components/Insights/BottleneckInsight/index.tsx index 521b3f523..2bfaffac4 100644 --- a/src/components/Insights/BottleneckInsight/index.tsx +++ b/src/components/Insights/BottleneckInsight/index.tsx @@ -16,11 +16,12 @@ export const BottleneckInsight = (props: BottleneckInsightProps) => { props.onAssetLinkClick(spanCodeObjectId, props.insight.type); }; - const handleCreateJiraTicketButtonClick = () => { + const handleCreateJiraTicketButtonClick = (event: string) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); - props.onJiraTicketCreate && props.onJiraTicketCreate(props.insight); + props.onJiraTicketCreate && + props.onJiraTicketCreate(props.insight, undefined, event); }; return ( diff --git a/src/components/Insights/EndpointNPlusOneInsight/index.tsx b/src/components/Insights/EndpointNPlusOneInsight/index.tsx index a17276c44..d754b6f4c 100644 --- a/src/components/Insights/EndpointNPlusOneInsight/index.tsx +++ b/src/components/Insights/EndpointNPlusOneInsight/index.tsx @@ -36,12 +36,15 @@ export const EndpointNPlusOneInsight = ( props.onAssetLinkClick(spanCodeObjectId, props.insight.type); }; - const handleTicketInfoButtonClick = (spanCodeObjectId: string) => { + const handleTicketInfoButtonClick = ( + spanCodeObjectId: string, + event: string + ) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); props.onJiraTicketCreate && - props.onJiraTicketCreate(props.insight, spanCodeObjectId); + props.onJiraTicketCreate(props.insight, spanCodeObjectId, event); }; const handleTraceButtonClick = ( diff --git a/src/components/Insights/EndpointQueryOptimizationInsight/index.tsx b/src/components/Insights/EndpointQueryOptimizationInsight/index.tsx index 823b2a2fa..2287f09d6 100644 --- a/src/components/Insights/EndpointQueryOptimizationInsight/index.tsx +++ b/src/components/Insights/EndpointQueryOptimizationInsight/index.tsx @@ -34,12 +34,15 @@ export const EndpointQueryOptimizationInsight = ( props.onAssetLinkClick(spanCodeObjectId, props.insight.type); }; - const handleTicketInfoButtonClick = (spanCodeObjectId: string) => { + const handleTicketInfoButtonClick = ( + spanCodeObjectId: string, + event: string + ) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); props.onJiraTicketCreate && - props.onJiraTicketCreate(props.insight, spanCodeObjectId); + props.onJiraTicketCreate(props.insight, spanCodeObjectId, event); }; const handleTraceButtonClick = ( diff --git a/src/components/Insights/HighNumberOfQueriesInsight/index.tsx b/src/components/Insights/HighNumberOfQueriesInsight/index.tsx index e9f4d6631..775ffa646 100644 --- a/src/components/Insights/HighNumberOfQueriesInsight/index.tsx +++ b/src/components/Insights/HighNumberOfQueriesInsight/index.tsx @@ -28,11 +28,12 @@ export const HighNumberOfQueriesInsight = ( props.onTraceButtonClick(trace, insightType, spanCodeObjectId); }; - const handleCreateJiraTicketButtonClick = () => { + const handleCreateJiraTicketButtonClick = (event: string) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: insight.type }); - props.onJiraTicketCreate && props.onJiraTicketCreate(insight); + props.onJiraTicketCreate && + props.onJiraTicketCreate(insight, undefined, event); }; return ( diff --git a/src/components/Insights/InsightList/index.tsx b/src/components/Insights/InsightList/index.tsx index d8bed81c3..e58230cb4 100644 --- a/src/components/Insights/InsightList/index.tsx +++ b/src/components/Insights/InsightList/index.tsx @@ -228,7 +228,8 @@ const renderInsightCard = ( insight: GenericCodeObjectInsight, onJiraTicketCreate: ( insight: GenericCodeObjectInsight, - spanCodeObjectId?: string + spanCodeObjectId: string | undefined, + event?: string ) => void, isJiraHintEnabled: boolean ): JSX.Element | undefined => { @@ -680,11 +681,14 @@ export const InsightList = (props: InsightListProps) => { const handleShowJiraTicket = ( insight: GenericCodeObjectInsight, - spanCodeObjectId?: string + spanCodeObjectId: string | undefined, + event?: string ) => { props.onJiraTicketCreate(insight, spanCodeObjectId); + if (!isInsightJiraTicketHintShown?.value) { + sendTrackingEvent(trackingEvents.JIRA_TICKET_HINT_CLOSED, { event }); + } setIsInsightJiraTicketHintShown({ value: true }); - sendTrackingEvent(trackingEvents.JIRA_TICKET_HINT_CLOSED); }; return ( diff --git a/src/components/Insights/NPlusOneInsight/index.tsx b/src/components/Insights/NPlusOneInsight/index.tsx index ae5b1ce28..25eb489df 100644 --- a/src/components/Insights/NPlusOneInsight/index.tsx +++ b/src/components/Insights/NPlusOneInsight/index.tsx @@ -32,11 +32,12 @@ export const NPlusOneInsight = (props: NPlusOneInsightProps) => { props.onTraceButtonClick(trace, insightType, spanCodeObjectId); }; - const handleCreateJiraTicketButtonClick = () => { + const handleCreateJiraTicketButtonClick = (event: string) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); - props.onJiraTicketCreate && props.onJiraTicketCreate(props.insight); + props.onJiraTicketCreate && + props.onJiraTicketCreate(props.insight, undefined, event); }; const spanName = props.insight.clientSpanName || undefined; diff --git a/src/components/Insights/QueryOptimizationInsight/index.tsx b/src/components/Insights/QueryOptimizationInsight/index.tsx index 4d91cf488..155b0d4da 100644 --- a/src/components/Insights/QueryOptimizationInsight/index.tsx +++ b/src/components/Insights/QueryOptimizationInsight/index.tsx @@ -32,7 +32,7 @@ export const QueryOptimizationInsight = ( props.onTraceButtonClick(trace, insightType, spanCodeObjectId); }; - const handleCreateJiraTicketButtonClick = () => { + const handleCreateJiraTicketButtonClick = (event: string) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); @@ -40,7 +40,8 @@ export const QueryOptimizationInsight = ( props.onJiraTicketCreate && props.onJiraTicketCreate( props.insight, - props.insight.spanInfo?.spanCodeObjectId + props.insight.spanInfo?.spanCodeObjectId, + event ); }; diff --git a/src/components/Insights/SpanBottleneckInsight/index.tsx b/src/components/Insights/SpanBottleneckInsight/index.tsx index 0719f7967..e883d9b19 100644 --- a/src/components/Insights/SpanBottleneckInsight/index.tsx +++ b/src/components/Insights/SpanBottleneckInsight/index.tsx @@ -15,12 +15,15 @@ export const SpanBottleneckInsight = (props: SpanBottleneckInsightProps) => { props.onAssetLinkClick(spanCodeObjectId, props.insight.type); }; - const handleTicketInfoButtonClick = (spanCodeObjectId: string) => { + const handleTicketInfoButtonClick = ( + spanCodeObjectId: string, + event: string + ) => { sendTrackingEvent(trackingEvents.JIRA_TICKET_INFO_BUTTON_CLICKED, { insightType: props.insight.type }); props.onJiraTicketCreate && - props.onJiraTicketCreate(props.insight, spanCodeObjectId); + props.onJiraTicketCreate(props.insight, spanCodeObjectId, event); }; return ( diff --git a/src/components/Insights/common/JiraButton/index.tsx b/src/components/Insights/common/JiraButton/index.tsx index c97bb6845..38dcb48c7 100644 --- a/src/components/Insights/common/JiraButton/index.tsx +++ b/src/components/Insights/common/JiraButton/index.tsx @@ -25,8 +25,8 @@ export const JiraButton = (props: JiraButtonProps) => { props.ticketLink && openURLInDefaultBrowser(props.ticketLink); }; - const openTicketInfo = () => { - props.onTicketInfoButtonClick(props.spanCodeObjectId); + const openTicketInfo = (event: string) => { + props.onTicketInfoButtonClick(props.spanCodeObjectId, event); }; const menuWidth = props.buttonType == "large" ? "119px" : "70px"; @@ -50,7 +50,7 @@ export const JiraButton = (props: JiraButtonProps) => { icon: { component: PencilIcon }, label: "Edit", value: props.spanCodeObjectId ?? "", - onClick: openTicketInfo + onClick: () => openTicketInfo("edit menu item click") } ]} onSelect={handleJiraButtonClick} @@ -77,9 +77,7 @@ export const JiraButton = (props: JiraButtonProps) => { @@ -109,7 +107,7 @@ export const JiraButton = (props: JiraButtonProps) => { openTicketInfo("try now button click")} /> } diff --git a/src/components/Insights/common/JiraButton/types.ts b/src/components/Insights/common/JiraButton/types.ts index 0131366ac..1c5cb953f 100644 --- a/src/components/Insights/common/JiraButton/types.ts +++ b/src/components/Insights/common/JiraButton/types.ts @@ -1,5 +1,8 @@ export interface JiraButtonProps { - onTicketInfoButtonClick(spanCodeObjectId?: string): void; + onTicketInfoButtonClick( + spanCodeObjectId: string | undefined, + event: string + ): void; ticketLink?: string | null; spanCodeObjectId?: string; buttonType: "small" | "large"; diff --git a/src/components/Insights/tickets/EndpointHighNumberOfQueriesInsightTicket/index.tsx b/src/components/Insights/tickets/EndpointHighNumberOfQueriesInsightTicket/index.tsx index 8311e750e..864175b08 100644 --- a/src/components/Insights/tickets/EndpointHighNumberOfQueriesInsightTicket/index.tsx +++ b/src/components/Insights/tickets/EndpointHighNumberOfQueriesInsightTicket/index.tsx @@ -27,11 +27,10 @@ export const EndpointHighNumberOfQueriesInsightTicket = ( {`The endpoint ${spanInsight.spanInfo.displayName} is triggering an abnormally high number of queries.`}, - +
Consider using joins/caching to reduce the overhead of the db roundtrip. - , - <>, +
, {`Number of queries (median): ${spanInsight.queriesCount}`}, diff --git a/src/components/Insights/types.ts b/src/components/Insights/types.ts index 420e2ef40..81fe2b624 100644 --- a/src/components/Insights/types.ts +++ b/src/components/Insights/types.ts @@ -84,7 +84,8 @@ export interface InsightProps { onRefresh: (insightType: InsightType) => void; onJiraTicketCreate?: ( insight: GenericCodeObjectInsight, - spanCodeObjectId?: string + spanCodeObjectId: string | undefined, + event?: string ) => void; isJiraHintEnabled?: boolean; }