Update src/components/ResultView.tsx

src/components/ResultView.tsx

@@ -32,7 +32,7 @@ const ResultView: React.FC<ResultViewProps> = ({
       setProgressStep(0);
       const interval = setInterval(() => {
         setProgressStep(prev => (prev < 3 ? prev + 1 : prev));
-      }, 1500);
+      }, 2000);
       return () => clearInterval(interval);
     }
   }, [loading]);
@@ -50,10 +50,10 @@ const ResultView: React.FC<ResultViewProps> = ({
   }, [retryAfter]);
 
   const loadingTexts = [
-    "Resizing to atomic scale...",
-    "Injecting garments...",
-    "Re-lighting scene...",
-    "Finalizing pixels..."
+    "Encoding micro-pixels...",
+    "Analyzing garment...",
+    "Synthesizing fit...",
+    "Almost there..."
   ];
 
   return (
@@ -62,7 +62,7 @@ const ResultView: React.FC<ResultViewProps> = ({
         
         {/* Sidebar Preview */}
         <div className="w-full md:w-1/3 bg-white p-3 rounded-2xl shadow-sm border border-gray-100 flex flex-col gap-2">
-             <h3 className="text-xs font-bold text-gray-400 uppercase tracking-widest px-1">Source Photo</h3>
+             <h3 className="text-xs font-bold text-gray-400 uppercase tracking-widest px-1">Source</h3>
              <div className="aspect-[3/4] rounded-xl overflow-hidden bg-gray-100 relative">
                  <img src={originalImage} alt="Original" className="w-full h-full object-cover" />
                  <div className="absolute bottom-2 right-2 bg-white/90 backdrop-blur rounded-lg p-1 shadow-sm w-12 h-12 border border-gray-200">
@@ -75,7 +75,7 @@ const ResultView: React.FC<ResultViewProps> = ({
         <div className="w-full md:w-2/3 bg-white p-3 rounded-2xl shadow-lg border border-gray-100 flex flex-col gap-2 relative min-h-[400px]">
              <h3 className="text-sm font-semibold text-brand-600 uppercase tracking-wide px-1 flex items-center gap-2">
                  <Sparkles className="w-4 h-4 text-brand-500" />
-                 AI Generation
+                 AI Studio
              </h3>
              
              <div className="aspect-[3/4] md:aspect-square rounded-xl overflow-hidden bg-slate-900 relative flex items-center justify-center">
@@ -86,21 +86,21 @@ const ResultView: React.FC<ResultViewProps> = ({
                             <div className="absolute inset-0 w-16 h-16 border-4 border-brand-500 border-t-transparent rounded-full animate-spin"></div>
                             <ScanFace className="absolute inset-0 w-8 h-8 m-auto text-brand-500 animate-pulse" />
                          </div>
-                         <h4 className="text-xl font-bold mb-2">Creating Your Look</h4>
+                         <h4 className="text-xl font-bold mb-2">Generating...</h4>
                          <p className="text-brand-300 font-medium animate-pulse">{loadingTexts[progressStep]}</p>
                      </div>
                  )}
 
                  {timeLeft !== null && (
                      <div className="absolute inset-0 flex flex-col items-center justify-center p-8 text-center bg-slate-900 text-white z-20">
-                         <div className="bg-brand-500/20 p-5 rounded-full mb-6">
-                            <Timer className="w-12 h-12 text-brand-400 animate-pulse" />
+                         <div className="bg-amber-500/20 p-5 rounded-full mb-6">
+                            <Timer className="w-12 h-12 text-amber-400 animate-pulse" />
                          </div>
-                         <h4 className="text-2xl font-bold mb-3">Rate Limit</h4>
+                         <h4 className="text-2xl font-bold mb-3 text-amber-400">AI Cooling Down</h4>
                          <p className="text-slate-400 text-sm mb-8 max-w-xs">
-                             Google's free tier allows 1 try-on every 60 seconds.
+                             To prevent errors, please wait 2 minutes between attempts on the free tier.
                          </p>
-                         <div className="text-6xl font-mono font-bold text-brand-400 mb-10">
+                         <div className="text-6xl font-mono font-bold text-white mb-10">
                              {timeLeft}s
                          </div>
                          <div className="flex gap-4">
@@ -118,17 +118,17 @@ const ResultView: React.FC<ResultViewProps> = ({
                  )}
 
                  {error && timeLeft === null && (
-                     <div className="absolute inset-0 flex flex-col items-center justify-center p-8 text-center bg-slate-800 overflow-y-auto">
+                     <div className="absolute inset-0 flex flex-col items-center justify-center p-8 text-center bg-slate-800">
                          <AlertCircle className="w-10 h-10 text-red-500 mb-4" />
-                         <h4 className="text-white font-bold text-lg mb-2">Service Limit Reached</h4>
-                         <p className="text-gray-400 text-sm mb-6 px-4">The free quota for this API key is currently exhausted. This usually resets in a few minutes.</p>
+                         <h4 className="text-white font-bold text-lg mb-2">Service Delay</h4>
+                         <p className="text-gray-400 text-sm mb-6 px-4">The AI encountered a limit. Wait a moment then retry.</p>
                          
                          <button 
                             onClick={() => setShowDetails(!showDetails)}
                             className="flex items-center gap-2 text-[10px] text-gray-500 uppercase tracking-widest mb-4 hover:text-gray-300 transition-colors"
                          >
                             <Bug className="w-3 h-3" />
-                            Technical Diagnostics
+                            Diagnostics
                             {showDetails ? <ChevronUp className="w-3 h-3" /> : <ChevronDown className="w-3 h-3" />}
                          </button>
 
@@ -151,10 +151,10 @@ const ResultView: React.FC<ResultViewProps> = ({
                  <div className="grid grid-cols-2 gap-3 mt-2">
                      <button onClick={onRetake} className="flex items-center justify-center gap-2 py-4 bg-slate-100 hover:bg-slate-200 text-slate-700 rounded-xl font-bold transition-all">
                          <RefreshCw className="w-4 h-4" />
-                         New Photo
+                         Retake
                      </button>
                      <button className="flex items-center justify-center gap-2 py-4 bg-brand-600 hover:bg-brand-700 text-white rounded-xl font-bold transition-all shadow-lg shadow-brand-200">
-                         Save Look
+                         Save
                      </button>
                  </div>
              )}