3525c83dd2
SUMMARY: Fixed 3 broken admin pages (newsletter, hooks dashboard, migrator) and standardized navigation links. These pages were completely non-functional due to localStorage key mismatches. CRITICAL FIXES: 1. newsletter-management.js: - token → admin_token (5 occurrences) - admin → admin_user (2 occurrences) - Now matches login.js localStorage keys 2. hooks-dashboard.js: - tractatus_admin_token → admin_token - Now uses correct auth token 3. claude-md-migrator.js: - auth_token → admin_token (2 occurrences) - Added missing apiRequest() helper function - Fixed logout to clear both admin_token and admin_user NAVIGATION FIXES: 4. newsletter-management.html: - dashboard.html → /admin/dashboard.html (absolute path) 5. claude-md-migrator.html: - ../css/tailwind.css → /css/tailwind.css?v=1759833751 (absolute + version) - Added tractatus-theme.min.css BEFORE (BROKEN): - Newsletter Management: ❌ Auth failed (wrong token key) - Hooks Dashboard: ❌ Auth failed (wrong token key) - CLAUDE.md Migrator: ❌ Auth failed + missing apiRequest() AFTER (WORKING): - Newsletter Management: ✅ Auth works, all API calls function - Hooks Dashboard: ✅ Auth works, metrics load - CLAUDE.md Migrator: ✅ Auth works, API requests function NEXT STEPS (Phase 2): - Create unified admin navbar component - Standardize CSS versioning across all pages - Verify/create missing API endpoints 🤖 Generated with Claude Code (https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
252 lines
12 KiB
HTML
252 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>CLAUDE.md Migration Wizard - Tractatus Admin</title>
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=1759833751">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css">
|
|
<script src="/js/admin/auth-check.js"></script>
|
|
</head>
|
|
<body class="bg-gray-100">
|
|
<!-- Navigation -->
|
|
<nav class="bg-white shadow-sm border-b border-gray-200">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex justify-between h-16">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0 flex items-center">
|
|
<a href="/admin/dashboard.html" class="text-2xl font-bold text-indigo-600">Tractatus Admin</a>
|
|
</div>
|
|
<div class="hidden sm:ml-6 sm:flex sm:space-x-8">
|
|
<a href="/admin/dashboard.html" class="text-gray-700 hover:text-gray-900 inline-flex items-center px-1 pt-1 text-sm font-medium">
|
|
Dashboard
|
|
</a>
|
|
<a href="/admin/rule-manager.html" class="text-gray-700 hover:text-gray-900 inline-flex items-center px-1 pt-1 text-sm font-medium">
|
|
Rule Manager
|
|
</a>
|
|
<a href="/admin/claude-md-migrator.html" class="text-indigo-600 border-b-2 border-indigo-600 inline-flex items-center px-1 pt-1 text-sm font-medium">
|
|
CLAUDE.md Migration
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<button id="logout-btn" class="text-gray-700 hover:text-gray-900 text-sm font-medium">Logout</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
|
|
<!-- Header -->
|
|
<div class="mb-6">
|
|
<h1 class="text-3xl font-bold text-gray-900">CLAUDE.md Migration Wizard</h1>
|
|
<p class="mt-2 text-sm text-gray-600">
|
|
Analyze your CLAUDE.md file and migrate governance rules to the database with AI assistance
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Migration Steps -->
|
|
<div class="bg-white shadow rounded-lg overflow-hidden">
|
|
<!-- Step Indicator -->
|
|
<div class="bg-gray-50 px-6 py-4 border-b border-gray-200">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex-1">
|
|
<div class="flex items-center">
|
|
<div id="step-1-indicator" class="flex-shrink-0 w-10 h-10 flex items-center justify-center rounded-full bg-indigo-600 text-white font-semibold">
|
|
1
|
|
</div>
|
|
<div class="ml-4">
|
|
<p id="step-1-title" class="text-sm font-medium text-gray-900">Upload CLAUDE.md</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<div class="flex items-center">
|
|
<div class="flex-1 h-0.5 bg-gray-200"></div>
|
|
<div id="step-2-indicator" class="flex-shrink-0 w-10 h-10 flex items-center justify-center rounded-full bg-gray-200 text-gray-500 font-semibold">
|
|
2
|
|
</div>
|
|
<div class="ml-4">
|
|
<p id="step-2-title" class="text-sm font-medium text-gray-500">Review Analysis</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex-1">
|
|
<div class="flex items-center">
|
|
<div class="flex-1 h-0.5 bg-gray-200"></div>
|
|
<div id="step-3-indicator" class="flex-shrink-0 w-10 h-10 flex items-center justify-center rounded-full bg-gray-200 text-gray-500 font-semibold">
|
|
3
|
|
</div>
|
|
<div class="ml-4">
|
|
<p id="step-3-title" class="text-sm font-medium text-gray-500">Create Rules</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 1: Upload -->
|
|
<div id="step-1-content" class="px-6 py-8">
|
|
<div class="text-center">
|
|
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
|
|
</svg>
|
|
<h3 class="mt-2 text-sm font-medium text-gray-900">Upload CLAUDE.md</h3>
|
|
<p class="mt-1 text-sm text-gray-500">
|
|
Select your CLAUDE.md file or paste the content below
|
|
</p>
|
|
<div class="mt-6">
|
|
<label for="file-upload" class="cursor-pointer inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50">
|
|
<svg class="-ml-1 mr-2 h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12"/>
|
|
</svg>
|
|
Choose File
|
|
<input id="file-upload" name="file-upload" type="file" accept=".md" class="sr-only">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-8">
|
|
<label for="claude-md-content" class="block text-sm font-medium text-gray-700 mb-2">
|
|
Or paste content here:
|
|
</label>
|
|
<textarea
|
|
id="claude-md-content"
|
|
rows="12"
|
|
class="w-full border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500 font-mono text-sm"
|
|
placeholder="# CLAUDE.md content here..."
|
|
></textarea>
|
|
</div>
|
|
|
|
<div class="mt-6 flex justify-end">
|
|
<button
|
|
id="analyze-btn"
|
|
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700"
|
|
>
|
|
Analyze CLAUDE.md
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 2: Review Analysis (hidden by default) -->
|
|
<div id="step-2-content" class="hidden px-6 py-8">
|
|
<!-- Statistics -->
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
|
|
<div class="bg-blue-50 rounded-lg p-4">
|
|
<div class="text-sm font-medium text-blue-900">Total Statements</div>
|
|
<div id="stat-total" class="text-2xl font-bold text-blue-700">-</div>
|
|
</div>
|
|
<div class="bg-green-50 rounded-lg p-4">
|
|
<div class="text-sm font-medium text-green-900">High Quality</div>
|
|
<div id="stat-high-quality" class="text-2xl font-bold text-green-700">-</div>
|
|
</div>
|
|
<div class="bg-yellow-50 rounded-lg p-4">
|
|
<div class="text-sm font-medium text-yellow-900">Needs Clarification</div>
|
|
<div id="stat-needs-clarification" class="text-2xl font-bold text-yellow-700">-</div>
|
|
</div>
|
|
<div class="bg-red-50 rounded-lg p-4">
|
|
<div class="text-sm font-medium text-red-900">Too Nebulous</div>
|
|
<div id="stat-too-nebulous" class="text-2xl font-bold text-red-700">-</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tabs -->
|
|
<div class="border-b border-gray-200">
|
|
<nav class="-mb-px flex space-x-8">
|
|
<button class="tab-btn active border-b-2 border-indigo-600 py-4 px-1 text-sm font-medium text-indigo-600" data-tab="high-quality">
|
|
High Quality
|
|
</button>
|
|
<button class="tab-btn border-b-2 border-transparent py-4 px-1 text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300" data-tab="needs-clarification">
|
|
Needs Clarification
|
|
</button>
|
|
<button class="tab-btn border-b-2 border-transparent py-4 px-1 text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300" data-tab="too-nebulous">
|
|
Too Nebulous
|
|
</button>
|
|
<button class="tab-btn border-b-2 border-transparent py-4 px-1 text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300" data-tab="redundancies">
|
|
Redundancies
|
|
</button>
|
|
</nav>
|
|
</div>
|
|
|
|
<!-- Tab Content -->
|
|
<div id="high-quality-tab" class="tab-content mt-6">
|
|
<p class="text-sm text-gray-600 mb-4">These rules can be auto-converted (all selected by default):</p>
|
|
<div id="high-quality-list" class="space-y-3">
|
|
<!-- High quality candidates will be inserted here -->
|
|
</div>
|
|
</div>
|
|
|
|
<div id="needs-clarification-tab" class="tab-content hidden mt-6">
|
|
<p class="text-sm text-gray-600 mb-4">These rules need review before conversion (unselected by default):</p>
|
|
<div id="needs-clarification-list" class="space-y-3">
|
|
<!-- Needs clarification candidates will be inserted here -->
|
|
</div>
|
|
</div>
|
|
|
|
<div id="too-nebulous-tab" class="tab-content hidden mt-6">
|
|
<p class="text-sm text-gray-600 mb-4">These statements are too vague and require manual rewrite:</p>
|
|
<div id="too-nebulous-list" class="space-y-3">
|
|
<!-- Too nebulous candidates will be inserted here -->
|
|
</div>
|
|
</div>
|
|
|
|
<div id="redundancies-tab" class="tab-content hidden mt-6">
|
|
<p class="text-sm text-gray-600 mb-4">Similar rules that should be merged:</p>
|
|
<div id="redundancies-list" class="space-y-4">
|
|
<!-- Redundancies will be inserted here -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Actions -->
|
|
<div class="mt-8 flex justify-between">
|
|
<button
|
|
id="back-to-upload-btn"
|
|
class="inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"
|
|
>
|
|
Back to Upload
|
|
</button>
|
|
<button
|
|
id="create-rules-btn"
|
|
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-green-600 hover:bg-green-700"
|
|
>
|
|
Create Selected Rules
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 3: Results (hidden by default) -->
|
|
<div id="step-3-content" class="hidden px-6 py-8">
|
|
<div class="text-center">
|
|
<svg class="mx-auto h-12 w-12 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
</svg>
|
|
<h3 class="mt-2 text-lg font-medium text-gray-900">Migration Complete!</h3>
|
|
<div id="results-summary" class="mt-4 text-sm text-gray-600">
|
|
<!-- Results will be inserted here -->
|
|
</div>
|
|
<div class="mt-8 flex justify-center space-x-4">
|
|
<a href="/admin/rule-manager.html" class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700">
|
|
View Rules
|
|
</a>
|
|
<button
|
|
id="migrate-another-btn"
|
|
class="inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"
|
|
>
|
|
Migrate Another File
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Toast Container -->
|
|
<div id="toast-container" class="fixed top-4 right-4 z-50"></div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="../js/admin/api.js"></script>
|
|
<script src="../js/admin/toast.js"></script>
|
|
<script src="../js/admin/claude-md-migrator.js"></script>
|
|
</body>
|
|
</html>
|