poprawki po crashu

App.tsx

@@ -9,27 +9,17 @@ import StepDetails from './components/StepDetails';
 import StepResult from './components/StepResult';
 import { ChevronLeft, ExternalLink, Sparkles, User, Lock, ArrowRight, AlertCircle, Bug } from 'lucide-react';
 import { generateStoryContent } from './services/geminiService';
+import { getEnvVar } from './utils/envUtils';
 
 const STORAGE_KEY = 'gpx-storyteller-state-v6'; // Incremented version for structure change
 const AUTH_KEY = 'promptstory-auth-token';
 
 // --- PASSWORD CONFIGURATION ---
-
-// 1. Try fetching from Vite standard (import.meta.env)
-// @ts-ignore
-const VITE_ENV_PASS = import.meta.env && import.meta.env.VITE_APP_PASSWORD ? import.meta.env.VITE_APP_PASSWORD : '';
-
-// 2. Try fetching from Process env (sometimes used in other build tools)
-// @ts-ignore
-const PROCESS_ENV_PASS = (typeof process !== 'undefined' && process.env && process.env.VITE_APP_PASSWORD) ? process.env.VITE_APP_PASSWORD : '';
-
-// 3. Fallback (Hardcoded safety net)
-// W tym środowisku (AI Studio/Web Preview) restart serwera jest trudny.
-// Ustawiamy hasło "na sztywno" jako zapas, żeby działało od razu.
-const FALLBACK_PASS = 'Prometeusz'; 
+const ENV_PASSWORD = getEnvVar('VITE_APP_PASSWORD');
+// Fallback Hardcoded Password (Safety net)
+const FALLBACK_PASS = 'Preorder$Disinfect6$Childlike$Unnamed'; 
 
 // Decision Logic
-const ENV_PASSWORD = VITE_ENV_PASS || PROCESS_ENV_PASS;
 const APP_PASSWORD = ENV_PASSWORD || FALLBACK_PASS;
 const IS_USING_FALLBACK = !ENV_PASSWORD;
 
