Update app.py

app.py

@@ -66,10 +66,7 @@ def find_similar_recipes_list(query_text):
     for idx in top_indices:
         row = df_recipes.iloc[idx]
         title = row['Title']
-        # Text description for the card
-        desc = str(row['Raw_Output'])[:800] + "..." # Increased text limit
-        
-        # Wrapped in sim-scroll for the 400px height
+        desc = str(row['Raw_Output'])[:800] + "..."
         card_content = f"### 🏆 {title}\n\n<div class='sim-scroll'>{desc}</div>"
         results_list.append(card_content)
     
@@ -86,37 +83,20 @@ def format_recipe(json_data):
     text = f"🍽️ {title}\n\n🛒 INGREDIENTS:\n{ing}\n\n🍳 INSTRUCTIONS:\n{inst}"
     return text, f"{title} {ing} {inst}"
 
-# --- NEW: PIPELINE WRAPPER TO HANDLE VISIBILITY UPDATES ---
 def ui_update_pipeline(image_path):
     if not hf_token: 
         return "Error: HF_TOKEN missing", "", gr.update(), gr.update(), "", gr.update(), ""
-    
     try:
         os.environ["HF_TOKEN"] = hf_token
         digitizer = RecipeDigitalizerPipeline()
         json_res = digitizer.run_pipeline(image_path)
         readable, query = format_recipe(json_res)
-        
         if query:
             sim_list = find_similar_recipes_list(query)
         else:
             sim_list = ["No query generated.", "", ""]
         
-        # RETURNS:
-        # 1. Digitized Text
-        # 2. Sim Card 1 Text
-        # 3. Sim Card 1 Buttons (Visible)
-        # 4. Sim Card 2 Container (Visible)
-        # 5. Sim Card 2 Text
-        # 6. Sim Card 3 Container (Visible)
-        # 7. Sim Card 3 Text
-        return (
-            readable, 
-            sim_list[0], gr.update(visible=True), # Card 1
-            gr.update(visible=True), sim_list[1], # Card 2
-            gr.update(visible=True), sim_list[2]  # Card 3
-        )
-        
+        return (readable, sim_list[0], gr.update(visible=True), gr.update(visible=True), sim_list[1], gr.update(visible=True), sim_list[2])
     except Exception as e:
         return f"Error: {e}", "Error", gr.update(), gr.update(), "", gr.update(), ""
 
@@ -182,14 +162,17 @@ body, .gradio-container { background-color: #f0f2f5; }
     border-left: 4px solid #1877f2 !important;
 }
 
-/* General Cards */
+/* General Cards (Used for Feed Posts) */
 .content-card {
     background: white;
     border-radius: 12px;
     box-shadow: 0 1px 2px rgba(0,0,0,0.1);
     border: 1px solid #ddd;
     padding: 20px;
-    margin-bottom: 20px;
+    
+    /* FIX: 7px Spacing between blocks */
+    margin-bottom: 7px !important; 
+    
     height: 100%;
     overflow: visible !important; 
 }
@@ -207,7 +190,6 @@ body, .gradio-container { background-color: #f0f2f5; }
     justify-content: space-between;
 }
 
