Update app.py

app.py

@@ -48,11 +48,9 @@ class Utils:
         if not hits or docstore.empty:
             return "No relevant documents found."
         lines = []
-        # Ensure we don't try to access indices that are out of bounds
         valid_hits = [h for h in hits if h[0] < len(docstore)]
         for i, score in valid_hits[:count]:
             row = docstore.iloc[i]
-            # Ensure 'passage_text' and 'id' columns exist
             txt = str(row.get("passage_text", "Text not available"))
             doc_id = row.get("id", "N/A")
             txt = (txt[:max_chars] + "…") if len(txt) > max_chars else txt
@@ -142,10 +140,8 @@ class RAGSystem:
     def __init__(self, cfg: Config):
         self.docstore = pd.read_parquet(cfg.docstore_path)
         device = torch.device("cuda" if torch.cuda.is_available() else "cpu")
-        
         self.glot_enc = Glot500Encoder(cfg.glot_model_hf)
         self.glot_ret = Glot500Retriever(self.glot_enc, self.docstore, cfg.glot_index_out)
-
         txt_enc = FaTextEncoder(cfg.mclip_text_model_hf, device, cfg.max_text_len)
         self.mclip_ret = TextIndexRetriever(txt_enc, self.docstore, cfg.clip_index_out)
         self.vision = FaVisionEncoder(cfg.clip_vision_model, device)
@@ -157,10 +153,9 @@ class RAGSystem:
 # --- 1. LOAD MODELS AND INDEXES (This runs only once when the app starts) ---
 print("Initializing configuration...")
 cfg = Config()
-print("Loading RAG system (models, encoders, and retrievers)...")
+print("Loading RAG system...")
 rag_system = RAGSystem(cfg)
 print("Initializing Gemini model...")
-# Securely get the API key from Hugging Face secrets
 api_key = os.environ.get("GEMINI_API_KEY")
 vlm = VLM_GenAI(api_key, model_name="models/gemini-1.5-flash")
 print("System ready.")
@@ -169,9 +164,7 @@ print("System ready.")
 def run_rag_query(question_text: str, question_image: Optional[Image.Image]) -> Tuple[str, str]:
     if not question_text.strip():
         return "Please ask a question.", ""
-
     context_block = ""
-    # Decide which retriever to use based on input
     if question_image:
         print("Performing multimodal retrieval...")
         img_vec = rag_system.vision.encode(question_image)
@@ -181,16 +174,11 @@ def run_rag_query(question_text: str, question_image: Optional[Image.Image]) ->
         print("Performing text retrieval...")
         hits = rag_system.glot_ret.topk(question_text, k=cfg.per_option_ctx)
         context_block = Utils.build_context_block(hits, rag_system.docstore, cfg.per_option_ctx)
-
-    # --- Augment and Generate ---
     print("Generating response...")
+    prompt = f"با توجه به اسناد زیر، به سوال پاسخ دهید.\n\nاسناد:\n{context_block}\n\nسوال: {question_text}"
     if question_image:
         prompt = f"با توجه به تصویر و اسناد زیر، به سوال پاسخ دهید.\n\nاسناد:\n{context_block}\n\nسوال: {question_text}"
-    else:
-        prompt = f"با توجه به اسناد زیر، به سوال پاسخ دهید.\n\nاسناد:\n{context_block}\n\nسوال: {question_text}"
-
     content_parts = [question_image, prompt] if question_image else [prompt]
-    
     try:
         resp = vlm.model.generate_content(
             content_parts,
@@ -201,11 +189,51 @@ def run_rag_query(question_text: str, question_image: Optional[Image.Image]) ->
     except Exception as e:
         answer = f"Error during generation: {e}"
         print(answer)
-
     return answer, context_block
 
 # --- 3. CREATE THE GRADIO INTERFACE ---
-with gr.Blocks(theme=gr.themes.Soft(), title="Persian Culinary RAG") as demo:
+
+# Define your custom CSS for the background image
+custom_css = """
+body {
+    /* The URL to your background image in the HF Repo */
+    background-image: url('/file=background/back.jpg');
+    /* Make the image cover the whole background */
+    background-size: cover;
+    /* Don't repeat the image */
+    background-repeat: no-repeat;
+    /* Fix the background image so it doesn't scroll with content */
+    background-attachment: fixed;
+    /* Center the background image */
+    background-position: center;
+    color: white; /* Set default text color to white for readability */
+}
+
+/* Add a semi-transparent overlay to make text more readable */
+body::before {
+    content: "";
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background-color: rgba(0, 0, 0, 0.5); /* Black overlay with 50% opacity */
+    z-index: -1; /* Place it behind the content */
+}
+
+/* Style the main container to have a semi-transparent background */
+.gradio-container {
+    background: rgba(0, 0, 0, 0.6) !important; /* Darker, semi-transparent background for the app area */
+    border-radius: 20px !important;
+    border: 1px solid rgba(255, 255, 255, 0.2);
+}
+
+/* Make textboxes semi-transparent */
+textarea, input[type="text"] {
+    background-color: rgba(255, 255, 255, 0.1) !important;
+    color: white !important;
+    border: 1px solid rgba(255, 255, 255, 0.3) !important;
+}
+"""
+
+with gr.Blocks(css=custom_css, title="Persian Culinary RAG") as demo:
     gr.Markdown("# 🍲 Persian Culinary RAG Demo")
     gr.Markdown("Ask a question about Iranian food, with or without an image, to see the RAG system in action.")
 
@@ -220,7 +248,7 @@ with gr.Blocks(theme=gr.themes.Soft(), title="Persian Culinary RAG") as demo:
     
     gr.Examples(
         examples=[
-            ["در مورد حلوا توضیح بده", None],
+            ["در مورد دیزی سنگی توضیح بده", None],
             ["مواد لازم برای تهیه آش رشته چیست؟", None],
         ],
         inputs=[text_input, image_input]
@@ -232,6 +260,5 @@ with gr.Blocks(theme=gr.themes.Soft(), title="Persian Culinary RAG") as demo:
         outputs=[output_answer, output_context]
     )
 
-# Launch the web server
 demo.launch()