feat: Unique Sessions Count on Events Page

[Yashh56]

This pull request introduces a new UniqueSessions component to display the count of unique website sessions, integrates it into the website controls UI and fixes #3830. The main changes are the creation of the new component and its addition to the controls row.

Screenshots

---

[vercel]

@Yashh56 is attempting to deploy a commit to the umami-software Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Overview

Greptile Summary

This PR adds a new UniqueSessions component to display unique session counts on the Events page. However, the implementation has a critical bug: it uses useWebsiteEventsQuery which returns paginated data (default 20 events per page), so the component only counts unique sessions from the first 20 events instead of all events in the selected time range.

Major Issues:

• The unique session count is incorrect - only counts sessions from first page of events (20 items by default)
• Missing TypeScript types for component props
• No loading or error states (shows "0" during loading and errors)

Recommendation:
Use useWebsiteStatsQuery hook instead, which calls /websites/{websiteId}/stats endpoint and returns a visitors field containing the correct count of unique sessions (calculated via COUNT(DISTINCT session_id) in the database query).

Confidence Score: 1/5

• This PR has a critical logic bug that produces incorrect data and should not be merged
• The implementation contains a fundamental flaw where it only counts unique sessions from the first 20 paginated events instead of all events in the time range. This will produce incorrect metrics for users, which is particularly problematic for an analytics platform. The missing error/loading states and TypeScript types are additional concerns, but the data accuracy issue is critical.
• src/components/metrics/UniqueSessions.tsx requires complete refactoring to use the correct data source

Important Files Changed

File Analysis

Filename	Score	Overview
src/components/metrics/UniqueSessions.tsx	1/5	New component with critical bug: only counts unique sessions from first 20 events due to pagination, not all events. Missing TypeScript types, loading states, and error handling.
src/app/(main)/websites/[websiteId]/WebsiteControls.tsx	4/5	Added UniqueSessions component import and rendered it in the controls row with proper spacing. Integration looks clean but component itself has issues.

Sequence Diagram

sequenceDiagram
    participant User
    participant EventsPage
    participant WebsiteControls
    participant UniqueSessions
    participant useWebsiteEventsQuery
    participant API
    participant Database

    User->>EventsPage: Navigate to Events page
    EventsPage->>WebsiteControls: Render controls
    WebsiteControls->>UniqueSessions: Render with websiteId
    UniqueSessions->>useWebsiteEventsQuery: Query events (view: 'all')
    useWebsiteEventsQuery->>API: GET /websites/{websiteId}/events
    Note over API: Applies pagination (default 20 items)
    API->>Database: Query events with filters
    Database-->>API: Return paginated events (20 items)
    API-->>useWebsiteEventsQuery: PageResult with 20 events
    useWebsiteEventsQuery-->>UniqueSessions: Return query result
    UniqueSessions->>UniqueSessions: Calculate unique sessions from 20 events
    Note over UniqueSessions: BUG: Only counts sessions from first page
    UniqueSessions-->>WebsiteControls: Display count (incorrect)
    WebsiteControls-->>EventsPage: Render controls with metrics
    EventsPage-->>User: Show page with incorrect session count

Loading

[greptile-apps]

Additional Comments (6)

1. src/components/metrics/UniqueSessions.tsx, line 6 (link)

   logic: this query only fetches paginated events (default 20 per page), so uniqueSessionCount will only count sessions from the first 20 events, not all events in the selected time range. use useWebsiteStatsQuery instead which returns a visitors field with the correct unique session count.

2. src/components/metrics/UniqueSessions.tsx, line 5 (link)

   syntax: missing TypeScript type for props

3. src/components/metrics/UniqueSessions.tsx, line 11 (link)

   style: using any type defeats the purpose of TypeScript type safety

4. src/components/metrics/UniqueSessions.tsx, line 16-27 (link)

   logic: no loading or error states displayed to user. when data is loading or if query fails, the component shows "Unique Sessions: 0" which is misleading

5. src/components/metrics/UniqueSessions.tsx, line 19-20 (link)

   style: unnecessary whitespace inside Text component

6. src/components/metrics/UniqueSessions.tsx, line 22-25 (link)

   style: unnecessary whitespace inside Text component

_{2 files reviewed, 6 comments}

_{Edit Code Review Agent Settings | Greptile}

[Yashh56]

Hey @mikecao, Can you review this PR?