@@ -68,10 +58,9 @@ const LoginScreen: React.FC<{ onLogin: (success: boolean) => void }> = ({ onLogi
     // DEBUGGING: Log to console on mount
     useEffect(() => {
         console.group("--- DEBUG PASSWORD SYSTEM ---");
-        console.log("1. Detected VITE_ENV:", VITE_ENV_PASS ? "****" : "(empty)");
-        console.log("2. Detected PROCESS_ENV:", PROCESS_ENV_PASS ? "****" : "(empty)");
-        console.log("3. Final Password Source:", IS_USING_FALLBACK ? "FALLBACK (Hardcoded)" : ".ENV FILE");
-        console.log("4. Active Password Length:", APP_PASSWORD.length);
+        console.log("1. Detected ENV Variable:", ENV_PASSWORD ? "****" : "(empty)");
+        console.log("2. Final Password Source:", IS_USING_FALLBACK ? "FALLBACK (Code)" : ".ENV FILE");
+        console.log("3. Active Password Length:", APP_PASSWORD.length);
         console.groupEnd();
     }, []);
 
@@ -163,8 +152,7 @@ const LoginScreen: React.FC<{ onLogin: (success: boolean) => void }> = ({ onLogi
                         
                         {IS_USING_FALLBACK && (
                             <div className="mt-3 text-yellow-500 border-t border-gray-600 pt-2">
-                                <p>System używa hasła awaryjnego zdefiniowanego w kodzie, ponieważ nie może odświeżyć pliku .env bez restartu.</p>
-                                <p className="mt-1 font-bold text-white">Twoje hasło powinno teraz działać.</p>
+                                <p>System używa hasła awaryjnego zdefiniowanego w kodzie.</p>
                             </div>
                         )}
                     </div>
@@ -279,9 +267,11 @@ const App: React.FC = () => {
     setIsGenerating(true);
     setErrorMessage(null);
     try {
+      // SAFE ENV ACCESS
+      const apiKey = getEnvVar('API_KEY');
       const content = await generateStoryContent(
         data, 
-        process.env.API_KEY || ''
+        apiKey || ''
       );
       
       setGeneratedContent(content);
@@ -298,9 +288,11 @@ const App: React.FC = () => {
     setIsGenerating(true);
     setErrorMessage(null);
     try {
+      // SAFE ENV ACCESS
+      const apiKey = getEnvVar('API_KEY');
       const content = await generateStoryContent(
         data, 
-        process.env.API_KEY || '',
+        apiKey || '',
         { slideCount, feedback }
       );
       
@@ -495,4 +487,4 @@ const App: React.FC = () => {
   );
 };
 
-export default App;
+export default App;

components/StepDetails.tsx

@@ -3,6 +3,7 @@ import React, { useRef, useState, useEffect } from 'react';
 import { WizardState } from '../types';
 import { UploadCloud, FileText, X, Image as ImageIcon, Sparkles, Loader2, MapPin, Navigation, Plus, Trash2, Flag, Target, AlertCircle, CheckCircle2, Car, Footprints } from 'lucide-react';
 import { processFile } from '../utils/fileUtils';
+import { getEnvVar } from '../utils/envUtils';
 
 // --- HELPER COMPONENT: PLACE AUTOCOMPLETE INPUT (WIDGET VERSION) ---
 interface PlaceAutocompleteInputProps {
@@ -105,16 +106,20 @@ const StepDetails: React.FC<StepDetailsProps> = ({ data, updateData, onGenerate,
 
   const getEffectiveKey = () => {
     if (data.tripData?.googleMapsKey) return data.tripData.googleMapsKey;
-    // @ts-ignore
-    if (import.meta.env && import.meta.env.VITE_GOOGLE_MAPS_KEY) return import.meta.env.VITE_GOOGLE_MAPS_KEY;
-    if (process.env.GOOGLE_MAPS_KEY) return process.env.GOOGLE_MAPS_KEY;
+    
+    const viteKey = getEnvVar('VITE_GOOGLE_MAPS_KEY');
+    if (viteKey) return viteKey;
+
+    const procKey = getEnvVar('GOOGLE_MAPS_KEY');
+    if (procKey) return procKey;
+
     return AUTO_PASTE_KEY;
   };
 
   const effectiveKey = getEffectiveKey();
-  const isEnvKeyMissing = !process.env.GOOGLE_MAPS_KEY && 
-                          // @ts-ignore
-                          !import.meta.env?.VITE_GOOGLE_MAPS_KEY &&
+  
+  const isEnvKeyMissing = !getEnvVar('GOOGLE_MAPS_KEY') && 
+                          !getEnvVar('VITE_GOOGLE_MAPS_KEY') &&
                           data.tripData?.googleMapsKey !== AUTO_PASTE_KEY;
 
   // --- GOOGLE MAPS LOADING ---
@@ -578,4 +583,4 @@ const StepDetails: React.FC<StepDetailsProps> = ({ data, updateData, onGenerate,
   );
 };
 
-export default StepDetails;
+export default StepDetails;

components/TripMap.tsx

@@ -3,6 +3,7 @@ import React, { useRef, useState, useEffect } from 'react';
 import { TripData } from '../types';
 import { Download, Map as MapIcon, AlertTriangle, ImageOff, Loader2, Navigation, RefreshCw } from 'lucide-react';
 import html2canvas from 'html2canvas';
+import { getEnvVar } from '../utils/envUtils';
 
 interface TripMapProps {
   tripData: TripData;
@@ -26,14 +27,12 @@ const TripMap: React.FC<TripMapProps> = ({ tripData }) => {
     if (tripData.googleMapsKey) return tripData.googleMapsKey;
     
     // 2. Check Vite env
-    // @ts-ignore
-    if (import.meta.env && import.meta.env.VITE_GOOGLE_MAPS_KEY) {
-        // @ts-ignore
-        return import.meta.env.VITE_GOOGLE_MAPS_KEY;
-    }
+    const viteKey = getEnvVar('VITE_GOOGLE_MAPS_KEY');
+    if (viteKey) return viteKey;
     
     // 3. Check Standard process.env
-    if (process.env.GOOGLE_MAPS_KEY) return process.env.GOOGLE_MAPS_KEY;
+    const procKey = getEnvVar('GOOGLE_MAPS_KEY');
+    if (procKey) return procKey;
     
     // 4. Fallback
     return AUTO_PASTE_KEY;
@@ -328,4 +327,4 @@ const TripMap: React.FC<TripMapProps> = ({ tripData }) => {
   );
 };
 
-export default TripMap;
+export default TripMap;

untitled.tsx

@@ -0,0 +1 @@
+// This file was created by mistake and is now cleared.

utils/envUtils.ts

@@ -0,0 +1,28 @@
+
+/**
+ * Safely retrieves environment variables in both Vite (browser) and Node environments.
+ * Prevents "ReferenceError: process is not defined" crashes in production builds.
+ */
+export const getEnvVar = (key: string): string => {
+  // 1. Try Vite / Modern Browser approach (import.meta.env)
+  try {
+    // @ts-ignore
+    if (typeof import.meta !== 'undefined' && import.meta.env && import.meta.env[key]) {
+      // @ts-ignore
+      return import.meta.env[key];
+    }
+  } catch (e) {
+    // Ignore errors if import.meta is not supported
+  }
+
+  // 2. Try Node / Webpack / Polyfilled approach (process.env)
+  try {
+    if (typeof process !== 'undefined' && process.env && process.env[key]) {
+      return process.env[key] || '';
+    }
+  } catch (e) {
+    // Ignore errors if process is not defined
+  }
+
+  return '';
+};