Project Details View

​

Accessing Project Details

/console/projects/123e4567-e89b-12d3-a456-426614174000

​

Tabbed Interface

​

Overview Tab

• Project name and description
• Created date and last updated timestamp
• Project status (Active/Inactive)
• Project UUID for reference

• API Keys: Total number of API keys generated for this project
• Members: Total end users registered through this project
• Generations: Total AI generations requested (if applicable)
• Status: Current project health indicator

​

API Keys Tab

• View API Keys: List all API keys with key prefix, name, and creation date
• Generate New Key: Create new API keys with optional names
• Copy Key: One-click copy to clipboard (full key shown only once at generation)
• Revoke Key: Delete API keys to prevent further use
• Last Used: Track when each key was last accessed

• Key Prefix: First 8 characters for identification (e.g., dk_abc123)
• Name: Optional descriptive name for the key
• Created At: Key generation timestamp
• Last Used: Last API access timestamp
• Actions: Copy and delete options

1. Click “Generate API Key” button
2. Enter optional key name in dialog
3. Click “Generate” to create key
4. Copy the full key from the success dialog
5. Store key securely (it won’t be shown again)

​

Members Tab

• Member List: All end users who registered through this project
• Search: Filter members by email address
• Status Filter: Filter by active/inactive status
• Role Filter: Filter by user role
• Pagination: Navigate through large member lists
• Member Details: View individual member information

• Email: User’s registered email
• Full Name: Display name (if provided)
• Role: User role (typically “end_user”)
• Status: Active or inactive indicator
• Joined: Registration date
• Actions: View details, manage access (coming soon)

Search input: "[email protected]"

• All Members
• Active Only
• Inactive Only

• All Roles
• End User
• Developer (if applicable)

• 20 members per page (default)
• Previous/Next navigation
• Page indicator showing current page and total

​

Settings Tab

• Project Name: Update project display name
• Description: Modify project description
• Status: Toggle project active/inactive status

• Deactivate Project: Temporarily disable project (can be reactivated)
• Delete Project: Permanently remove project and all associated data

​

Project Statistics

GET /api/v1/projects/{projectId}/api-keys
// Returns: Array of ApiKey objects
// Count: apiKeys.length

GET /api/v1/projects/{projectId}/users
// Returns: Array of User objects
// Count: users.length

• Active: Project is operational and accepting requests
• Inactive: Project is disabled (API keys won’t work)
• Error: Configuration or system issues detected

​

Data Loading

<Suspense fallback={<LoadingSpinner />}>
  <ProjectDetailContent projectId={projectId} />
</Suspense>

• Initial page load shows skeleton UI
• Tab switching is instant (data pre-loaded)
• API key generation shows loading dialog
• Member list pagination shows inline loading

​

Server Actions

fetchProject(projectId: string)
  -> GET /api/v1/projects/{projectId}
  -> Returns: Project

fetchProjectApiKeys(projectId: string)
  -> GET /api/v1/projects/{projectId}/api-keys
  -> Returns: ApiKey[]

generateApiKeyAction(projectId: string, name?: string)
  -> POST /api/v1/projects/{projectId}/api-keys
  -> Body: { name }
  -> Returns: { id, key, key_prefix, name, created_at }

deleteApiKeyAction(projectId: string, keyId: string)
  -> DELETE /api/v1/projects/{projectId}/api-keys/{keyId}
  -> Returns: Success confirmation

fetchProjectMembers(projectId: string, params: FilterParams)
  -> GET /api/v1/projects/{projectId}/users
  -> Query: page, limit, search, status, role
  -> Returns: { users: User[], total: number }

​

Security and Permissions

• Developers can only access their own projects
• RBAC enforced via X-Developer-Key header
• Project ID validated against developer ownership

• Project details page requires developer role
• requireRole(['developer']) enforced in layout
• Unauthorized users redirected to dashboard

• Full keys shown only once at generation
• Key prefixes displayed for identification
• Hashed keys stored in database (SHA256)

​

Navigation

Console > Projects > [Project Name]

• Back to Projects list
• Jump to specific tab via URL hash
• Keyboard shortcuts (coming soon)

​

Best Practices

1. Name keys descriptively when generating
2. Rotate keys periodically for security
3. Delete unused keys immediately
4. Monitor “Last Used” timestamps
5. Use separate keys for different environments

1. Regularly review active members
2. Use search to locate specific users quickly
3. Monitor registration patterns for suspicious activity
4. Keep member lists organized with filters

1. Keep project name and description up-to-date
2. Use deactivation to temporarily disable projects
3. Back up important data before deletion
4. Document configuration changes

​

Troubleshooting

​

Project Not Loading

1. Verify project ID is valid UUID
2. Check developer key has access to project
3. Ensure project hasn’t been deleted
4. Review browser console for API errors

​

API Keys Not Displaying

1. Generate a new key to test
2. Check API key endpoint permissions
3. Verify project is active
4. Review backend logs for errors

​

Members Not Showing

1. Verify end users have registered through project app
2. Check project ID is correctly configured in app
3. Ensure member registration events are processing
4. Review projector logs for errors

​

Related Pages