claude/claude-code-tracker
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add comprehensive hook installation system and update documentation

Browse source 
Major Features Added:
• Automated hook installation scripts (install-hooks.sh and setup-hooks)
• User-scope installation with automatic domain configuration
• 7 pre-configured hook profiles for different user types
• Comprehensive documentation updates across all guides

Hook Installation System:
• ./setup-hooks - One-liner installation for most users
• ./install-hooks.sh - Full-featured installer with profile selection
• Automatic domain replacement using $DOMAIN environment variable
• Settings backup and verification capabilities
• Safe uninstallation with rollback support

Documentation Enhancements:
• Updated README.md with complete project overview and proper git repository URL
• Enhanced Getting Started guide with automated hook installation
• Improved Docker deployment guide with hook installation step
• Reorganized documentation index with better visual hierarchy
• Added repository URL: https://git.supported.systems/claude/claude-code-tracker.git

Technical Improvements:
• Rebuilt Docker containers with all latest changes
• Verified application health and functionality
• Updated all installation examples with correct repository URL
• Improved quick start workflow with 3-step visual process

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ryan Malloy 2025-08-11 09:30:37 -06:00
parent 50c80596d0
commit 1e1d4a995d
8 changed files with 1038 additions and 129 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/dashboard/templates/docs/docker-deployment.html
View file

@ -39,7 +39,7 @@
</div>
<div class="card-body">
<pre><code class="language-bash"># Clone the repository
git clone &lt;repository-url&gt; claude-tracker
git clone https://git.supported.systems/claude/claude-code-tracker.git claude-tracker
cd claude-tracker
# Copy environment template
@ -80,6 +80,28 @@ docker-compose logs -f
docker-compose ps</code></pre>
</div>
</div>
<div class="card mb-3">
<div class="card-header bg-success text-white">
<h5 class="mb-0">4. Install Claude Code Hooks</h5>
</div>
<div class="card-body">
<p>After deployment, install hooks on your development machine to enable automatic tracking:</p>
<pre><code class="language-bash"># Install hooks using the same domain from your .env file
export DOMAIN=claude.l.supported.systems
./setup-hooks</code></pre>
<div class="alert alert-info mt-3">
<i class="fas fa-info-circle me-1"></i>
<strong>Note:</strong> Hooks are installed on your local development machine, not in the Docker container. This allows Claude Code to send data to your deployed tracker.
</div>
<div class="alert alert-success">
<i class="fas fa-check me-1"></i>
<strong>Complete Setup:</strong> Your tracker is now deployed and ready to receive data from Claude Code!
</div>
</div>
</div>
</section>
<!-- Docker Configuration -->

25
app/dashboard/templates/docs/getting-started.html
View file

@ -102,20 +102,21 @@
<p class="text-muted mb-3">Set up hooks to automatically track new sessions and conversations in real-time.</p>
<div class="bg-light p-3 rounded mb-3">
<h6><i class="fas fa-code me-2"></i>Hook Configuration:</h6>
<p class="mb-2">Add this configuration to your Claude Code settings:</p>
<pre class="bg-dark text-light p-3 rounded"><code>{
"hooks": {
"session_start": "curl -X POST http://localhost:8000/api/sessions/start",
"session_end": "curl -X POST http://localhost:8000/api/sessions/end",
"conversation_update": "curl -X POST http://localhost:8000/api/conversations"
}
}</code></pre>
<h6><i class="fas fa-magic me-2"></i>Automatic Installation (Recommended):</h6>
<p class="mb-2">Use our automated installer for easy setup:</p>
<pre class="bg-dark text-light p-3 rounded"><code># Set your domain and install hooks
export DOMAIN=your-domain.com
./setup-hooks</code></pre>
<div class="alert alert-success mt-2 mb-0">
<i class="fas fa-rocket me-1"></i>
<strong>New:</strong> Automatic hook installer with 7+ pre-configured profiles available!
</div>
</div>
<div class="alert alert-warning mb-0">
<i class="fas fa-exclamation-triangle me-2"></i>
<strong>Note:</strong> Detailed hook setup instructions are available in the <a href="/dashboard/docs/hook-setup">Hook Setup Guide</a>.
<div class="alert alert-info mb-0">
<i class="fas fa-info-circle me-2"></i>
<strong>Alternative Methods:</strong> Manual configuration and detailed setup instructions are available in the <a href="/dashboard/docs/hook-setup">Hook Setup Guide</a>.
</div>
</div>
</div>

81
app/dashboard/templates/docs/hook-setup.html
View file

