Privy Logins Analytics
Relevant source files
The following files were used as context for generating this wiki page:
Introduction
Privy Logins Analytics is a specialized module within the Recoup Admin dashboard designed to monitor and visualize user authentication activity. It tracks sign-ins facilitated via the Privy authentication provider, allowing administrators to view user engagement metrics such as new registrations and active user counts over specified time periods.
The system aggregates raw user data from the Privy Management API and presents it through a combination of statistical summaries, chronological charts (Last Seen Activity), and detailed tabular views. This enables the admin team to observe authentication trends and manage user records directly from the internal dashboard.
Sources: app/privy/page.tsx:1-12, components/PrivyLogins/PrivyLoginsPage.tsx:21-34
System Architecture and Data Flow
The analytics system follows a standard React-based data fetching pattern using TanStack Query for state management and Privy for secure API authentication.
Authentication and Authorization
Access to the analytics data is restricted to authenticated administrators. The application uses the @privy-io/react-auth hook to retrieve a Bearer token, which is then passed in the Authorization header of requests to the backend API.
Sources: hooks/usePrivyLogins.ts:14-22, lib/recoup/fetchPrivyLogins.ts:21-25
Data Retrieval Flow
The sequence diagram below illustrates how the frontend components interact with the backend to fetch login data:
The diagram shows the lifecycle of a data request from the UI component through the custom hook to the final API call.
Sources: hooks/usePrivyLogins.ts:16-24, lib/recoup/fetchPrivyLogins.ts:15-32
Data Models
The system interacts with user objects structured according to the Privy Management API (snake_case format) and custom response envelopes.
User and Response Structures
| Field | Type | Description |
|---|---|---|
id | string | Unique identifier for the Privy user. |
created_at | number | Unix timestamp of account creation. |
total_new | number | Count of new users in the selected period. |
total_active | number | Count of active users in the selected period. |
logins | PrivyUser[] | Array of raw user objects. |
Sources: types/privy.ts:19-33
Linked Accounts
Users may have multiple authentication methods (emails, wallets, etc.) stored within the linked_accounts array.
export type PrivyLinkedAccount = Record<string, unknown> & {
type: string;
address?: string;
verified_at?: number;
};
Sources: types/privy.ts:1-7
Components and UI Logic
The analytics interface is composed of several modular components that handle specific parts of the data visualization.
Statistical Overview
The PrivyLoginsStats component displays high-level metrics extracted from the PrivyLoginsResponse.
- New Users: Displays the
total_newfield. - Active Users: Displays the
total_activefield.
Sources: components/PrivyLogins/PrivyLoginsStats.tsx:9-19
Logins Table
The PrivyLoginsTable utilizes @tanstack/react-table to provide a sortable and searchable interface for user records.
| Column | ID | Logic / Accessor |
|---|---|---|
email | Extracted via getEmail(row) utility. | |
| Created At | created_at | Formatted locale string from Unix timestamp. |
| Last Seen | last_seen | Extracted via getLastSeen(row) utility. |
The table defaults to descending sort by the created_at field.
Sources: components/PrivyLogins/PrivyLoginsTable.tsx:24-34, components/PrivyLogins/privyLoginsColumns.tsx:10-43
State Management and Interaction
The primary page component manages the time-period filter state, which is passed to the data-fetching hook to trigger re-renders when the user changes the view (e.g., from "daily" to "monthly").
The flow shows how the period state acts as the central driver for all UI updates on the page.
Sources: components/PrivyLogins/PrivyLoginsPage.tsx:18-22, hooks/usePrivyLogins.ts:16
API Integration
The frontend communicates with a specific administrative endpoint to gather analytics.
- Endpoint:
/api/admins/privy - Method:
GET - Query Parameters:
period: Can beall,daily,weekly, ormonthly.
- Authentication: Requires a Bearer token in the
Authorizationheader.
Sources: lib/recoup/fetchPrivyLogins.ts:18-24, types/privy.ts:25
Conclusion
Privy Logins Analytics provides a centralized interface for monitoring user growth and retention within the Recoup platform. By leveraging the Privy Management API and modern React patterns, it offers real-time visibility into authentication events, helping administrators track platform health through quantitative metrics and detailed user logs.