download script

Dockerfile

@@ -54,10 +54,19 @@ COPY --from=builder /app/scripts ./scripts
 COPY --from=builder /app/node_modules ./node_modules
 COPY --from=builder /app/package.json ./package.json
 
+# Install Python and dependencies for tactical puzzles setup
+# Users can run: docker exec chess-tutor python3 scripts/setup_tactical_puzzles.py
+RUN apk add --no-cache python3 py3-pip zstd && \
+    pip3 install --break-system-packages python-chess
+
 # Copy entrypoint script and make executable
 COPY scripts/docker-entrypoint.sh /usr/local/bin/
 RUN chmod +x /usr/local/bin/docker-entrypoint.sh
 
+# Create directories for user-generated data
+RUN mkdir -p /app/fixtures/tactics /app/downloads && \
+    chown -R nextjs:nodejs /app/fixtures /app/downloads
+
 # Set ownership to non-root user
 RUN chown -R nextjs:nodejs /app
 

docker-compose.yml

@@ -24,6 +24,9 @@ services:
     volumes:
       # Persist Wikipedia cache to avoid re-fetching on container restart
       - wikipedia-cache:/app/public/wikipedia
+      # Persist tactical puzzles and downloads (user-generated data)
+      - tactical-fixtures:/app/fixtures
+      - puzzle-downloads:/app/downloads
 
     healthcheck:
       test: ["CMD", "node", "-e", "require('http').get('http://localhost:3050', (r) => {process.exit(r.statusCode === 200 ? 0 : 1)})"]
@@ -42,3 +45,7 @@ networks:
 volumes:
   wikipedia-cache:
     driver: local
+  tactical-fixtures:
+    driver: local
+  puzzle-downloads:
+    driver: local

src/app/imprint/page.tsx

@@ -5,7 +5,7 @@ import Footer from "@/components/Footer";
 // Force dynamic rendering to read environment variables at runtime
 export const dynamic = 'force-dynamic';
 
