Design Document: Profile Services Logs Page

[lakshayman]

Profile Services Logs Page

Objective

Create a web page that allows super users to view logs related to profile services. The page will include checkboxes for filtering log types and pagination controls. Additionally, create an API that provides summary statistics about developers' interactions with profile services.

Requirements

Frontend Page

• Display Logs: Show logs based on selected log types.
• Filter Logs: Checkboxes to filter logs by type:
  • Profile Diffs Skipped
  • Profile Service Blocked
  • Profile Service Blocked While Verification
• Pagination: Controls for navigating through pages of logs (Next and Previous buttons).
• Summary Statistics: Display total number of developers and their interactions with profile services:
  • Total number of developers
  • Number of developers who created profile services
  • Number of developers who have verified profile services
  • Number of developers who have blocked profile services
  • Number of developers with pending profile services
  • Number of developers who have not created profile services

Backend API

• Logs Endpoint: /logs
  • Query Parameters:
  • dev: Boolean, set to true
  • size: Number of logs per page
  • page: Current page number
  • type: Comma-separated list of log types (e.g., PROFILE_SKIPPED,PROFILE_SERVICE_BLOCKED,VERIFICATION_BLOCKED)
• Statistics Endpoint: /profile-diffs/stats
  • Returns summary statistics about developers' interactions with profile services.

API Design

Logs Endpoint

• Endpoint: /logs
• Method: GET
• Query Parameters:
  • dev=true
  • size=<number>
  • type=<comma-separated-list>
• Response:

  {
  "message": "All Logs fetched successfully",
  "data": [
    {
      "meta": {
        "sessionId": "",
        "userId": "iHo6RDt79JEHT3QmhmjJ"
      },
      "body": {
        "reason": "Unauthenticated Access to Profile Data",
        "userId": "iHo6RDt79JEHT3QmhmjJ"
      },
      "type": "PROFILE_SERVICE_BLOCKED",
      "timestamp": {
        "_seconds": 1708531128,
        "_nanoseconds": 681134000
      }
    },
    {
      "meta": {
        "sessionId": "",
        "userId": "iHo6RDt79JEHT3QmhmjJ"
      },
      "body": {
        "reason": "Unauthenticated Access to Profile Data",
        "userId": "iHo6RDt79JEHT3QmhmjJ"
      },
      "type": "PROFILE_SKIPPED",
      "timestamp": {
        "_seconds": 1708531124,
        "_nanoseconds": 758397000
      }
    },
    ...
  ],
  "next": "/logs?dev=true&size=10&type=PROFILE_SKIPPED,PROFILE_SERVICE_BLOCKED,VERIFICATION_BLOCKED&next=KmfcNnSvsIYu6rtjaGhz",
  "prev": null
  }

Statistics Endpoint

• Endpoint: /profile-diffs/stats
• Method: GET
• Response:

  {
  "totalDevelopers": 100,
  "createdProfileService": 80,
  "verifiedProfileService": 70,
  "blockedProfileService": 10,
  "pendingProfileService": 0,
  "notCreatedProfileService": 20
  }

Frontend Components

1. Checkboxes for Log Types

• Description: Users can filter logs by selecting log types.
• Log Types:
  • Profile Diffs Skipped
  • Profile Service Blocked
  • Profile Service Blocked While Verification

2. Log List

• Description: Display a list of logs fetched from the API.

3. Pagination Controls

• Description: Enable navigation through pages of logs.
• Controls:
  • Next button
  • Previous button

4. Summary Statistics

• Description: Display statistics about developers' interactions with profile services.
• Statistics:
  • Total number of developers
  • Number of developers who created profile services
  • Number of developers who have verified profile services
  • Number of developers who have blocked profile services
  • Number of developers with pending profile services
  • Number of developers who have not created profile services

User Flow

1. Page Load:
   • Fetch initial logs with all log types selected by default.
   • Fetch and display summary statistics.
2. Filter Logs:
   • User selects/deselects checkboxes to filter logs by type.
   • Fetch and display filtered logs.
3. Pagination:
   • User navigates using Next and Previous buttons.
   • Fetch and display logs for the selected page.

Backend Integration

1. Logs Fetching:
   • Endpoint: /logs
   • Query Parameters: Based on selected log types and current page.
   • Display logs in the log list container.
2. Statistics Fetching:
   • Endpoint: /profile-diffs/stats
   • Display statistics in a dedicated section on the page.

Future Enhancements

• Add date range filters to narrow down logs by date.
• Include search functionality to find specific logs.
• Implement sorting options (e.g., by date, type).

Conclusion

This design document outlines the creation of a Profile Services Logs Page with log type filters, pagination controls, and an API to fetch logs and summary statistics. By following this design, you can implement a user-friendly interface for super users to manage and view profile service logs and statistics efficiently.

[lakshayman]

We can also add PROFILE_STORED type of logs.