e43feb6163
Features:
- New UserDetailsView component with expandable conversations
- Each conversation shows all messages with token usage and cost
- User information section (email, role, status, last login)
- Token usage statistics grid (8 stat cards)
- Message content truncation for long messages (500 chars)
- Role-based styling (user: blue, assistant: gold)
Backend:
- New GET /admin/users/{user_id}/details endpoint
- Complex SQL queries with joins for user stats and conversations
- Pydantic schemas: UserDetails, ConversationDetail, MessageDetail
- Per-message and per-conversation token tracking
Frontend:
- React Router integration for /admin/users/:userId route
- Navigation from Usage page "View" button to user details
- Back button to return to admin panel
- Proper error handling and loading states
- Responsive CSS styling with hover effects
Changes:
- backend/app/api/v1/endpoints/admin.py: Added getUserDetails endpoint
- frontend/src/components/UserDetailsView.tsx: New component
- frontend/src/App.tsx: Added route for user details page
- frontend/src/components/TokenUsageDashboard.tsx: Added navigation handler
- frontend/src/services/api.ts: Added adminAPI.getUserDetails method
- frontend/src/styles/admin.css: Added comprehensive styling for user details
- frontend/package.json: Added react-router-dom dependency
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
55 lines
1.4 KiB
JSON
55 lines
1.4 KiB
JSON
{
|
|
"name": "apac-ops-bot-frontend",
|
|
"version": "1.0.0",
|
|
"description": "Frontend for APAC Ops Bot - AI-powered operations assistant",
|
|
"private": true,
|
|
"dependencies": {
|
|
"@azure/msal-browser": "^3.7.1",
|
|
"@azure/msal-react": "^2.0.11",
|
|
"axios": "^1.6.5",
|
|
"prismjs": "^1.29.0",
|
|
"react": "^18.2.0",
|
|
"react-dom": "^18.2.0",
|
|
"react-markdown": "^9.0.1",
|
|
"react-router-dom": "^6.30.3",
|
|
"recharts": "^2.10.4"
|
|
},
|
|
"devDependencies": {
|
|
"@types/node": "^20.11.0",
|
|
"@types/prismjs": "^1.26.3",
|
|
"@types/react": "^18.2.48",
|
|
"@types/react-dom": "^18.2.18",
|
|
"@typescript-eslint/eslint-plugin": "^6.19.0",
|
|
"@typescript-eslint/parser": "^6.19.0",
|
|
"eslint": "^8.56.0",
|
|
"eslint-plugin-react": "^7.33.2",
|
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
"react-scripts": "5.0.1",
|
|
"typescript": "^5.3.3"
|
|
},
|
|
"scripts": {
|
|
"start": "react-scripts start",
|
|
"build": "react-scripts build",
|
|
"test": "react-scripts test",
|
|
"eject": "react-scripts eject",
|
|
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
|
"format": "prettier --write \"src/**/*.{ts,tsx,json,css}\""
|
|
},
|
|
"eslintConfig": {
|
|
"extends": [
|
|
"react-app"
|
|
]
|
|
},
|
|
"browserslist": {
|
|
"production": [
|
|
">0.2%",
|
|
"not dead",
|
|
"not op_mini all"
|
|
],
|
|
"development": [
|
|
"last 1 chrome version",
|
|
"last 1 firefox version",
|
|
"last 1 safari version"
|
|
]
|
|
}
|
|
}
|