diff --git a/client/pages/DocsSync.tsx b/client/pages/DocsSync.tsx new file mode 100644 index 00000000..5fc7b47e --- /dev/null +++ b/client/pages/DocsSync.tsx @@ -0,0 +1,218 @@ +import { useState } from 'react'; +import Layout from '@/components/Layout'; +import { Button } from '@/components/ui/button'; +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; +import { Badge } from '@/components/ui/badge'; +import { CheckCircle2, AlertCircle, Loader2, GitBook } from 'lucide-react'; + +interface SyncResult { + page: string; + status: 'success' | 'failed'; + error?: string; +} + +interface SyncResponse { + message: string; + successful: number; + failed: number; + results: SyncResult[]; +} + +export default function DocsSync() { + const [loading, setLoading] = useState(false); + const [result, setResult] = useState(null); + const [error, setError] = useState(null); + + const handleSync = async () => { + setLoading(true); + setError(null); + + try { + const response = await fetch('/api/sync-docs-gitbook', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + }); + + if (!response.ok) { + throw new Error(`API error: ${response.statusText}`); + } + + const data: SyncResponse = await response.json(); + setResult(data); + } catch (err) { + setError(err instanceof Error ? err.message : 'Unknown error'); + } finally { + setLoading(false); + } + }; + + return ( + +
+
+ {/* Header */} +
+
+ +

Documentation Sync

+
+

+ Sync your AeThex documentation to Gitbook. Click the button below to push all 9 documentation pages to your Gitbook workspace. +

+
+ + {/* Sync Card */} + + + Sync Documentation to Gitbook + + This will push all 9 documentation pages to your Gitbook workspace + + + + {/* Status Info */} +
+
+

Pages to Sync

+

9

+
+
+

Workspace

+

AeThex Docs

+
+
+

Target

+

Gitbook

+
+
+ + {/* Sync Button */} + + + + + {/* Error Message */} + {error && ( + + +
+ +
+

Sync Failed

+

{error}

+
+
+ + + )} + + {/* Results */} + {result && ( + + +
+ Sync Results +
+
+

Successful

+

{result.successful}

+
+ {result.failed > 0 && ( +
+

Failed

+

{result.failed}

+
+ )} +
+
+ + +
+ {result.results.map((item, index) => ( +
+
+ {item.status === 'success' ? ( + + ) : ( + + )} + {item.page} +
+ + {item.status} + +
+ ))} +
+ + {result.failed === 0 && ( +
+

+ ✅ All documentation successfully synced to Gitbook! Your docs are now available at https://docs.aethex.tech +

+
+ )} + + + )} + + {/* Instructions */} + + + Setup Instructions + + +
+

Before syncing:

+
    +
  1. Verify Vercel environment variables are set: + GITBOOK_API_TOKEN + and + GITBOOK_SPACE_ID +
    2. +
  2. Ensure your Gitbook workspace "AeThex Docs" is ready
    3. +
  3. Have pages created in Gitbook (Overview, Getting Started, etc.)
    4. +
+
+ +
+

After syncing:

+
    +
  1. Verify content appears in Gitbook
    2. +
  2. Update internal links to point to Gitbook URLs
    3. +
  3. Keep local /docs routes as fallback during transition
    4. +
  4. Monitor analytics to track usage migration
    5. +
+
+ + +
+
+ + ); +}