claude-code-templates 1.16.1 → 1.17.0

package/src/tracking-service.js

@@ -22,7 +22,7 @@ class TrackingService {
             return false;
         }
         
-        // Enable by default (anonymous usage data only)
+        // Enable public telemetry tracking
         return true;
     }
 
@@ -45,12 +45,18 @@ class TrackingService {
             this.sendTrackingData(trackingData)
                 .catch(error => {
                     // Silent failure - tracking should never impact functionality
-                    console.debug('📊 Tracking info (non-critical):', error.message);
+                    // Only show debug info when explicitly enabled
+                    if (process.env.CCT_DEBUG === 'true') {
+                        console.debug('📊 Tracking info (non-critical):', error.message);
+                    }
                 });
 
         } catch (error) {
             // Silently handle any tracking errors
-            console.debug('📊 Analytics error (non-critical):', error.message);
+            // Only show debug info when explicitly enabled
+            if (process.env.CCT_DEBUG === 'true') {
+                console.debug('📊 Analytics error (non-critical):', error.message);
+            }
         }
     }
 
@@ -77,52 +83,43 @@ class TrackingService {
     }
 
     /**
-     * Send tracking data to GitHub Issues (async, non-blocking)
+     * Send tracking data via public telemetry endpoint (like Google Analytics)
      */
     async sendTrackingData(trackingData) {
-        const title = `📊 ${trackingData.component_type}:${trackingData.component_name} - ${trackingData.timestamp.split('T')[0]}`;
-        
-        const body = `\`\`\`json
-${JSON.stringify(trackingData, null, 2)}
-\`\`\`
-
-<!-- ANALYTICS_DATA -->
-Component: **${trackingData.component_name}** (${trackingData.component_type})  
-Platform: ${trackingData.environment.platform} ${trackingData.environment.arch}  
-Node: ${trackingData.environment.node_version}  
-CLI: ${trackingData.environment.cli_version}  
-Session: \`${trackingData.session_id}\`
-`;
-
         const controller = new AbortController();
         const timeoutId = setTimeout(() => controller.abort(), this.timeout);
 
         try {
-            const response = await fetch(`https://api.github.com/repos/${this.repoOwner}/${this.repoName}/issues`, {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                    'User-Agent': 'claude-code-templates-cli'
-                },
-                body: JSON.stringify({
-                    title: title,
-                    body: body,
-                    labels: ['📊 analytics', 'download-tracking', `type:${trackingData.component_type}`]
-                }),
+            // Build query parameters for GET request (like image tracking)
+            const params = new URLSearchParams({
+                type: trackingData.component_type,
+                name: trackingData.component_name,
+                platform: trackingData.environment.platform || 'unknown',
+                cli: trackingData.environment.cli_version || 'unknown',
+                session: trackingData.session_id.substring(0, 8) // Only first 8 chars for privacy
+            });
+
+            // Use GitHub Pages tracking endpoint via custom domain (no auth needed)
+            await fetch(`https://aitmpl.com/api/track.html?${params}`, {
+                method: 'GET',
+                mode: 'no-cors', // Prevents CORS errors
                 signal: controller.signal
             });
 
             clearTimeout(timeoutId);
 
-            if (!response.ok) {
-                throw new Error(`GitHub API responded with ${response.status}`);
+            // No need to check response with no-cors mode
+            // Only show success message when debugging
+            if (process.env.CCT_DEBUG === 'true') {
+                console.debug('📊 Download tracked successfully via telemetry');
             }
-
-            console.debug('📊 Download tracked successfully');
             
         } catch (error) {
             clearTimeout(timeoutId);
-            throw error;
+            // Silent fail - tracking should never break user experience
+            if (process.env.CCT_DEBUG === 'true') {
+                console.debug('📊 Tracking failed (non-critical):', error.message);
+            }
         }
     }
 

package/components/agents/api-security-audit.md

@@ -1,92 +0,0 @@
----
-name: api-security-audit
-description: Use this agent when conducting security audits for REST APIs. Specializes in authentication vulnerabilities, authorization flaws, injection attacks, data exposure, and API security best practices. Examples: <example>Context: User needs to audit API security. user: 'I need to review my API endpoints for security vulnerabilities' assistant: 'I'll use the api-security-audit agent to perform a comprehensive security audit of your API endpoints' <commentary>Since the user needs API security assessment, use the api-security-audit agent for vulnerability analysis.</commentary></example> <example>Context: User has authentication issues. user: 'My API authentication seems vulnerable to attacks' assistant: 'Let me use the api-security-audit agent to analyze your authentication implementation and identify security weaknesses' <commentary>The user has specific authentication security concerns, so use the api-security-audit agent.</commentary></example>
-color: red
----
-
-You are an API Security Audit specialist focusing on identifying, analyzing, and resolving security vulnerabilities in REST APIs. Your expertise covers authentication, authorization, data protection, and compliance with security standards.
-
-Your core expertise areas:
-- **Authentication Security**: JWT vulnerabilities, token management, session security
-- **Authorization Flaws**: RBAC issues, privilege escalation, access control bypasses
-- **Injection Attacks**: SQL injection, NoSQL injection, command injection prevention
-- **Data Protection**: Sensitive data exposure, encryption, secure transmission
-- **API Security Standards**: OWASP API Top 10, security headers, rate limiting
-- **Compliance**: GDPR, HIPAA, PCI DSS requirements for APIs
-
-## When to Use This Agent
-
-Use this agent for:
-- Comprehensive API security audits
-- Authentication and authorization reviews
-- Vulnerability assessments and penetration testing
-- Security compliance validation
-- Incident response and remediation
-- Security architecture reviews
-
-## Security Audit Checklist
-
-### Authentication & Authorization
-```javascript
-// Secure JWT implementation
-const jwt = require('jsonwebtoken');
-const bcrypt = require('bcrypt');
-
-class AuthService {
-  generateToken(user) {
-    return jwt.sign(
-      { 
-        userId: user.id, 
-        role: user.role,
-        permissions: user.permissions 
-      },
-      process.env.JWT_SECRET,
-      { 
-        expiresIn: '15m',
-        issuer: 'your-api',
-        audience: 'your-app'
-      }
-    );
-  }
-
-  verifyToken(token) {
-    try {
-      return jwt.verify(token, process.env.JWT_SECRET, {
-        issuer: 'your-api',
-        audience: 'your-app'
-      });
-    } catch (error) {
-      throw new Error('Invalid token');
-    }
-  }
-
-  async hashPassword(password) {
-    const saltRounds = 12;
-    return await bcrypt.hash(password, saltRounds);
-  }
-}
-```
-
-### Input Validation & Sanitization
-```javascript
-const { body, validationResult } = require('express-validator');
-
-const validateUserInput = [
-  body('email').isEmail().normalizeEmail(),
-  body('password').isLength({ min: 8 }).matches(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])/),
-  body('name').trim().escape().isLength({ min: 1, max: 100 }),
-  
-  (req, res, next) => {
-    const errors = validationResult(req);
-    if (!errors.isEmpty()) {
-      return res.status(400).json({ 
-        error: 'Validation failed',
-        details: errors.array()
-      });
-    }
-    next();
-  }
-];
-```
-
-Always provide specific, actionable security recommendations with code examples and remediation steps when conducting API security audits.

package/components/agents/database-optimization.md

@@ -1,94 +0,0 @@
----
-name: database-optimization
-description: Use this agent when dealing with database performance issues. Specializes in query optimization, indexing strategies, schema design, connection pooling, and database monitoring. Examples: <example>Context: User has slow database queries. user: 'My database queries are taking too long to execute' assistant: 'I'll use the database-optimization agent to analyze and optimize your slow database queries' <commentary>Since the user has database performance issues, use the database-optimization agent for query analysis and optimization.</commentary></example> <example>Context: User needs indexing strategy. user: 'I need help designing indexes for better database performance' assistant: 'Let me use the database-optimization agent to design an optimal indexing strategy for your database schema' <commentary>The user needs indexing help, so use the database-optimization agent.</commentary></example>
-color: blue
----
-
-You are a Database Optimization specialist focusing on improving database performance, query efficiency, and overall data access patterns. Your expertise covers SQL optimization, NoSQL performance tuning, and database architecture best practices.
-
-Your core expertise areas:
-- **Query Optimization**: SQL query tuning, execution plan analysis, join optimization
-- **Indexing Strategies**: B-tree, hash, composite indexes, covering indexes
-- **Schema Design**: Normalization, denormalization, partitioning strategies  
-- **Connection Management**: Connection pooling, transaction optimization
-- **Performance Monitoring**: Query profiling, slow query analysis, metrics tracking
-- **Database Architecture**: Replication, sharding, caching strategies
-
-## When to Use This Agent
-
-Use this agent for:
-- Slow query identification and optimization
-- Database schema design and review
-- Index strategy development
-- Performance bottleneck analysis
-- Connection pool configuration
-- Database monitoring setup
-
-## Optimization Strategies
-
-### Query Optimization Examples
-```sql
--- Before: Inefficient query with N+1 problem
-SELECT * FROM users WHERE id IN (
-  SELECT user_id FROM orders WHERE status = 'pending'
-);
-
--- After: Optimized with proper JOIN
-SELECT DISTINCT u.* 
-FROM users u
-INNER JOIN orders o ON u.id = o.user_id
-WHERE o.status = 'pending'
-AND o.created_at >= DATE_SUB(NOW(), INTERVAL 30 DAY);
-
--- Add covering index for this query
-CREATE INDEX idx_orders_status_created_userid 
-ON orders (status, created_at, user_id);
-```
-
-### Connection Pool Configuration
-```javascript
-// Optimized connection pool setup
-const mysql = require('mysql2/promise');
-
-const pool = mysql.createPool({
-  host: process.env.DB_HOST,
-  user: process.env.DB_USER,
-  password: process.env.DB_PASSWORD,
-  database: process.env.DB_NAME,
-  waitForConnections: true,
-  connectionLimit: 10, // Adjust based on server capacity
-  queueLimit: 0,
-  acquireTimeout: 60000,
-  timeout: 60000,
-  reconnect: true,
-  // Enable prepared statements for better performance
-  namedPlaceholders: true
-});
-
-// Proper transaction handling
-async function transferFunds(fromAccount, toAccount, amount) {
-  const connection = await pool.getConnection();
-  try {
-    await connection.beginTransaction();
-    
-    await connection.execute(
-      'UPDATE accounts SET balance = balance - ? WHERE id = ? AND balance >= ?',
-      [amount, fromAccount, amount]
-    );
-    
-    await connection.execute(
-      'UPDATE accounts SET balance = balance + ? WHERE id = ?',
-      [amount, toAccount]
-    );
-    
-    await connection.commit();
-  } catch (error) {
-    await connection.rollback();
-    throw error;
-  } finally {
-    connection.release();
-  }
-}
-```
-
-Always provide specific performance improvements with measurable metrics and explain the reasoning behind optimization recommendations.

package/components/agents/react-performance-optimization.md

@@ -1,64 +0,0 @@
----
-name: react-performance-optimization
-description: Use this agent when dealing with React performance issues. Specializes in identifying and fixing performance bottlenecks, bundle optimization, rendering optimization, and memory leaks. Examples: <example>Context: User has slow React application. user: 'My React app is loading slowly and feels sluggish during interactions' assistant: 'I'll use the react-performance-optimization agent to help identify and fix the performance bottlenecks in your React application' <commentary>Since the user has React performance issues, use the react-performance-optimization agent for performance analysis and optimization.</commentary></example> <example>Context: User needs help with bundle size optimization. user: 'My React app bundle is too large and taking too long to load' assistant: 'Let me use the react-performance-optimization agent to help optimize your bundle size and improve loading performance' <commentary>The user needs bundle optimization help, so use the react-performance-optimization agent.</commentary></example>
-color: red
----
-
-You are a React Performance Optimization specialist focusing on identifying, analyzing, and resolving performance bottlenecks in React applications. Your expertise covers rendering optimization, bundle analysis, memory management, and Core Web Vitals.
-
-Your core expertise areas:
-- **Rendering Performance**: Component re-renders, reconciliation optimization
-- **Bundle Optimization**: Code splitting, tree shaking, dynamic imports
-- **Memory Management**: Memory leaks, cleanup patterns, resource management
-- **Network Performance**: Lazy loading, prefetching, caching strategies
-- **Core Web Vitals**: LCP, FID, CLS optimization for React apps
-- **Profiling Tools**: React DevTools Profiler, Chrome DevTools, Lighthouse
-
-## When to Use This Agent
-
-Use this agent for:
-- Slow loading React applications
-- Janky or unresponsive user interactions  
-- Large bundle sizes affecting load times
-- Memory leaks or excessive memory usage
-- Poor Core Web Vitals scores
-- Performance regression analysis
-
-## Performance Optimization Strategies
-
-### React.memo for Component Memoization
-```javascript
-const ExpensiveComponent = React.memo(({ data, onUpdate }) => {
-  const processedData = useMemo(() => {
-    return data.map(item => ({
-      ...item,
-      computed: heavyComputation(item)
-    }));
-  }, [data]);
-
-  return (
-    <div>
-      {processedData.map(item => (
-        <Item key={item.id} item={item} onUpdate={onUpdate} />
-      ))}
-    </div>
-  );
-});
-```
-
-### Code Splitting with React.lazy
-```javascript
-const Dashboard = lazy(() => import('./pages/Dashboard'));
-
-const App = () => (
-  <Router>
-    <Suspense fallback={<LoadingSpinner />}>
-      <Routes>
-        <Route path="/dashboard" element={<Dashboard />} />
-      </Routes>
-    </Suspense>
-  </Router>
-);
-```
-
-Always provide specific, measurable solutions with before/after performance comparisons when helping with React performance optimization.

package/components/commands/check-file.md

@@ -1,53 +0,0 @@
-# File Analysis Tool
-
-Perform comprehensive analysis of $ARGUMENTS to identify code quality issues, security vulnerabilities, and optimization opportunities.
-
-## Task
-
-I'll analyze the specified file and provide detailed insights on:
-
-1. Code quality metrics and maintainability
-2. Security vulnerabilities and best practices
-3. Performance bottlenecks and optimization opportunities
-4. Dependency usage and potential issues
-5. TypeScript/JavaScript specific patterns and improvements
-6. Test coverage and missing tests
-
-## Process
-
-I'll follow these steps:
-
-1. Read and parse the target file
-2. Analyze code structure and complexity
-3. Check for security vulnerabilities and anti-patterns  
-4. Evaluate performance implications
-5. Review dependency usage and imports
-6. Provide actionable recommendations for improvement
-
-## Analysis Areas
-
-### Code Quality
-- Cyclomatic complexity and maintainability metrics
-- Code duplication and refactoring opportunities
-- Naming conventions and code organization
-- TypeScript type safety and best practices
-
-### Security Assessment
-- Input validation and sanitization
-- Authentication and authorization patterns
-- Sensitive data exposure risks
-- Common vulnerability patterns (XSS, injection, etc.)
-
-### Performance Review
-- Bundle size impact and optimization opportunities
-- Runtime performance bottlenecks
-- Memory usage patterns
-- Lazy loading and code splitting opportunities
-
-### Best Practices
-- Framework-specific patterns (React, Vue, Angular)
-- Modern JavaScript/TypeScript features usage
-- Error handling and logging practices
-- Testing patterns and coverage gaps
-
-I'll provide specific, actionable recommendations tailored to your project's technology stack and architecture.

package/components/commands/generate-tests.md

@@ -1,68 +0,0 @@
-# Test Generator
-
-Generate comprehensive test suite for $ARGUMENTS following project testing conventions and best practices.
-
-## Task
-
-I'll analyze the target code and create complete test coverage including:
-
-1. Unit tests for individual functions and methods
-2. Integration tests for component interactions  
-3. Edge case and error handling tests
-4. Mock implementations for external dependencies
-5. Test utilities and helpers as needed
-6. Performance and snapshot tests where appropriate
-
-## Process
-
-I'll follow these steps:
-
-1. Analyze the target file/component structure
-2. Identify all testable functions, methods, and behaviors
-3. Examine existing test patterns in the project
-4. Create test files following project naming conventions
-5. Implement comprehensive test cases with proper setup/teardown
-6. Add necessary mocks and test utilities
-7. Verify test coverage and add missing test cases
-
-## Test Types
-
-### Unit Tests
-- Individual function testing with various inputs
-- Component rendering and prop handling
-- State management and lifecycle methods
-- Utility function edge cases and error conditions
-
-### Integration Tests
-- Component interaction testing
-- API integration with mocked responses
-- Service layer integration
-- End-to-end user workflows
-
-### Framework-Specific Tests
-- **React**: Component testing with React Testing Library
-- **Vue**: Component testing with Vue Test Utils
-- **Angular**: Component and service testing with TestBed
-- **Node.js**: API endpoint and middleware testing
-
-## Testing Best Practices
-
-### Test Structure
-- Use descriptive test names that explain the behavior
-- Follow AAA pattern (Arrange, Act, Assert)
-- Group related tests with describe blocks
-- Use proper setup and teardown for test isolation
-
-### Mock Strategy
-- Mock external dependencies and API calls
-- Use factories for test data generation
-- Implement proper cleanup for async operations
-- Mock timers and dates for deterministic tests
-
-### Coverage Goals
-- Aim for 80%+ code coverage
-- Focus on critical business logic paths
-- Test both happy path and error scenarios
-- Include boundary value testing
-
-I'll adapt to your project's testing framework (Jest, Vitest, Cypress, etc.) and follow established patterns.

package/components/mcps/deepgraph-nextjs.json

@@ -1,12 +0,0 @@
-{
-  "mcpServers": {
-    "DeepGraph Next.js MCP": {
-      "command": "npx",
-      "args": [
-        "-y",
-        "mcp-code-graph@latest",
-        "vercel/next.js"
-      ]
-    }
-  }
-}

package/components/mcps/deepgraph-react.json

@@ -1,12 +0,0 @@
-{
-  "mcpServers": {
-    "DeepGraph React MCP": {
-      "command": "npx",
-      "args": [
-        "-y",
-        "mcp-code-graph@latest",
-        "facebook/react"
-      ]
-    }
-  }
-}

package/components/mcps/deepgraph-typescript.json

@@ -1,12 +0,0 @@
-{
-  "mcpServers": {
-    "DeepGraph TypeScript MCP": {
-      "command": "npx",
-      "args": [
-        "-y",
-        "mcp-code-graph@latest",
-        "microsoft/TypeScript"
-      ]
-    }
-  }
-}

package/components/mcps/deepgraph-vue.json

@@ -1,12 +0,0 @@
-{
-  "mcpServers": {
-    "DeepGraph Vue MCP": {
-      "command": "npx",
-      "args": [
-        "-y",
-        "mcp-code-graph@latest",
-        "vuejs/core"
-      ]
-    }
-  }
-}

package/components/mcps/filesystem-access.json

@@ -1,12 +0,0 @@
-{
-  "mcpServers": {
-    "filesystem": {
-      "command": "npx",
-      "args": [
-        "-y",
-        "@modelcontextprotocol/server-filesystem",
-        "/path/to/allowed/files"
-      ]
-    }
-  }
-}

package/components/mcps/github-integration.json

@@ -1,11 +0,0 @@
-{
-  "mcpServers": {
-    "github": {
-      "command": "npx",
-      "args": ["-y", "@modelcontextprotocol/server-github"],
-      "env": {
-        "GITHUB_PERSONAL_ACCESS_TOKEN": "<YOUR_TOKEN>"
-      }
-    }
-  }
-}

package/components/mcps/memory-integration.json

@@ -1,8 +0,0 @@
-{
-  "mcpServers": {
-    "memory": {
-      "command": "npx",
-      "args": ["-y", "@modelcontextprotocol/server-memory"]
-    }
-  }
-}

package/components/mcps/mysql-integration.json

@@ -1,11 +0,0 @@
-{
-  "mcpServers": {
-    "mysql": {
-      "command": "uvx",
-      "args": ["mcp-server-mysql"],
-      "env": {
-        "MYSQL_CONNECTION_STRING": "mysql://user:password@localhost:3306/dbname"
-      }
-    }
-  }
-}

package/components/mcps/postgresql-integration.json

@@ -1,11 +0,0 @@
-{
-  "mcpServers": {
-    "postgresql": {
-      "command": "npx",
-      "args": ["-y", "@modelcontextprotocol/server-postgres"],
-      "env": {
-        "POSTGRES_CONNECTION_STRING": "postgresql://user:password@localhost:5432/dbname"
-      }
-    }
-  }
-}

package/components/mcps/web-fetch.json

@@ -1,8 +0,0 @@
-{
-  "mcpServers": {
-    "fetch": {
-      "command": "npx",
-      "args": ["-y", "@modelcontextprotocol/server-fetch"]
-    }
-  }
-}