feat: Full-width layout, Portfolio UI differentiation, and Agent resilience fix

frontend/components/AgentAnalysis.tsx

@@ -34,20 +34,21 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
     if (!approved || !tender) return;
     setIsRunning(true);
     let extractedText = documentText;
-    if (file && !extractedText) {
-      setIsUploading(true);
-      try {
+    
+    try {
+      if (file && !extractedText) {
+        setIsUploading(true);
         const uploadResult = await uploadDocument(file);
         extractedText = uploadResult.text;
         setDocumentText(extractedText);
-      } catch (error) {
-        console.error("Error uploading document:", error);
-      } finally {
-        setIsUploading(false);
       }
+      await onAnalyze(extractedText);
+    } catch (error) {
+      console.error("Error during analysis flow:", error);
+    } finally {
+      setIsUploading(false);
+      setIsRunning(false);
     }
-    await onAnalyze(extractedText);
-    setIsRunning(false);
   };
 
   if (!tender && !analysis) {
@@ -118,6 +119,18 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
           <div className="flex flex-col gap-4 lg:w-80">
              <div className="glass-card rounded-2xl p-6 bg-white/5 border border-white/10">
                 <h4 className="text-[10px] font-bold uppercase text-slate-400 mb-4 tracking-widest">Administrative Bases (PDF)</h4>
+                
+                {tender?.attachments && tender.attachments.length > 0 && (
+                  <div className="mb-4 space-y-2">
+                    {tender.attachments.map((att, i) => (
+                      <div key={i} className="flex items-center gap-2 p-2 rounded-lg bg-purple-500/10 border border-purple-500/20 text-[10px] text-purple-300">
+                        <span>📄</span>
+                        <span className="truncate">{att.name}</span>
+                      </div>
+                    ))}
+                  </div>
+                )}
+
                 <input type="file" accept=".pdf" onChange={handleFileChange} className="w-full text-xs text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-[10px] file:font-bold file:bg-white/10 file:text-purple-300 hover:file:bg-white/20 transition cursor-pointer" />
                 {file && <p className="mt-2 text-[10px] text-green-400 font-bold">✓ Ready for extraction</p>}
              </div>

frontend/components/TenderSearch.tsx

@@ -97,13 +97,23 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
     <div className="space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-700">
       {!selectedTenderForModal ? (
         <>
-          {/* Search Bar Section */}
-          <div className="glass-card rounded-3xl p-8">
+          {/* Header Section */}
+          <div className={`glass-card rounded-3xl p-8 mb-4 border transition-all duration-500 ${forceShowFollowed ? 'border-purple-500/30 bg-purple-500/5 shadow-[0_0_50px_rgba(168,85,247,0.1)]' : 'border-white/10'}`}>
             <div className="mb-6 flex justify-between items-start">
               <div>
-                <h2 className="text-2xl font-bold text-white mb-2">Tender Discovery</h2>
-                <p className="text-slate-400 text-sm">Real-time access to the Chilean public procurement market.</p>
+                <div className="flex items-center gap-3 mb-2">
+                   <div className={`w-10 h-10 rounded-2xl flex items-center justify-center text-xl ${forceShowFollowed ? 'bg-purple-500 text-white' : 'bg-white/5 text-slate-400'}`}>
+                      {forceShowFollowed ? "★" : "📡"}
+                   </div>
+                   <h2 className="text-3xl font-black text-white tracking-tight">
+                     {forceShowFollowed ? "My Portfolio" : "Tender Discovery"}
+                   </h2>
+                </div>
+                <p className="text-slate-400 text-sm">
+                  {forceShowFollowed ? "Your curated list of high-value opportunities." : "Real-time access to the Chilean public procurement market."}
+                </p>
               </div>
+
               {selectedCodes.length > 0 && (
                 <button
                   onClick={handleSyncToAgents}
@@ -115,46 +125,48 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
               )}
             </div>
             
-            <form onSubmit={handleSubmit} className="grid grid-cols-1 md:grid-cols-4 gap-6">
-              <div className="space-y-2">
-                <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Keyword</label>
-                <input
-                  type="text"
-                  placeholder="e.g. Software, Cloud..."
-                  className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white placeholder:text-slate-600 focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all"
-                  value={keyword}
-                  onChange={(e) => setKeyword(e.target.value)}
-                />
-              </div>
-              <div className="space-y-2">
-                <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Buyer Code</label>
-                <input
-                  type="text"
-                  placeholder="e.g. 6945"
-                  className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white placeholder:text-slate-600 focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all"
-                  value={buyerCode}
-                  onChange={(e) => setBuyerCode(e.target.value)}
-                />
-              </div>
-              <div className="space-y-2">
-                <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Date Limit</label>
-                <input
-                  type="date"
-                  className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all [color-scheme:dark]"
-                  value={date}
-                  onChange={(e) => setDate(e.target.value)}
-                />
-              </div>
-              <div className="flex items-end">
-                <button
-                  type="submit"
-                  disabled={isLoading}
-                  className="w-full premium-gradient hover:opacity-90 text-white font-bold py-3.5 rounded-xl transition-all shadow-lg shadow-purple-500/20 active:scale-[0.98] disabled:opacity-50"
-                >
-                  {isLoading ? "Searching..." : "Fetch Opportunities"}
-                </button>
-              </div>
-            </form>
+            {!forceShowFollowed && (
+              <form onSubmit={handleSubmit} className="grid grid-cols-1 md:grid-cols-4 gap-6 animate-in slide-in-from-top-4 duration-500">
+                <div className="space-y-2">
+                  <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Keyword</label>
+                  <input
+                    type="text"
+                    placeholder="e.g. Software, Cloud..."
+                    className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white placeholder:text-slate-600 focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all"
+                    value={keyword}
+                    onChange={(e) => setKeyword(e.target.value)}
+                  />
+                </div>
+                <div className="space-y-2">
+                  <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Buyer Code</label>
+                  <input
+                    type="text"
+                    placeholder="e.g. 6945"
+                    className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white placeholder:text-slate-600 focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all"
+                    value={buyerCode}
+                    onChange={(e) => setBuyerCode(e.target.value)}
+                  />
+                </div>
+                <div className="space-y-2">
+                  <label className="text-[10px] uppercase tracking-wider text-slate-500 font-bold px-1">Date Limit</label>
+                  <input
+                    type="date"
+                    className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-purple-500/40 transition-all [color-scheme:dark]"
+                    value={date}
+                    onChange={(e) => setDate(e.target.value)}
+                  />
+                </div>
+                <div className="flex items-end">
+                  <button
+                    type="submit"
+                    disabled={isLoading}
+                    className="w-full premium-gradient hover:opacity-90 text-white font-bold py-3.5 rounded-xl transition-all shadow-lg shadow-purple-500/20 active:scale-[0.98] disabled:opacity-50"
+                  >
+                    {isLoading ? "Searching..." : "Fetch Opportunities"}
+                  </button>
+                </div>
+              </form>
+            )}
           </div>
 
           {/* Results Controls */}
@@ -262,7 +274,8 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
         </>
       ) : (
         /* Immersive Detail View (Replaces List) */
-        <div className="animate-in slide-in-from-right-8 duration-500">
+        <div className="animate-in slide-in-from-right-8 duration-500 w-full max-w-[1600px] mx-auto">
+
           <div className="flex items-center justify-between mb-8">
             <button 
               onClick={() => setSelectedTenderForModal(null)}
@@ -298,7 +311,8 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
                     {selectedTenderForModal.status}
                   </span>
                 </div>
-                <h3 className="text-4xl md:text-5xl font-black text-white leading-tight tracking-tight mb-4">{selectedTenderForModal.name}</h3>
+                <h3 className="text-3xl md:text-4xl font-black text-white leading-tight tracking-tight mb-4">{selectedTenderForModal.name}</h3>
+
                 <div className="flex flex-wrap items-center gap-x-8 gap-y-4">
                   <div className="flex items-center gap-3">
                     <div className="w-8 h-8 rounded-full bg-white/5 flex items-center justify-center text-lg">🏢</div>
@@ -328,28 +342,28 @@ export default function TenderSearch({ tenders, onSearch, onAnalyze, forceShowFo
                   </section>
 
                   <div className="grid grid-cols-2 gap-6">
-                    <div className="p-8 rounded-3xl bg-white/[0.03] border border-white/5 group hover:bg-white/[0.05] transition-colors">
+                    <div className="p-6 rounded-3xl bg-white/[0.03] border border-white/5 group hover:bg-white/[0.05] transition-colors">
                       <div className="text-[10px] uppercase text-slate-500 font-black mb-2 tracking-widest">Estimated Investment</div>
-                      <div className="text-2xl text-white font-bold tracking-tight">
+                      <div className="text-xl text-white font-bold tracking-tight">
                         {selectedTenderForModal.estimated_amount ? new Intl.NumberFormat("es-CL", { style: "currency", currency: "CLP" }).format(selectedTenderForModal.estimated_amount) : "Not Disclosed"}
                       </div>
                     </div>
-                    <div className="p-8 rounded-3xl bg-white/[0.03] border border-white/5 group hover:bg-white/[0.05] transition-colors">
+                    <div className="p-6 rounded-3xl bg-white/[0.03] border border-white/5 group hover:bg-white/[0.05] transition-colors">
                       <div className="text-[10px] uppercase text-slate-500 font-black mb-2 tracking-widest">Industry Classification</div>
-                      <div className="text-2xl text-white font-bold tracking-tight">{selectedTenderForModal.sector || "General Procurement"}</div>
+                      <div className="text-xl text-white font-bold tracking-tight">{selectedTenderForModal.sector || "General Procurement"}</div>
                     </div>
                   </div>
                 </div>
 
                 {/* Sidebar Column */}
                 <div className="space-y-12">
-                  <div className="p-10 rounded-[2rem] bg-purple-600/10 border border-purple-500/20 shadow-2xl shadow-purple-500/5 relative overflow-hidden group">
+                  <div className="p-8 rounded-[2rem] bg-purple-600/10 border border-purple-500/20 shadow-2xl shadow-purple-500/5 relative overflow-hidden group">
                     <div className="absolute top-0 right-0 w-32 h-32 bg-purple-500/20 blur-[60px] opacity-0 group-hover:opacity-100 transition-opacity" />
                     <h4 className="text-[10px] font-black uppercase tracking-[0.3em] text-purple-400 mb-6">Submission Deadline</h4>
-                    <div className="text-4xl font-black text-white mb-2 font-mono">
+                    <div className="text-2xl font-black text-white mb-2 font-mono">
                       {selectedTenderForModal.closing_date ? new Date(selectedTenderForModal.closing_date).toLocaleDateString() : "---"}
                     </div>
-                    <p className="text-xs text-purple-400/60 font-bold uppercase tracking-tighter">Final Window for Proposal Submission</p>
+                    <p className="text-[10px] text-purple-400/60 font-bold uppercase tracking-tighter">Final Window for Submission</p>
                   </div>
 
                   <div>