Ryan Malloy
bec1606c86
## Documentation System - Create complete documentation hub at /dashboard/docs with: - Getting Started guide with quick setup and troubleshooting - Hook Setup Guide with platform-specific configurations - API Reference with all endpoints and examples - FAQ with searchable questions and categories - Add responsive design with interactive features - Update navigation in base template ## Tool Call Tracking - Add ToolCall model for tracking Claude Code tool usage - Create /api/tool-calls endpoints for recording and analytics - Add tool_call hook type with auto-session detection - Include tool calls in project statistics and recalculation - Track tool names, parameters, execution time, and success rates ## Project Enhancements - Add project timeline and statistics pages (fix 404 errors) - Create recalculation script for fixing zero statistics - Update project stats to include tool call counts - Enhance session model with tool call relationships ## Infrastructure - Switch from requirements.txt to pyproject.toml/uv.lock - Add data import functionality for claude.json files - Update database connection to include all new models - Add comprehensive API documentation 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
540 lines
28 KiB
HTML
540 lines
28 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ title }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- Header -->
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<div>
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="/dashboard/docs">Documentation</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">API Reference</li>
|
|
</ol>
|
|
</nav>
|
|
<h2><i class="fas fa-code me-3"></i>API Reference</h2>
|
|
<p class="lead text-muted">Complete reference for the Claude Code Tracker REST API</p>
|
|
</div>
|
|
<div>
|
|
<a href="/docs" target="_blank" class="btn btn-primary">
|
|
<i class="fas fa-external-link-alt me-1"></i>
|
|
Interactive Docs
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-8">
|
|
<!-- Base URL -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-body">
|
|
<h3><i class="fas fa-server me-2 text-primary"></i>Base URL</h3>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<code>http://localhost:8000</code>
|
|
</div>
|
|
<p class="text-muted mt-2 mb-0">All API endpoints are relative to this base URL. The server runs on port 8000 by default.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Authentication -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-body">
|
|
<h3><i class="fas fa-key me-2 text-warning"></i>Authentication</h3>
|
|
<div class="alert alert-info">
|
|
<i class="fas fa-info-circle me-2"></i>
|
|
Currently, the API does not require authentication. All endpoints are publicly accessible when the server is running.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Projects API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-primary text-white">
|
|
<h3 class="mb-0"><i class="fas fa-folder-open me-2"></i>Projects API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Get Projects -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/projects</code>
|
|
</div>
|
|
<p class="text-muted">Retrieve all projects with their statistics.</p>
|
|
|
|
<h6>Response Example:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>[
|
|
{
|
|
"id": 1,
|
|
"name": "claude-tracker",
|
|
"path": "/home/user/claude-tracker",
|
|
"total_sessions": 5,
|
|
"total_time_minutes": 240,
|
|
"files_modified_count": 15,
|
|
"lines_changed_count": 500,
|
|
"last_session": "2024-01-15T10:30:00",
|
|
"created_at": "2024-01-10T09:00:00"
|
|
}
|
|
]</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Get Project Details -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/projects/{project_id}</code>
|
|
</div>
|
|
<p class="text-muted">Get detailed information about a specific project.</p>
|
|
|
|
<h6>Parameters:</h6>
|
|
<ul>
|
|
<li><code>project_id</code> (integer, required): Project ID</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Project Statistics -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/projects/{project_id}/stats</code>
|
|
</div>
|
|
<p class="text-muted">Get comprehensive statistics for a project including time series data.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sessions API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-success text-white">
|
|
<h3 class="mb-0"><i class="fas fa-play-circle me-2"></i>Sessions API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Start Session -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/sessions/start</code>
|
|
</div>
|
|
<p class="text-muted">Start a new coding session.</p>
|
|
|
|
<h6>Request Body:</h6>
|
|
<div class="bg-dark text-light p-3 rounded mb-3">
|
|
<pre><code>{
|
|
"project_path": "/path/to/project",
|
|
"start_time": "2024-01-15T10:30:00",
|
|
"user": "username"
|
|
}</code></pre>
|
|
</div>
|
|
|
|
<h6>Response:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"session_id": "12345",
|
|
"project_id": 1,
|
|
"message": "Session started successfully"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- End Session -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/sessions/end</code>
|
|
</div>
|
|
<p class="text-muted">End an active coding session.</p>
|
|
|
|
<h6>Request Body:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"session_id": "12345",
|
|
"end_time": "2024-01-15T12:30:00"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Get Sessions -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/sessions</code>
|
|
</div>
|
|
<p class="text-muted">Retrieve sessions with optional filtering.</p>
|
|
|
|
<h6>Query Parameters:</h6>
|
|
<ul>
|
|
<li><code>project_id</code> (integer, optional): Filter by project</li>
|
|
<li><code>start_date</code> (date, optional): Sessions after this date</li>
|
|
<li><code>end_date</code> (date, optional): Sessions before this date</li>
|
|
<li><code>limit</code> (integer, optional): Maximum number of results</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Conversations API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-info text-white">
|
|
<h3 class="mb-0"><i class="fas fa-comments me-2"></i>Conversations API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Create Conversation -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/conversations</code>
|
|
</div>
|
|
<p class="text-muted">Record a new conversation message.</p>
|
|
|
|
<h6>Request Body:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"session_id": "12345",
|
|
"content": "User message or assistant response",
|
|
"role": "user|assistant",
|
|
"timestamp": "2024-01-15T10:35:00"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Search Conversations -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/conversations/search</code>
|
|
</div>
|
|
<p class="text-muted">Search conversations by content, project, or date.</p>
|
|
|
|
<h6>Query Parameters:</h6>
|
|
<ul>
|
|
<li><code>q</code> (string): Search query for content</li>
|
|
<li><code>project_id</code> (integer): Filter by project</li>
|
|
<li><code>start_date</code> (date): Messages after this date</li>
|
|
<li><code>end_date</code> (date): Messages before this date</li>
|
|
<li><code>role</code> (string): Filter by role (user/assistant)</li>
|
|
<li><code>limit</code> (integer): Maximum results (default: 50)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Get Conversations -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/conversations</code>
|
|
</div>
|
|
<p class="text-muted">Retrieve conversations with pagination.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Activities API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-warning text-dark">
|
|
<h3 class="mb-0"><i class="fas fa-file-edit me-2"></i>Activities API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Record Activity -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/activities</code>
|
|
</div>
|
|
<p class="text-muted">Record a file modification activity.</p>
|
|
|
|
<h6>Request Body:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"session_id": "12345",
|
|
"file_path": "/path/to/modified/file.py",
|
|
"action": "created|modified|deleted",
|
|
"lines_added": 10,
|
|
"lines_removed": 5,
|
|
"timestamp": "2024-01-15T10:40:00"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Get Activities -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/activities</code>
|
|
</div>
|
|
<p class="text-muted">Retrieve file modification activities.</p>
|
|
|
|
<h6>Query Parameters:</h6>
|
|
<ul>
|
|
<li><code>session_id</code> (string): Filter by session</li>
|
|
<li><code>project_id</code> (integer): Filter by project</li>
|
|
<li><code>file_path</code> (string): Filter by file path</li>
|
|
<li><code>action</code> (string): Filter by action type</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tool Calls API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-dark text-white">
|
|
<h3 class="mb-0"><i class="fas fa-tools me-2"></i>Tool Calls API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Record Tool Call -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/tool-calls</code>
|
|
</div>
|
|
<p class="text-muted">Record a tool call made during a Claude Code session.</p>
|
|
|
|
<h6>Request Body:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"tool_name": "Read",
|
|
"parameters": {
|
|
"file_path": "/path/to/file.py",
|
|
"limit": 100
|
|
},
|
|
"result_status": "success",
|
|
"execution_time_ms": 250,
|
|
"timestamp": "2024-01-15T10:45:00"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Get Tool Usage Stats -->
|
|
<div class="border-bottom pb-4 mb-4">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/tool-calls/stats</code>
|
|
</div>
|
|
<p class="text-muted">Get tool usage statistics with optional filtering.</p>
|
|
|
|
<h6>Query Parameters:</h6>
|
|
<ul>
|
|
<li><code>project_id</code> (integer, optional): Filter by project</li>
|
|
<li><code>start_date</code> (date, optional): Tools used after this date</li>
|
|
<li><code>end_date</code> (date, optional): Tools used before this date</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Get Session Tool Calls -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-success me-2 px-3">GET</span>
|
|
<code>/api/tool-calls/session/{session_id}</code>
|
|
</div>
|
|
<p class="text-muted">Get all tool calls for a specific session.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Data Import API -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-secondary text-white">
|
|
<h3 class="mb-0"><i class="fas fa-upload me-2"></i>Data Import API</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<!-- Import Claude Data -->
|
|
<div>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<span class="badge bg-warning text-dark me-2 px-3">POST</span>
|
|
<code>/api/import/claude-data</code>
|
|
</div>
|
|
<p class="text-muted">Import data from a Claude.json file.</p>
|
|
|
|
<h6>Request:</h6>
|
|
<p>Multipart form data with file upload:</p>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>Content-Type: multipart/form-data
|
|
|
|
file: [claude.json file]</code></pre>
|
|
</div>
|
|
|
|
<h6>Response:</h6>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"success": true,
|
|
"projects_imported": 15,
|
|
"sessions_imported": 42,
|
|
"conversations_imported": 158,
|
|
"activities_imported": 89,
|
|
"errors": []
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Error Responses -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-body">
|
|
<h3><i class="fas fa-exclamation-triangle me-2 text-danger"></i>Error Responses</h3>
|
|
<p class="text-muted mb-4">The API uses standard HTTP status codes and returns error details in JSON format.</p>
|
|
|
|
<h5>Common Status Codes:</h5>
|
|
<div class="table-responsive">
|
|
<table class="table table-sm">
|
|
<thead>
|
|
<tr>
|
|
<th>Code</th>
|
|
<th>Meaning</th>
|
|
<th>Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="badge bg-success">200</span></td>
|
|
<td>OK</td>
|
|
<td>Request successful</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="badge bg-info">201</span></td>
|
|
<td>Created</td>
|
|
<td>Resource created successfully</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="badge bg-warning text-dark">400</span></td>
|
|
<td>Bad Request</td>
|
|
<td>Invalid request data</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="badge bg-danger">404</span></td>
|
|
<td>Not Found</td>
|
|
<td>Resource not found</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="badge bg-danger">500</span></td>
|
|
<td>Server Error</td>
|
|
<td>Internal server error</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<h5>Error Response Format:</h5>
|
|
<div class="bg-dark text-light p-3 rounded">
|
|
<pre><code>{
|
|
"error": true,
|
|
"message": "Detailed error description",
|
|
"code": "ERROR_CODE",
|
|
"details": {
|
|
"field": "Additional error context"
|
|
}
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Rate Limiting -->
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body">
|
|
<h3><i class="fas fa-tachometer-alt me-2 text-info"></i>Rate Limiting</h3>
|
|
<div class="alert alert-info">
|
|
<i class="fas fa-info-circle me-2"></i>
|
|
Currently, no rate limiting is implemented. However, it's recommended to avoid making excessive requests to maintain optimal performance.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sidebar -->
|
|
<div class="col-lg-4">
|
|
<div class="sticky-top" style="top: 2rem;">
|
|
<!-- Quick Links -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-primary text-white">
|
|
<h5 class="mb-0"><i class="fas fa-external-link-alt me-2"></i>Quick Links</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-grid gap-2">
|
|
<a href="/docs" target="_blank" class="btn btn-primary">
|
|
<i class="fas fa-code me-2"></i>
|
|
Interactive API Docs
|
|
</a>
|
|
<a href="http://localhost:8000/api/projects" target="_blank" class="btn btn-outline-success">
|
|
<i class="fas fa-folder-open me-2"></i>
|
|
Test Projects API
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Table of Contents -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-light">
|
|
<h6 class="mb-0"><i class="fas fa-list me-2"></i>API Endpoints</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<nav class="nav nav-pills flex-column">
|
|
<a class="nav-link py-1 px-2 text-sm" href="#projects">Projects API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#sessions">Sessions API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#conversations">Conversations API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#activities">Activities API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#tool-calls">Tool Calls API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#import">Data Import API</a>
|
|
<a class="nav-link py-1 px-2 text-sm" href="#errors">Error Responses</a>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Code Examples -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-success text-white">
|
|
<h6 class="mb-0"><i class="fas fa-code me-2"></i>Code Examples</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<h6>JavaScript (Fetch)</h6>
|
|
<div class="bg-dark text-light p-2 rounded mb-3">
|
|
<code class="small">
|
|
fetch('/api/projects')<br>
|
|
.then(r => r.json())<br>
|
|
.then(data => console.log(data))
|
|
</code>
|
|
</div>
|
|
|
|
<h6>Python (Requests)</h6>
|
|
<div class="bg-dark text-light p-2 rounded mb-3">
|
|
<code class="small">
|
|
import requests<br>
|
|
r = requests.get('http://localhost:8000/api/projects')<br>
|
|
print(r.json())
|
|
</code>
|
|
</div>
|
|
|
|
<h6>cURL</h6>
|
|
<div class="bg-dark text-light p-2 rounded">
|
|
<code class="small">
|
|
curl -X GET http://localhost:8000/api/projects
|
|
</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SDK Information -->
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-header bg-info text-white">
|
|
<h6 class="mb-0"><i class="fas fa-puzzle-piece me-2"></i>SDK & Libraries</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="small text-muted mb-3">Currently, there are no official SDKs. Use standard HTTP libraries for your preferred language.</p>
|
|
<h6>Recommended Libraries:</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><strong>JavaScript:</strong> fetch, axios</li>
|
|
<li class="mb-1"><strong>Python:</strong> requests, httpx</li>
|
|
<li class="mb-1"><strong>Go:</strong> net/http</li>
|
|
<li class="mb-1"><strong>Java:</strong> OkHttp, HttpClient</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %} |