-/* FIX 1: Increased height to 400px */
 .sim-scroll {
     height: 400px;       
     overflow-y: auto;    
@@ -231,7 +213,7 @@ body, .gradio-container { background-color: #f0f2f5; }
 /* Gap Fix */
 .gap-fix { gap: 25px !important; }
 
-/* FIX 4: Center Quick Start Images */
+/* Center Quick Start Images */
 .gradio-examples {
     display: flex;
     justify-content: center;
@@ -267,7 +249,7 @@ with gr.Blocks(title="Legacy Kitchen") as demo:
                     <span class="app-slogan">Turning Handwritten Notes into a Digital Cookbook.</span>
                 </div>
             </div>
-            <div style="color: #65676b; font-weight: 600;">v3.5</div>
+            <div style="color: #65676b; font-weight: 600;">v3.6</div>
         </div>
     """)
 
@@ -292,17 +274,11 @@ with gr.Blocks(title="Legacy Kitchen") as demo:
             
             # === VIEW 1: AI DIGITALIZER ===
             with gr.Group(visible=True) as digitalizer_view:
-                
-                # SECTION 1: UPLOAD & TEXT
                 with gr.Row(elem_classes=["gap-fix"]):
-                    
-                    # Left: Upload & Examples
                     with gr.Column(scale=1):
                         with gr.Group(elem_classes=["content-card"]):
                             input_img = gr.Image(type="filepath", label="Upload", height=300)
                             magic_btn = gr.Button("✨ Convert to Digital", variant="primary", size="lg")
-                            
-                            # Examples (Centered via CSS)
                             gr.Examples(
                                 examples=[
                                     ["quick_tries_images/applecrisp.jpg"],
@@ -313,65 +289,45 @@ with gr.Blocks(title="Legacy Kitchen") as demo:
                                 label="Or try these examples:",
                                 cache_examples=False
                             )
-                    
-                    # Right: Text
                     with gr.Column(scale=1):
                         with gr.Group(elem_classes=["content-card"]):
-                            out_text = gr.Textbox(
-                                label="Result", 
-                                value="Here your digitalized recipe will be presented",
-                                lines=20, 
-                                interactive=False, 
-                                show_label=False
-                            )
+                            out_text = gr.Textbox(label="Result", value="Here your digitalized recipe will be presented", lines=20, interactive=False, show_label=False)
 
                 gr.HTML("<div style='height: 35px;'></div>")
-
-                # SECTION 2: SIMILAR RECIPES
                 gr.Markdown("### 3. Similar Recipes from Database")
                 
                 with gr.Row():
-                    # CARD 1 (Always Visible, Buttons Hidden initially)
                     with gr.Column(elem_classes=["sim-card"]) as c1_box:
                         sim1 = gr.Markdown("Once you will upload your scanned recipe, we will share similar recipes!")
-                        # FIX 2: Hidden initially
                         with gr.Row(visible=False) as c1_btns:
                             gr.Button("👍 Like", size="sm", variant="secondary")
                             gr.Button("↗️ Share", size="sm", variant="secondary")
                     
-                    # CARD 2 (Hidden initially)
                     with gr.Column(elem_classes=["sim-card"], visible=False) as c2_box:
                         sim2 = gr.Markdown("")
                         with gr.Row():
                             gr.Button("👍 Like", size="sm", variant="secondary")
                             gr.Button("↗️ Share", size="sm", variant="secondary")
                     
-                    # CARD 3 (Hidden initially)
                     with gr.Column(elem_classes=["sim-card"], visible=False) as c3_box:
                         sim3 = gr.Markdown("")
                         with gr.Row():
                             gr.Button("👍 Like", size="sm", variant="secondary")
                             gr.Button("↗️ Share", size="sm", variant="secondary")
 
-                # UPDATED: Button click triggers the new wrapper function
-                magic_btn.click(
-                    ui_update_pipeline, 
-                    input_img, 
-                    [out_text, sim1, c1_btns, c2_box, sim2, c3_box, sim3]
-                )
+                magic_btn.click(ui_update_pipeline, input_img, [out_text, sim1, c1_btns, c2_box, sim2, c3_box, sim3])
 
             # === VIEW 2: FEED ===
             with gr.Group(visible=False) as feed_view:
-                with gr.Group(elem_classes=["content-card"]):
-                    with gr.Row():
-                        gr.HTML(f'<img src="data:image/jpeg;base64,{profile_b64}" style="width:40px; height:40px; border-radius:50%; object-fit:cover;">')
-                        gr.Textbox(placeholder=f"What recipe are you cooking today?", show_label=False, container=False, scale=10)
+                # FIX: Removed the "What's Cooking" search bar section entirely
                 
                 if not df_recipes.empty:
                     feed_samples = df_recipes.sample(10)
                     for index, row in feed_samples.iterrows():
                         user_name = random.choice(["Grandma Rose", "Chef Mike", "Sarah J."])
                         emoji = random.choice(["🥘", "🥗", "🍰", "🌮"])
+                        
+                        # Each post is in its own 'content-card' Group, which now has 7px margin
                         with gr.Group(elem_classes=["content-card"]):
                             gr.HTML(f"""
                             <div style="display:flex; gap:10px; align-items:center; margin-bottom:12px;">