feat(pitch-deck): add passwordless investor auth, audit logs, snapshots & PWA

Implement a complete investor access system for the pitch deck:

- Passwordless magic link auth (jose JWT + nodemailer SMTP)
- Per-investor audit logging (slide views, assumption changes, chat)
- Financial model snapshot persistence (auto-save/restore per investor)
- PWA support (manifest, service worker, offline caching, icons)
- Security safeguards (watermark overlay, rate limiting, anti-scraping
  headers, content protection, single-session enforcement)
- Admin API for invite/revoke/audit-log management
- Integrated into docker-compose.coolify.yml for production deployment

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Sharang Parnerkar
2026-04-05 09:37:50 +02:00
parent 3a2567b44d
commit 244071d63b
35 changed files with 4232 additions and 14 deletions

View File

@@ -0,0 +1,57 @@
'use client'
import { motion } from 'framer-motion'
export default function AuthPage() {
return (
<div className="h-screen flex items-center justify-center bg-[#0a0a1a] relative overflow-hidden">
{/* Background gradient */}
<div className="absolute inset-0 bg-gradient-to-br from-indigo-950/30 via-transparent to-purple-950/20" />
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="relative z-10 text-center max-w-md mx-auto px-6"
>
<div className="mb-8">
<h1 className="text-3xl font-bold bg-gradient-to-r from-indigo-400 to-purple-400 bg-clip-text text-transparent mb-2">
BreakPilot ComplAI
</h1>
<p className="text-white/30 text-sm">Investor Pitch Deck</p>
</div>
<div className="bg-white/[0.03] border border-white/[0.06] rounded-2xl p-8 backdrop-blur-sm">
<div className="w-16 h-16 mx-auto mb-6 rounded-full bg-indigo-500/10 flex items-center justify-center">
<svg className="w-8 h-8 text-indigo-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5}
d="M21.75 9v.906a2.25 2.25 0 01-1.183 1.981l-6.478 3.488M2.25 9v.906a2.25 2.25 0 001.183 1.981l6.478 3.488m8.839 2.51l-4.66-2.51m0 0l-1.023-.55a2.25 2.25 0 00-2.134 0l-1.022.55m0 0l-4.661 2.51m16.5-1.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75A2.25 2.25 0 014.5 4.5h15a2.25 2.25 0 012.25 2.25v11.25z" />
</svg>
</div>
<h2 className="text-xl font-semibold text-white/90 mb-3">
Invitation Required
</h2>
<p className="text-white/50 text-sm leading-relaxed mb-6">
This interactive pitch deck is available by invitation only.
Please check your email for an access link.
</p>
<div className="border-t border-white/[0.06] pt-5">
<p className="text-white/30 text-xs">
Questions? Contact us at{' '}
<a href="mailto:pitch@breakpilot.ai" className="text-indigo-400/80 hover:text-indigo-400 transition-colors">
pitch@breakpilot.ai
</a>
</p>
</div>
</div>
<p className="mt-6 text-white/20 text-xs">
We are an AI-first company. No PDFs. No slide decks. Just code.
</p>
</motion.div>
</div>
)
}

View File

@@ -0,0 +1,112 @@
'use client'
import { Suspense, useEffect, useState } from 'react'
import { useSearchParams, useRouter } from 'next/navigation'
import { motion } from 'framer-motion'
function VerifyContent() {
const searchParams = useSearchParams()
const router = useRouter()
const token = searchParams.get('token')
const [status, setStatus] = useState<'verifying' | 'success' | 'error'>('verifying')
const [errorMsg, setErrorMsg] = useState('')
useEffect(() => {
if (!token) {
setStatus('error')
setErrorMsg('No access token provided.')
return
}
async function verify() {
try {
const res = await fetch('/api/auth/verify', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token }),
})
if (res.ok) {
setStatus('success')
setTimeout(() => router.push('/'), 1000)
} else {
const data = await res.json()
setStatus('error')
setErrorMsg(data.error || 'Verification failed.')
}
} catch {
setStatus('error')
setErrorMsg('Network error. Please try again.')
}
}
verify()
}, [token, router])
return (
<motion.div
initial={{ opacity: 0, scale: 0.95 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.4 }}
className="relative z-10 text-center max-w-md mx-auto px-6"
>
<div className="bg-white/[0.03] border border-white/[0.06] rounded-2xl p-8 backdrop-blur-sm">
{status === 'verifying' && (
<>
<div className="w-12 h-12 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin mx-auto mb-4" />
<p className="text-white/60">Verifying your access link...</p>
</>
)}
{status === 'success' && (
<>
<div className="w-16 h-16 mx-auto mb-4 rounded-full bg-green-500/10 flex items-center justify-center">
<svg className="w-8 h-8 text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
</svg>
</div>
<p className="text-white/80 font-medium">Access verified!</p>
<p className="text-white/40 text-sm mt-2">Redirecting to pitch deck...</p>
</>
)}
{status === 'error' && (
<>
<div className="w-16 h-16 mx-auto mb-4 rounded-full bg-red-500/10 flex items-center justify-center">
<svg className="w-8 h-8 text-red-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
</svg>
</div>
<p className="text-white/80 font-medium mb-2">Access Denied</p>
<p className="text-white/50 text-sm">{errorMsg}</p>
<a
href="/auth"
className="inline-block mt-6 text-indigo-400 text-sm hover:text-indigo-300 transition-colors"
>
Back to login
</a>
</>
)}
</div>
</motion.div>
)
}
export default function VerifyPage() {
return (
<div className="h-screen flex items-center justify-center bg-[#0a0a1a] relative overflow-hidden">
<div className="absolute inset-0 bg-gradient-to-br from-indigo-950/30 via-transparent to-purple-950/20" />
<Suspense
fallback={
<div className="relative z-10 text-center">
<div className="w-12 h-12 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin mx-auto mb-4" />
<p className="text-white/60">Loading...</p>
</div>
}
>
<VerifyContent />
</Suspense>
</div>
)
}