ailock
Version:
AI-Proof File Guard - Protect sensitive files from accidental AI modifications
152 lines • 15.7 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState, useEffect } from 'react';
import { Box, Text, Spacer, Newline } from 'ink';
import Spinner from 'ink-spinner';
import chalk from 'chalk';
import { DemoService } from '../../services/DemoService.js';
export const DemoPresentation = ({ mode, simulateOnly, cleanupAfter, onComplete, onCancel }) => {
const [step, setStep] = useState('intro');
const [demoService] = useState(new DemoService());
const [metrics, setMetrics] = useState(null);
const [loading, setLoading] = useState(false);
const [currentMessage, setCurrentMessage] = useState('');
const [autoProgress, setAutoProgress] = useState(true);
// Step timing for different modes
const stepTiming = mode === 'quick' ? 2000 : 3000;
const messageTiming = mode === 'quick' ? 1000 : 1500;
// Auto-progress through steps
useEffect(() => {
if (!autoProgress)
return;
const timer = setTimeout(() => {
handleNextStep();
}, stepTiming);
return () => clearTimeout(timer);
}, [step, autoProgress]);
// Handle keyboard input for manual control
useEffect(() => {
const handleInput = (input) => {
const key = input.toString();
if (key === '\u0003') { // Ctrl+C
onCancel();
}
else if (key === ' ' || key === '\r') {
setAutoProgress(false);
handleNextStep();
}
else if (key === 'r') {
setAutoProgress(true);
}
};
// Check if setRawMode is available (might not be in all environments)
if (process.stdin.setRawMode && typeof process.stdin.setRawMode === 'function') {
try {
process.stdin.setRawMode(true);
process.stdin.on('data', handleInput);
return () => {
if (process.stdin.setRawMode) {
process.stdin.setRawMode(false);
}
process.stdin.removeListener('data', handleInput);
};
}
catch (error) {
// Ignore if raw mode is not available
}
}
}, []);
const handleNextStep = async () => {
setLoading(true);
try {
switch (step) {
case 'intro':
setStep('problem-setup');
break;
case 'problem-setup':
setStep('creating-files');
break;
case 'creating-files':
if (!simulateOnly) {
const scenario = demoService.getDemoScenarios()[0];
const demoMetrics = await demoService.createDemoEnvironment(scenario);
setMetrics(demoMetrics);
}
setStep('vulnerability-demo');
break;
case 'vulnerability-demo':
setStep('solution-deploy');
break;
case 'solution-deploy':
if (!simulateOnly) {
const protectionMetrics = await demoService.demonstrateProtection();
setMetrics(prev => ({ ...prev, ...protectionMetrics }));
}
setStep('protection-demo');
break;
case 'protection-demo':
setStep('ai-simulation');
break;
case 'ai-simulation':
setStep(mode === 'quick' ? 'call-to-action' : 'enterprise-features');
break;
case 'enterprise-features':
setStep('metrics-reveal');
break;
case 'metrics-reveal':
setStep('call-to-action');
break;
case 'call-to-action':
if (cleanupAfter) {
setStep('cleanup');
}
else {
onComplete();
}
break;
case 'cleanup':
if (!simulateOnly) {
await demoService.cleanup();
}
onComplete();
break;
}
}
catch (error) {
console.error('Demo error:', error);
}
finally {
setLoading(false);
}
};
const renderStep = () => {
switch (step) {
case 'intro':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.blue.bold('🎬 The AILock Demo - For Every Developer') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.gray('You know this feeling...') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('🚀 You\'re coding with your AI assistant') }), _jsx(Text, { children: chalk.gray(' → Cursor helping with refactoring') }), _jsx(Text, { children: chalk.gray(' → Copilot suggesting optimizations') }), _jsx(Text, { children: chalk.gray(' → Claude improving your functions') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.red.bold('💥 Until your AI touches the wrong file') })] }));
case 'problem-setup':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.red.bold('😱 Every Developer\'s Worst Nightmare') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white.bold('Yesterday, 3:47 PM:') }), _jsx(Text, { children: chalk.gray(' "Hey Cursor, refactor this authentication logic"') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.red('💥 Cursor rewrites your .env file') }), _jsx(Text, { children: chalk.gray(' → Local environment completely broken') }), _jsx(Text, { children: chalk.gray(' → 3 hours debugging mysterious errors') }), _jsx(Text, { children: chalk.gray(' → Your production keys are now in git history') }), _jsx(Text, { children: chalk.gray(' → Weekend ruined, pull request delayed') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('🤖 Every AI assistant can do this to you RIGHT NOW') })] }));
case 'creating-files':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.cyan.bold('🛠️ Demo Setup - Creating Realistic Vulnerable Environment') }), _jsx(Newline, {}), loading && (_jsxs(Box, { children: [_jsx(Spinner, { type: "dots" }), _jsx(Text, { children: " Creating production-like files with real vulnerabilities..." })] })), !loading && (_jsxs(_Fragment, { children: [_jsx(Text, { children: chalk.green('✅ Created production .env with real API keys') }), _jsx(Text, { children: chalk.green('✅ Database config with production credentials') }), _jsx(Text, { children: chalk.green('✅ SSL private keys and certificates') }), _jsx(Text, { children: chalk.green('✅ Git repository initialized') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('⚠️ Environment is now HIGHLY vulnerable to AI modifications') })] }))] }));
case 'vulnerability-demo':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.red.bold('⚠️ The Files You Never Want AI To Touch') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white('Your AI is super helpful, but sometimes too helpful:') }), _jsx(Text, { children: chalk.gray(' "Let me clean up those config files..."') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.red('🎯 These files are accident magnets:') }), _jsx(Text, { children: chalk.gray(' 📄 .env (your API keys, DB passwords)') }), _jsx(Text, { children: chalk.gray(' 🗄️ database.json (connection strings)') }), _jsx(Text, { children: chalk.gray(' 🔐 server.key (SSL certificates)') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('😰 Right now, AI assistants can modify these freely') }), _jsx(Text, { children: chalk.red(' → They read everything for "context"') }), _jsx(Text, { children: chalk.red(' → One accidental edit breaks everything') })] }));
case 'solution-deploy':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.blue.bold('🚀 AILock - Your AI Safety Net') }), _jsx(Newline, {}), loading && (_jsxs(Box, { children: [_jsx(Spinner, { type: "dots" }), _jsx(Text, { children: " Setting up your protection..." })] })), !loading && (_jsxs(_Fragment, { children: [_jsx(Text, { children: chalk.green.bold('⚡ ONE COMMAND - INSTANT PEACE OF MIND:') }), _jsx(Text, { children: chalk.white(' $ ailock init') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.green('✅ Platform detected: ' + (metrics?.platformDetected || 'Unix')) }), _jsx(Text, { children: chalk.green('✅ Smart .env and config detection') }), _jsx(Text, { children: chalk.green('✅ Files protected with OS permissions') }), _jsx(Text, { children: chalk.green('✅ Git hooks prevent accidents') }), _jsx(Text, { children: chalk.green('✅ AI can still read for context') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.cyan.bold('🛡️ Your sensitive files are now AI-proof!') })] }))] }));
case 'protection-demo':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.green.bold('🔒 Protection in Action - Live Demo') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white.bold('File status after protection:') }), _jsx(Text, { children: chalk.green(' 🔒 .env → READ ONLY (AI can read, cannot write)') }), _jsx(Text, { children: chalk.green(' 🔒 database.json → IMMUTABLE (OS-level protection)') }), _jsx(Text, { children: chalk.green(' 🔒 server.key → LOCKED (cryptographic security)') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.blue.bold('💡 The Magic:') }), _jsx(Text, { children: chalk.gray(' ✓ AI assistants can READ for context') }), _jsx(Text, { children: chalk.gray(' ✗ AI assistants CANNOT modify') }), _jsx(Text, { children: chalk.gray(' ✓ You maintain full control') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('⚡ Protection time: ' + (metrics?.protectionTime || 0) + 'ms') })] }));
case 'ai-simulation':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.magenta.bold('🤖 Real AI Modification Attempt - Live Test') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white('Simulating what just happened to your colleague...') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.red('🎯 Cursor tries to "help" by modifying .env:') }), _jsx(Text, { children: chalk.gray(' → writeFile(\'.env\', \'# Updated configuration...\')') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.green.bold('🛡️ BLOCKED! Permission denied') }), _jsx(Text, { children: chalk.green(' ✅ Your .env file stays untouched') }), _jsx(Text, { children: chalk.green(' ✅ Your weekend stays intact') }), _jsx(Text, { children: chalk.green(' ✅ Your secrets never hit git') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.cyan.bold('🎉 Crisis averted! Your future self thanks you') })] }));
case 'enterprise-features':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.blue.bold('🏢 Enterprise-Grade Architecture') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white.bold('Cross-Platform Sophistication:') }), _jsx(Text, { children: chalk.green(' 🐧 Linux: chmod + chattr (immutable attributes)') }), _jsx(Text, { children: chalk.green(' 🍎 macOS: chmod + chflags (user immutable)') }), _jsx(Text, { children: chalk.green(' 🪟 Windows: attrib + icacls (ACL manipulation)') }), _jsx(Text, { children: chalk.green(' 🔧 WSL: Specialized hybrid adapter') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white.bold('Security Architecture:') }), _jsx(Text, { children: chalk.gray(' → 4 specialized security modules') }), _jsx(Text, { children: chalk.gray(' → 2,077 lines of security code') }), _jsx(Text, { children: chalk.gray(' → Atomic file operations with rollback') }), _jsx(Text, { children: chalk.gray(' → Shell injection prevention') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.cyan.bold('🚀 This is not a toy - this is enterprise-grade software') })] }));
case 'metrics-reveal':
const viralMetrics = demoService.getViralMetrics();
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.yellow.bold('📊 Why Developers Love AILock') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.green.bold('⚡ Developer Experience:') }), _jsx(Text, { children: chalk.white(' Protection time: ' + viralMetrics.timeToProtect) }), _jsx(Text, { children: chalk.white(' Supported platforms: ' + viralMetrics.platformsCovered) }), _jsx(Text, { children: chalk.white(' Setup complexity: Zero config needed') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.blue.bold('🎯 Real Impact:') }), _jsx(Text, { children: chalk.green(' 😌 Sleep better knowing your .env is safe') }), _jsx(Text, { children: chalk.green(' 🏃 No more "oh shit" moments with AI') }), _jsx(Text, { children: chalk.green(' ⏱️ Setup time: 15 seconds (seriously)') }), _jsx(Text, { children: chalk.green(' 🤝 AI still helps you, just safely') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.cyan.bold('💯 "Finally, AI that respects boundaries"') })] }));
case 'call-to-action':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.yellow.bold('🎉 DEMO COMPLETE - Your Future Self Will Thank You') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.green.bold('🚀 Ready to never worry about AI accidents again?') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.white.bold('Get protected in 2 commands:') }), _jsx(Text, { children: chalk.cyan(' 1. ') + chalk.white('npm install -g ailock') }), _jsx(Text, { children: chalk.cyan(' 2. ') + chalk.white('ailock init') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.yellow.bold('📱 Share with your dev friends:') }), _jsx(Text, { children: chalk.white(' "Dude, check this out: ') + chalk.cyan('ailock demo') + chalk.white('"') }), _jsx(Text, { children: chalk.gray(' "Finally, AI that can\'t break my .env"') }), _jsx(Newline, {}), _jsx(Text, { children: chalk.magenta.bold('🛡️ Code safely with AI. Sleep soundly at night.') })] }));
case 'cleanup':
return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: chalk.blue.bold('🧹 Demo Cleanup') }), _jsx(Newline, {}), loading && (_jsxs(Box, { children: [_jsx(Spinner, { type: "dots" }), _jsx(Text, { children: " Cleaning up demo files..." })] })), !loading && (_jsx(Text, { children: chalk.green('✅ Demo environment cleaned up') }))] }));
default:
return _jsx(Text, { children: "Unknown step" });
}
};
return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [renderStep(), _jsx(Newline, {}), _jsxs(Box, { children: [_jsx(Text, { children: chalk.gray('Controls: ') }), _jsx(Text, { children: chalk.gray('Space/Enter: Next • R: Resume Auto • Ctrl+C: Exit') }), _jsx(Spacer, {}), _jsx(Text, { children: chalk.gray(`Mode: ${mode} • Step: ${step}`) })] })] }));
};
//# sourceMappingURL=DemoPresentation.js.map