Initial scaffold: AI Tycoon monorepo with core game loop

Turborepo monorepo with three packages: - packages/shared: TypeScript types for all 14 game systems + balance constants + formatting utils - packages/game-engine: Pure TS simulation engine with tick processor, economy, infrastructure, compute, research, market, and reputation systems - apps/web: React + Vite + Tailwind + Zustand frontend with sidebar dashboard layout, new game screen, dashboard with charts, infrastructure management, and model training pages Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-24 16:53:46 -04:00
commit fdc8e544ae
57 changed files with 4753 additions and 0 deletions
@@ -0,0 +1,81 @@
+import { useState } from 'react';
+import { Sparkles } from 'lucide-react';
+import { useGameStore } from '@/store';
+
+const SUGGESTED_NAMES = [
+  'Nexus AI', 'Cortex Labs', 'Synapse Technologies',
+  'Prometheus AI', 'Athena Research', 'Cognitron',
+  'Neural Forge', 'DeepMind+', 'Cerebral Systems',
+];
+
+export function NewGameScreen() {
+  const [name, setName] = useState('');
+  const startNewGame = useGameStore((s) => s.startNewGame);
+
+  const handleStart = () => {
+    const companyName = name.trim() || SUGGESTED_NAMES[Math.floor(Math.random() * SUGGESTED_NAMES.length)];
+    startNewGame(companyName);
+  };
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-surface-950 to-surface-900">
+      <div className="max-w-md w-full mx-4">
+        <div className="text-center mb-8">
+          <div className="inline-flex items-center gap-2 mb-4">
+            <Sparkles className="text-accent-light" size={32} />
+            <h1 className="text-4xl font-bold bg-gradient-to-r from-accent-light to-accent bg-clip-text text-transparent">
+              AI Tycoon
+            </h1>
+          </div>
+          <p className="text-surface-400 text-sm">
+            Build the world's most powerful AI company. From startup to AGI.
+          </p>
+        </div>
+
+        <div className="bg-surface-900 border border-surface-700 rounded-xl p-6 space-y-6">
+          <div>
+            <label className="block text-sm font-medium text-surface-300 mb-2">
+              Name your AI company
+            </label>
+            <input
+              type="text"
+              value={name}
+              onChange={(e) => setName(e.target.value)}
+              onKeyDown={(e) => e.key === 'Enter' && handleStart()}
+              placeholder={SUGGESTED_NAMES[0]}
+              className="w-full bg-surface-800 border border-surface-600 rounded-lg px-4 py-3 text-surface-100 placeholder:text-surface-500 focus:outline-none focus:ring-2 focus:ring-accent/50 focus:border-accent"
+              autoFocus
+              maxLength={30}
+            />
+          </div>
+
+          <div>
+            <p className="text-xs text-surface-500 mb-2">Or pick one:</p>
+            <div className="flex flex-wrap gap-2">
+              {SUGGESTED_NAMES.slice(0, 6).map((suggestion) => (
+                <button
+                  key={suggestion}
+                  onClick={() => setName(suggestion)}
+                  className="text-xs px-3 py-1.5 rounded-full bg-surface-800 text-surface-300 hover:bg-surface-700 hover:text-surface-100 transition-colors border border-surface-700"
+                >
+                  {suggestion}
+                </button>
+              ))}
+            </div>
+          </div>
+
+          <button
+            onClick={handleStart}
+            className="w-full bg-accent hover:bg-accent-dark text-white font-semibold py-3 rounded-lg transition-colors"
+          >
+            Found Your Company
+          </button>
+        </div>
+
+        <p className="text-center text-xs text-surface-600 mt-6">
+          Manage data centers, train models, serve millions of users, and achieve AGI.
+        </p>
+      </div>
+    </div>
+  );
+}