-export default function ImprintPage() {
+export default async function ImprintPage() {
     // If external imprint URL is configured, redirect to it
     const imprintUrl = process.env.IMPRINT_URL;
 

src/app/onboarding/page.tsx

@@ -16,6 +16,7 @@ export default function OnboardingPage() {
     const [apiKey, setApiKey] = useState("");
     const [mounted, setMounted] = useState(false);
     const [error, setError] = useState("");
+    const [consentGiven, setConsentGiven] = useState(false);
 
     useEffect(() => {
         const storedKey = localStorage.getItem("gemini_api_key");
@@ -63,6 +64,11 @@ export default function OnboardingPage() {
             return;
         }
 
+        if (!consentGiven) {
+            setError(t.onboarding.api.consentRequired);
+            return;
+        }
+
         localStorage.setItem("gemini_api_key", trimmed);
         localStorage.setItem("chess_tutor_language", language);
         router.push("/");
@@ -205,7 +211,22 @@ export default function OnboardingPage() {
                                         placeholder={t.onboarding.api.placeholder}
                                         className="w-full p-3 rounded-lg border dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none"
                                     />
-                                    {error && <p className="text-sm text-red-600">{error}</p>}
+
+                                    {/* Consent Checkbox */}
+                                    <div className="flex items-start gap-3 p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
+                                        <input
+                                            type="checkbox"
+                                            id="consent-checkbox"
+                                            checked={consentGiven}
+                                            onChange={(e) => setConsentGiven(e.target.checked)}
+                                            className="mt-1 w-4 h-4 text-blue-600 bg-white dark:bg-gray-700 border-gray-300 dark:border-gray-600 rounded focus:ring-2 focus:ring-blue-500"
+                                        />
+                                        <label htmlFor="consent-checkbox" className="text-sm text-gray-800 dark:text-gray-200 cursor-pointer">
+                                            {t.onboarding.api.consentLabel}
+                                        </label>
+                                    </div>
+
+                                    {error && <p className="text-sm text-red-600 dark:text-red-400 font-medium">{error}</p>}
                                     <div className="text-xs text-gray-600 dark:text-gray-400 space-y-1">
                                         <p>There is no such thing as a free lunch – LLM usage requires your own key.</p>
                                         <p>{t.onboarding.api.storage}</p>

src/app/settings/page.tsx

@@ -14,6 +14,8 @@ export default function SettingsPage() {
     const [chesscomUsername, setChesscomUsername] = useState("");
     const [lichessUsername, setLichessUsername] = useState("");
     const [mounted, setMounted] = useState(false);
+    const [consentGiven, setConsentGiven] = useState(false);
+    const [showConsentError, setShowConsentError] = useState(false);
 
     // Load settings on mount
     useEffect(() => {
@@ -22,7 +24,11 @@ export default function SettingsPage() {
         const storedChesscomUsername = localStorage.getItem("chesscom_username");
         const storedLichessUsername = localStorage.getItem("lichess_username");
 
-        if (storedKey) setApiKey(storedKey);
+        if (storedKey) {
+            setApiKey(storedKey);
+            // If there's already a stored key, consent was previously given
+            setConsentGiven(true);
+        }
         if (storedLang) setLanguage(storedLang as SupportedLanguage);
         if (storedChesscomUsername) setChesscomUsername(storedChesscomUsername);
         if (storedLichessUsername) setLichessUsername(storedLichessUsername);
@@ -33,6 +39,14 @@ export default function SettingsPage() {
     const t = useTranslation(language);
 
     const handleSave = () => {
+        // Check consent if API key is being set
+        if (apiKey.trim() && !consentGiven) {
+            setShowConsentError(true);
+            return;
+        }
+
+        setShowConsentError(false);
+
         if (apiKey.trim()) {
             localStorage.setItem("gemini_api_key", apiKey.trim());
         } else {
@@ -115,7 +129,7 @@ export default function SettingsPage() {
                                 <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                     {t.start.apiKey}
                                 </label>
-                                <div className="space-y-2">
+                                <div className="space-y-3">
                                     <input
                                         type="password"
                                         value={apiKey}
@@ -123,6 +137,27 @@ export default function SettingsPage() {
                                         placeholder={t.start.apiKeyPlaceholder}
                                         className="w-full p-3 border rounded-lg dark:bg-gray-700 dark:border-gray-600 text-gray-900 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
                                     />
+
+                                    {/* Consent Checkbox */}
+                                    <div className="flex items-start gap-3 p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
+                                        <input
+                                            type="checkbox"
+                                            id="settings-consent-checkbox"
+                                            checked={consentGiven}
+                                            onChange={(e) => setConsentGiven(e.target.checked)}
+                                            className="mt-1 w-4 h-4 text-blue-600 bg-white dark:bg-gray-700 border-gray-300 dark:border-gray-600 rounded focus:ring-2 focus:ring-blue-500"
+                                        />
+                                        <label htmlFor="settings-consent-checkbox" className="text-sm text-gray-800 dark:text-gray-200 cursor-pointer">
+                                            {t.onboarding.api.consentLabel}
+                                        </label>
+                                    </div>
+
+                                    {showConsentError && (
+                                        <p className="text-sm text-red-600 dark:text-red-400 font-medium">
+                                            {t.onboarding.api.consentRequired}
+                                        </p>
+                                    )}
+
                                     <p className="text-xs text-gray-500 dark:text-gray-400">
                                         {t.start.apiKeyRequired} <a href="https://aistudio.google.com/app/apikey" target="_blank" rel="noreferrer" className="text-blue-600 hover:underline">{t.start.getApiKey}</a>
                                     </p>

src/components/APIKeyInput.tsx

@@ -10,6 +10,8 @@ interface APIKeyInputProps {
 export function APIKeyInput({ onKeySubmit }: APIKeyInputProps) {
     const [key, setKey] = useState("");
     const [isOpen, setIsOpen] = useState(false);
+    const [consentGiven, setConsentGiven] = useState(false);
+    const [error, setError] = useState("");
 
     useEffect(() => {
         const envKey = process.env.NEXT_PUBLIC_GEMINI_API_KEY;
@@ -26,11 +28,21 @@ export function APIKeyInput({ onKeySubmit }: APIKeyInputProps) {
 
     const handleSubmit = (e: React.FormEvent) => {
         e.preventDefault();
-        if (key.trim()) {
+
+        if (!key.trim()) {
+            setError("API key is required");
+            return;
+        }
+
+        if (!consentGiven) {
+            setError("You must agree to store the API key in local storage to continue");
+            return;
+        }
+
         localStorage.setItem("gemini_api_key", key.trim());
         onKeySubmit(key.trim());
         setIsOpen(false);
-        }
+        setError("");
     };
 
     if (!isOpen) {
@@ -62,6 +74,27 @@ export function APIKeyInput({ onKeySubmit }: APIKeyInputProps) {
                         className="w-full p-2 border rounded dark:bg-gray-700 dark:border-gray-600"
                         required
                     />
+
+                    {/* Consent Checkbox */}
+                    <div className="flex items-start gap-3 p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
+                        <input
+                            type="checkbox"
+                            id="api-key-consent-checkbox"
+                            checked={consentGiven}
+                            onChange={(e) => setConsentGiven(e.target.checked)}
+                            className="mt-0.5 w-4 h-4 text-blue-600 bg-white dark:bg-gray-700 border-gray-300 dark:border-gray-600 rounded focus:ring-2 focus:ring-blue-500"
+                        />
+                        <label htmlFor="api-key-consent-checkbox" className="text-xs text-gray-800 dark:text-gray-200 cursor-pointer">
+                            I understand and agree that my API key will be stored in my browser's local storage
+                        </label>
+                    </div>
+
+                    {error && (
+                        <p className="text-sm text-red-600 dark:text-red-400 font-medium">
+                            {error}
+                        </p>
+                    )}
+
                     <div className="flex justify-end gap-2">
                         <button
                             type="button"

src/lib/i18n/translations.ts

@@ -177,6 +177,8 @@ export interface Translations {
             costNote: string;
             privacy: string;
             getKey: string;
+            consentLabel: string;
+            consentRequired: string;
         };
         actions: {
             next: string;
@@ -400,6 +402,8 @@ const en: Translations = {
             costNote: 'LLM tokens are billed by Google, so you control the usage.',
             privacy: 'We never use your key for anything outside this tutor.',
             getKey: 'Get a free Gemini API key',
+            consentLabel: 'I understand and agree that my API key will be stored in my browser\'s local storage',
+            consentRequired: 'You must agree to store the API key in local storage to continue',
         },
         actions: {
             next: 'Next',
@@ -621,6 +625,8 @@ const de: Translations = {
             costNote: 'LLM-Tokens werden von Google abgerechnet – du behältst die Kontrolle.',
             privacy: 'Wir nutzen deinen Schlüssel ausschließlich für diesen Tutor.',
             getKey: 'Kostenlosen Gemini-Schlüssel holen',
+            consentLabel: 'Ich verstehe und stimme zu, dass mein API-Schlüssel im lokalen Speicher meines Browsers gespeichert wird',
+            consentRequired: 'Du musst der Speicherung des API-Schlüssels im lokalen Speicher zustimmen, um fortzufahren',
         },
         actions: {
             next: 'Weiter',
@@ -842,6 +848,8 @@ const fr: Translations = {
             costNote: 'Les jetons LLM sont facturés par Google, vous gardez le contrôle.',
             privacy: 'Nous n’utilisons votre clé que pour ce tuteur.',
             getKey: 'Obtenir une clé Gemini gratuite',
+            consentLabel: 'Je comprends et j\'accepte que ma clé API soit stockée dans le stockage local de mon navigateur',
+            consentRequired: 'Vous devez accepter le stockage de la clé API dans le stockage local pour continuer',
         },
         actions: {
             next: 'Suivant',
@@ -1063,6 +1071,8 @@ const it: Translations = {
             costNote: 'I token LLM sono fatturati da Google, quindi hai tu il controllo.',
             privacy: 'Usiamo la tua chiave solo per questo tutor.',
             getKey: 'Ottieni una chiave Gemini gratuita',
+            consentLabel: 'Comprendo e accetto che la mia chiave API verrà memorizzata nel local storage del mio browser',
+            consentRequired: 'Devi accettare la memorizzazione della chiave API nel local storage per continuare',
         },
         actions: {
             next: 'Avanti',
@@ -1284,6 +1294,8 @@ const pl: Translations = {
             costNote: 'Tokeny LLM są rozliczane przez Google, więc masz kontrolę nad zużyciem.',
             privacy: 'Nigdy nie używamy twojego klucza do niczego poza tym trenerem.',
             getKey: 'Zdobądź darmowy klucz Gemini',
+            consentLabel: 'Rozumiem i zgadzam się, że mój klucz API będzie przechowywany w pamięci lokalnej mojej przeglądarki',
+            consentRequired: 'Musisz wyrazić zgodę na przechowywanie klucza API w pamięci lokalnej, aby kontynuować',
         },
         actions: {
             next: 'Dalej',