@ -95,10 +95,87 @@
</div>
</div>
<!-- Setup Instructions -->
<!-- Automatic Installation -->
<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-wrench me-2"></i>Setup Instructions</h3>
<h3 class="mb-0"><i class="fas fa-magic me-2"></i>Automatic Installation (Recommended)</h3>
</div>
<div class="card-body">
<p>The easiest way to set up hooks is using our automated installation script that configures everything for you.</p>
<div class="alert alert-success">
<h5><i class="fas fa-rocket me-1"></i>Quick Setup</h5>
<p class="mb-2">For most users, this one-liner will set up everything you need:</p>
<pre class="bg-dark text-light p-3 rounded"><code># Set your domain and run the installer
export DOMAIN=claude.l.supported.systems
./setup-hooks</code></pre>
</div>
<h5 class="mt-4"><i class="fas fa-cog me-2"></i>Installation Options</h5>
<div class="row">
<div class="col-md-6">
<div class="card bg-light">
<div class="card-header">
<strong>Basic Installation</strong>
</div>
<div class="card-body">
<pre><code># Install basic hook set
./install-hooks.sh basic</code></pre>
<p class="small text-muted mb-0">Includes essential session and conversation tracking</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card bg-light">
<div class="card-header">
<strong>Comprehensive Installation</strong>
</div>
<div class="card-body">
<pre><code># Install all available hooks
./install-hooks.sh comprehensive</code></pre>
<p class="small text-muted mb-0">Includes all 39+ hooks for complete tracking</p>
</div>
</div>
</div>
</div>
<h5 class="mt-4"><i class="fas fa-list me-2"></i>Available Profiles</h5>
<div class="row">
<div class="col-md-6">
<ul class="list-unstyled">
<li class="mb-2"><span class="badge bg-primary me-2">basic</span>Essential hooks only</li>
<li class="mb-2"><span class="badge bg-success me-2">essential</span>Core development tracking</li>
<li class="mb-2"><span class="badge bg-info me-2">comprehensive</span>All available hooks</li>
<li class="mb-2"><span class="badge bg-warning me-2">developer</span>For active developers</li>
</ul>
</div>
<div class="col-md-6">
<ul class="list-unstyled">
<li class="mb-2"><span class="badge bg-secondary me-2">power_user</span>Advanced tracking features</li>
<li class="mb-2"><span class="badge bg-dark me-2">research</span>Research and analytics focused</li>
<li class="mb-2"><span class="badge bg-purple me-2">team</span>Team collaboration features</li>
</ul>
</div>
</div>
<div class="alert alert-info mt-3">
<h6><i class="fas fa-terminal me-1"></i>Script Commands</h6>
<ul class="mb-0">
<li><code>./install-hooks.sh --list</code> - List available profiles</li>
<li><code>./install-hooks.sh --verify</code> - Verify installation</li>
<li><code>./install-hooks.sh --uninstall</code> - Remove all hooks</li>
<li><code>./install-hooks.sh --help</code> - Show detailed help</li>
</ul>
</div>
</div>
</div>
<!-- Manual Setup Instructions -->
<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-wrench me-2"></i>Manual Setup Instructions</h3>
</div>
<div class="card-body">
<!-- Step 1: Ensure Server Running -->

74
app/dashboard/templates/docs/index.html
View file

@ -181,37 +181,67 @@
<div class="row mt-5">
<div class="col-md-12">
<div class="card border-0 shadow-sm">
<div class="card-header bg-light">
<h4 class="mb-0"><i class="fas fa-lightning-bolt me-2"></i>Quick Start</h4>
<div class="card-header bg-success text-white">
<h4 class="mb-0"><i class="fas fa-rocket me-2"></i>Quick Start - Get Running in 3 Steps</h4>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-8">
<p class="lead">Get started with Claude Code Tracker in just a few steps:</p>
<ol class="list-unstyled">
<li class="mb-2">
<span class="badge bg-primary rounded-pill me-2">1</span>
<strong>Import existing data</strong> from your <code>~/.claude.json</code> file
</li>
<li class="mb-2">
<span class="badge bg-primary rounded-pill me-2">2</span>
<strong>Set up hooks</strong> to automatically track new sessions
</li>
<li class="mb-2">
<span class="badge bg-primary rounded-pill me-2">3</span>
<strong>Explore your data</strong> through the dashboard and analytics
</li>
</ol>
<p class="lead">Get started with Claude Code Tracker in just a few minutes:</p>
<div class="row">
<div class="col-lg-4 mb-3">
<div class="card border-primary h-100">
<div class="card-body text-center">
<div class="bg-primary rounded-circle text-white d-flex align-items-center justify-content-center mx-auto mb-2" style="width: 40px; height: 40px;">
<strong>1</strong>
</div>
<h6>Deploy with Docker</h6>
<small class="text-muted">Set up the tracker server using Docker & Caddy</small>
</div>
</div>
</div>
<div class="col-lg-4 mb-3">
<div class="card border-success h-100">
<div class="card-body text-center">
<div class="bg-success rounded-circle text-white d-flex align-items-center justify-content-center mx-auto mb-2" style="width: 40px; height: 40px;">
<strong>2</strong>
</div>
<h6>Import Data</h6>
<small class="text-muted">Upload your .claude.json file with file upload</small>
</div>
</div>
</div>
<div class="col-lg-4 mb-3">
<div class="card border-info h-100">
<div class="card-body text-center">
<div class="bg-info rounded-circle text-white d-flex align-items-center justify-content-center mx-auto mb-2" style="width: 40px; height: 40px;">
<strong>3</strong>
</div>
<h6>Install Hooks</h6>
<small class="text-muted">Run ./setup-hooks for automatic tracking</small>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 text-center">
<div class="col-md-4">
<div class="d-grid gap-2">
<a href="/dashboard/import" class="btn btn-success btn-lg">
<i class="fas fa-upload me-2"></i>
Import Data Now
<a href="/dashboard/docs/docker-deployment" class="btn btn-info btn-lg">
<i class="fab fa-docker me-2"></i>
Docker Setup
</a>
<a href="/dashboard/import" class="btn btn-success">
<i class="fas fa-cloud-upload-alt me-2"></i>
Import Data
</a>
<a href="/dashboard/docs/hook-setup" class="btn btn-warning">
<i class="fas fa-magic me-2"></i>
Setup Hooks
</a>
<a href="/dashboard/docs/getting-started" class="btn btn-outline-primary">
<i class="fas fa-book me-2"></i>
Read Full Guide
Full Guide
</a>
</div>
</div>