feat: Session drilldown feature to Performance & Errors charts

backend/apps/cloud/src/analytics/analytics.controller.ts

@@ -2109,6 +2109,13 @@ export class AnalyticsController {
     @Headers() headers: { 'x-password'?: string },
   ) {
     const { pid, period, from, to, filters, timezone = DEFAULT_TIMEZONE } = data
+    const sessionEvent = data.sessionEvent || 'traffic'
+    const sessionDataType =
+      sessionEvent === 'performance'
+        ? DataType.PERFORMANCE
+        : sessionEvent === 'error'
+          ? DataType.ERRORS
+          : DataType.ANALYTICS
 
     await this.analyticsService.checkProjectAccess(
       pid,
@@ -2133,15 +2140,21 @@ export class AnalyticsController {
     )
 
     const [filtersQuery, filtersParams, appliedFilters, customEVFilterApplied] =
-      this.analyticsService.getFiltersQuery(filters, DataType.ANALYTICS)
+      this.analyticsService.getFiltersQuery(
+        filters,
+        sessionDataType,
+        sessionEvent !== 'traffic',
+      )
 
     let timeBucket
     let diff
 
     if (period === 'all') {
       const res = await this.analyticsService.calculateTimeBucketForAllTime(
         pid,
-        ['pageview', 'custom_event', 'error'],
+        sessionEvent === 'traffic'
+          ? (['pageview', 'custom_event', 'error'] as const)
+          : sessionEvent,
       )
 
       timeBucket = res.timeBucket[0]
@@ -2176,6 +2189,7 @@ export class AnalyticsController {
       take,
       skip,
       customEVFilterApplied,
+      sessionEvent,
     )
 
     return { sessions, appliedFilters, take, skip }
@@ -2438,7 +2452,16 @@ export class AnalyticsController {
     @CurrentUserId() uid: string,
     @Headers() headers: { 'x-password'?: string },
   ) {
-    const { pid, eid, period, from, to, timeBucket } = data
+    const {
+      pid,
+      eid,
+      period,
+      from,
+      to,
+      timeBucket,
+      filters,
+      timezone = DEFAULT_TIMEZONE,
+    } = data
 
     await this.analyticsService.checkProjectAccess(
       pid,
@@ -2462,6 +2485,12 @@ export class AnalyticsController {
       'GET /analytics/error-sessions',
     )
 
+    const [filtersQuery, filtersParams] = this.analyticsService.getFiltersQuery(
+      filters,
+      DataType.ERRORS,
+      true,
+    )
+
     let newTimeBucket = timeBucket
     let diff
 
@@ -2475,7 +2504,7 @@ export class AnalyticsController {
       diff = res.diff
     }
 
-    const safeTimezone = this.analyticsService.getSafeTimezone(DEFAULT_TIMEZONE)
+    const safeTimezone = this.analyticsService.getSafeTimezone(timezone)
     const { groupFromUTC, groupToUTC } = this.analyticsService.getGroupFromTo(
       from,
       to,
@@ -2492,6 +2521,8 @@ export class AnalyticsController {
       groupToUTC,
       take,
       skip,
+      filtersQuery,
+      filtersParams,
     )
   }
 

backend/apps/cloud/src/analytics/analytics.service.ts

@@ -355,6 +355,12 @@ type EventsAllTimeType =
   | 'performance'
   | 'error'
   | 'captcha'
+type SessionsListEventType =
+  | 'traffic'
+  | 'pageview'
+  | 'custom_event'
+  | 'error'
+  | 'performance'
 
 const isValidOrigin = (origins: string[], origin: string) => {
   const escapeRegex = (str: string) =>
@@ -5141,10 +5147,14 @@ export class AnalyticsService {
     take = 30,
     skip = 0,
     customEVFilterApplied = false,
+    sessionEvent: SessionsListEventType = 'traffic',
+    primaryEventFilterQuery = '',
   ): Promise<object | void> {
     const primaryEventsSubquery = this.buildSessionsListPrimaryEventsSubquery(
       filtersQuery,
       customEVFilterApplied,
+      sessionEvent,
+      primaryEventFilterQuery,
     )
 
     const query = `
@@ -5278,8 +5288,10 @@ export class AnalyticsService {
   private buildSessionsListPrimaryEventsSubquery(
     filtersQuery: string,
     customEVFilterApplied: boolean,
+    sessionEvent: SessionsListEventType = 'traffic',
+    primaryEventFilterQuery = '',
   ): string {
-    if (customEVFilterApplied) {
+    if (customEVFilterApplied || sessionEvent === 'custom_event') {
       return `
         SELECT
           CAST(psid, 'String') AS psidCasted,
@@ -5296,6 +5308,7 @@ export class AnalyticsService {
           AND psid != 0
           AND created BETWEEN {groupFrom:String} AND {groupTo:String}
           ${filtersQuery}
+          ${primaryEventFilterQuery}
         UNION ALL
         SELECT
           CAST(s.psid, 'String') AS psidCasted,
@@ -5316,13 +5329,35 @@ export class AnalyticsService {
             AND profileId != ''
             AND created BETWEEN {groupFrom:String} AND {groupTo:String}
             ${filtersQuery}
+            ${primaryEventFilterQuery}
         ) AS matching_custom_events
           ON s.pid = matching_custom_events.pid
           AND s.profileId = matching_custom_events.profileId
         WHERE matching_custom_events.created BETWEEN s.firstSeen AND addSeconds(s.lastSeen, 1)
       `
     }
 
+    if (sessionEvent !== 'traffic') {
+      return `
+        SELECT
+          CAST(psid, 'String') AS psidCasted,
+          pid,
+          cc,
+          os,
+          br,
+          toTimeZone(created, {timezone:String}) AS created_for_grouping
+        FROM events
+        WHERE
+          pid = {pid:FixedString(12)}
+          AND type = '${sessionEvent}'
+          AND psid IS NOT NULL
+          AND psid != 0
+          AND created BETWEEN {groupFrom:String} AND {groupTo:String}
+          ${filtersQuery}
+          ${primaryEventFilterQuery}
+      `
+    }
+
     return `
         SELECT
           CAST(psid, 'String') AS psidCasted,
@@ -6376,6 +6411,8 @@ export class AnalyticsService {
     groupTo: string,
     take: number = 10,
     skip: number = 0,
+    filtersQuery = '',
+    filtersParams: Record<string, unknown> = {},
   ): Promise<{ sessions: any[]; total: number }> {
     const queryCount = `
       SELECT count(DISTINCT psid) as total
@@ -6384,6 +6421,7 @@ export class AnalyticsService {
         AND type = 'error'
         AND eid = {eid:FixedString(32)}
         AND created BETWEEN {groupFrom:String} AND {groupTo:String}
+        ${filtersQuery}
     `
 
     const querySessions = `
@@ -6409,6 +6447,7 @@ export class AnalyticsService {
           AND type = 'error'
           AND eid = {eid:FixedString(32)}
           AND created BETWEEN {groupFrom:String} AND {groupTo:String}
+          ${filtersQuery}
         GROUP BY pid, psid
       ) AS errors
       LEFT JOIN (
@@ -6439,7 +6478,15 @@ export class AnalyticsService {
       OFFSET {skip:UInt32}
     `
 
-    const params = { pid, eid, groupFrom, groupTo, take, skip }
+    const params = {
+      ...filtersParams,
+      pid,
+      eid,
+      groupFrom,
+      groupTo,
+      take,
+      skip,
+    }
 
     const [countResult, sessionsResult] = await Promise.all([
       clickhouse

backend/apps/cloud/src/analytics/dto/get-error.dto.ts

@@ -8,6 +8,7 @@ export class GetErrorDto extends PickType(GetDataDto, [
   'timeBucket',
   'from',
   'to',
+  'filters',
   'timezone',
 ] as const) {
   @ApiProperty()

backend/apps/cloud/src/analytics/dto/get-sessions.dto.ts

@@ -1,6 +1,6 @@
 import { PickType } from '@nestjs/swagger'
 import { Type } from 'class-transformer'
-import { IsInt, Min, Max } from 'class-validator'
+import { IsIn, IsInt, IsOptional, Min, Max } from 'class-validator'
 import { GetDataDto } from './getData.dto'
 
 export class GetSessionsDto extends PickType(GetDataDto, [
@@ -21,4 +21,8 @@ export class GetSessionsDto extends PickType(GetDataDto, [
   @IsInt()
   @Min(0)
   skip: number
+
+  @IsOptional()
+  @IsIn(['traffic', 'performance', 'error'])
+  sessionEvent?: 'traffic' | 'performance' | 'error'
 }

backend/apps/cloud/src/goal/goal.controller.ts

@@ -532,6 +532,74 @@ export class GoalController {
     }
   }
 
+  @ApiBearerAuth()
+  @Get('/:id/sessions')
+  @Auth(true, true)
+  async getGoalSessions(
+    @CurrentUserId() userId: string,
+    @Param('id') id: string,
+    @Query('period') period = '7d',
+    @Query('from') from?: string,
+    @Query('to') to?: string,
+    @Query('timezone') timezone?: string,
+    @Query('take') take?: string,
+    @Query('skip') skip?: string,
+  ) {
+    this.logger.log({ userId, id, period, from, to }, 'GET /goal/:id/sessions')
+
+    const goal = await this.goalService.findOneWithRelations(id)
+
+    if (_isEmpty(goal)) {
+      throw new NotFoundException('Goal not found')
+    }
+
+    const project = await this.projectService.getFullProject(goal.project.id)
+    this.projectService.allowedToView(project, userId)
+
+    const safeTimezone = this.analyticsService.getSafeTimezone(timezone)
+    const timeBucket = getLowestPossibleTimeBucket(period, from, to)
+
+    const { groupFromUTC, groupToUTC } = this.analyticsService.getGroupFromTo(
+      from,
+      to,
+      timeBucket,
+      period,
+      safeTimezone,
+    )
+
+    const goalType =
+      goal.type === GoalType.CUSTOM_EVENT ? 'custom_event' : 'pageview'
+    const { condition: matchCondition, params: matchParams } =
+      this.buildGoalMatchCondition(goal)
+    const { condition: metaCondition, params: metaParams } =
+      this.buildMetadataCondition(goal)
+    const { take: safeTake, skip: safeSkip } = clampPagination(
+      Number(take) || 30,
+      Number(skip) || 0,
+    )
+    const projectId = goal.project.id
+    const sessions = await this.analyticsService.getSessionsList(
+      '',
+      {
+        params: {
+          pid: projectId,
+          groupFrom: groupFromUTC,
+          groupTo: groupToUTC,
+          ...matchParams,
+          ...metaParams,
+        },
+      },
+      safeTimezone,
+      Math.min(safeTake, 150),
+      safeSkip,
+      false,
+      goalType,
+      `AND ${matchCondition} ${metaCondition}`,
+    )
+
+    return { sessions, take: Math.min(safeTake, 150), skip: safeSkip }
+  }
+
   private getGroupSubquery(
     timeBucket: string,
   ): [selector: string, groupBy: string] {

backend/apps/cloud/src/tools/tools.controller.ts

@@ -12,7 +12,6 @@ import net from 'net'
 import { ToolsService } from './tools.service'
 import { IpLookupQueryDto, IpLookupResponseDto } from './dto/ip-lookup.dto'
 import { getIPFromHeaders, checkRateLimit } from '../common/utils'
-import { trackCustom } from '../common/analytics'
 import { Public } from '../auth/decorators'
 
 const IP_LOOKUP_RL_REQUESTS = 30
@@ -45,10 +44,6 @@ export class ToolsController {
     @Ip() reqIP: string,
   ): Promise<IpLookupResponseDto> {
     const clientIp = getIPFromHeaders(headers) || reqIP || ''
-    const userAgent =
-      typeof headers === 'object' && headers !== null
-        ? (headers as Record<string, string>)['user-agent'] || ''
-        : ''
 
     await checkRateLimit(
       clientIp,
@@ -71,13 +66,6 @@ export class ToolsController {
 
     const result = this.toolsService.lookupIP(ip)
 
-    trackCustom(clientIp, userAgent, {
-      ev: 'IP_LOOKUP',
-      meta: {
-        ipVersion: String(result.ipVersion),
-      },
-    })
-
     return result
   }
 }