Update app.py

app.py

@@ -1,125 +1,179 @@
-# app.py — Omantel Insurance Q&A (RAG) with system prompt + simple config
-import os
-import gradio as gr
-from pinecone import Pinecone, ServerlessSpec
-from llama_index.core import VectorStoreIndex, SimpleDirectoryReader, StorageContext, Settings
-from llama_index.vector_stores.pinecone import PineconeVectorStore
-from llama_index.embeddings.openai import OpenAIEmbedding
-from llama_index.llms.openai import OpenAI
-
-# --- System Prompt (polite + answer-from-document constraint) ---
-SYSTEM_PROMPT = """You are Aisha, a polite and professional Insurance assistant.
-Answer ONLY using the information found in the indexed insurance document(s).
-If the answer is not in the document(s), say: "I couldn’t find that in the document."
-Keep responses concise, helpful, and courteous.
+# --- Gradio UI (Aurora Glass theme) ---
+LOGO_URL = "https://raw.githubusercontent.com/Decoding-Data-Science/Omantel/main/Omantel_Logo%20(1).png"
+
+CUSTOM_CSS = """
+:root{
+  --bg:#0a0f1c;
+  --panel:#0f1629f2;
+  --stroke:#1d2740;
+  --muted:#96a3be;
+  --brand:#2e90fa;
+  --accent:#f59e0b;
+  --ok:#10b981;
+  --danger:#ef4444;
+}
+.gradio-container{
+  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial !important;
+}
+body{
+  background:
+    radial-gradient(1100px 500px at 10% -10%, #2e90fa22, transparent 70%),
+    radial-gradient(1000px 500px at 110% 10%, #f59e0b18, transparent 60%),
+    linear-gradient(180deg, var(--bg) 0%, #0a0f1c 100%);
+}
+.header{
+  position:relative;
+  padding:18px 12px 8px;
+  border-bottom:1px solid var(--stroke);
+  display:grid;
+  grid-template-columns: 140px 1fr 140px;
+  align-items:center;
+  gap:12px;
+}
+.header .logo img{height:50px;object-fit:contain; filter: drop-shadow(0 4px 14px rgba(0,0,0,.25));}
+.title{
+  text-align:center; color:#e5e7eb;
+}
+.title h1{
+  margin:0; font-weight:800; font-size:1.7rem; letter-spacing:.2px;
+}
+.title p{
+  margin:6px 0 0; color:var(--muted); font-size:.95rem;
+}
+.pill{
+  display:inline-flex; align-items:center; gap:8px;
+  padding:6px 10px; border-radius:999px; font-size:12px;
+  background:linear-gradient(180deg,#0d1425,#0a1222);
+  border:1px solid var(--stroke); color:#cbd5e1;
+}
+.pill .dot{width:8px;height:8px;border-radius:999px;background:var(--ok); box-shadow:0 0 0 4px #10b98126;}
+.panel{
+  background:var(--panel); border:1px solid var(--stroke);
+  border-radius:16px; padding:16px; backdrop-filter: blur(10px);
+  box-shadow:0 12px 36px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
+}
+.hero{
+  position:relative; border-radius:18px; padding:18px; margin-top:8px;
+  border:1px solid #25314e;
+  background:
+    radial-gradient(800px 200px at 12% -12%, rgba(46, 144, 250, .24), transparent 70%),
+    radial-gradient(700px 140px at 90% 0%, rgba(245, 158, 11, .14), transparent 60%),
+    linear-gradient(180deg, #0d1428, #0c1224);
+}
+.hero h2{margin:0 0 6px;color:#e5e7eb;font-weight:700; font-size:1.1rem;}
+.hero p{margin:0;color:var(--muted);font-size:.95rem;}
+.label, label{color:#dbe3f0 !important; font-weight:600 !important;}
+.helper{font-size:12px;color:#9aa5b1;margin-top:6px;}
+.chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
+.chip{
+  cursor:pointer; user-select:none;
+  padding:8px 12px; border-radius:12px; font-size:.9rem;
+  background:#0b1222; border:1px solid #273043; color:#cbd5e1;
+}
+.chip:hover{border-color:#35507a}
+.actions{display:flex; gap:8px; flex-wrap:wrap;}
+button.primary{
+  background:linear-gradient(180deg,#3b82f6,#1e40af); color:white; border:1px solid #1e3a8a;
+}
+button.secondary{
+  background:#0b1222; color:#cbd5e1; border:1px solid #273043;
+}
+.footer{ text-align:center; font-size:12px; color:#94a3b8; padding:12px 0 0;}
+#answer_box{min-height:200px;}
+.small-note{font-size:12px;color:#9aa5b1;}
+kbd{
+  background:#0f172a; color:#e5e7eb; border:1px solid #334155;
+  border-bottom-width:2px; padding:2px 6px; border-radius:6px; font-size:.8em;
+}
 """
 
-# ===== Minimal CONFIG (only necessary keys) =====
-PINECONE_API_KEY = os.getenv("PINECONE_API_KEY")
-OPENAI_API_KEY   = os.getenv("OPENAI_API_KEY")
-if not PINECONE_API_KEY or not OPENAI_API_KEY:
-    raise RuntimeError("Missing PINECONE_API_KEY or OPENAI_API_KEY (set them in Space → Settings → Variables).")
-
-DATA_DIR = "data"                         # Put insurance docs here (e.g., data/insurance.pdf)
-LOGO_PATH = os.path.join(DATA_DIR, "Omantel_Logo_new.png")  # Mandatory logo
-if not os.path.exists(LOGO_PATH):
-    raise RuntimeError("Logo not found: data/Omantel_Logo_new.png (commit it to your Space repo).")
-
-EMBED_MODEL = "text-embedding-3-small"    # 1536-dim
-LLM_MODEL   = "gpt-4o-mini"
-TOP_K       = 4                            # internal similarity_top_k
-
-# ===== LlamaIndex / Pinecone (simple, fixed serverless: aws/us-east-1) =====
-Settings.embed_model = OpenAIEmbedding(model=EMBED_MODEL, api_key=OPENAI_API_KEY)
-Settings.llm = OpenAI(model=LLM_MODEL, api_key=OPENAI_API_KEY, system_prompt=SYSTEM_PROMPT)
-
-pc = Pinecone(api_key=PINECONE_API_KEY)
-def ensure_index(name: str, dim: int = 1536):
-    names = [i["name"] for i in pc.list_indexes()]
-    if name not in names:
-        pc.create_index(
-            name=name, dimension=dim, metric="cosine",
-            spec=ServerlessSpec(cloud="aws", region="us-east-1"),
-        )
-    return pc.Index(name)
-
-# Fixed index name for simplicity
-pinecone_index = ensure_index("dds-insurance-index", dim=1536)
-vector_store = PineconeVectorStore(pinecone_index=pinecone_index)
-
-def bootstrap_index():
-    if not os.path.isdir(DATA_DIR):
-        raise RuntimeError("No 'data/' directory found. Commit your documents to data/ in the Space repo.")
-    docs = SimpleDirectoryReader(DATA_DIR).load_data()
-    if not docs:
-        raise RuntimeError("No documents found in data/. Add e.g., data/insurance.pdf")
-    storage_ctx = StorageContext.from_defaults(vector_store=vector_store)
-    VectorStoreIndex.from_documents(docs, storage_context=storage_ctx, show_progress=True)
-
-bootstrap_index()
-
-def answer(query: str) -> str:
-    if not query.strip():
-        return "Please enter a question (or select one from the FAQ list)."
-    index = VectorStoreIndex.from_vector_store(vector_store)
-    resp = index.as_query_engine(similarity_top_k=TOP_K).query(query)
-    return str(resp)
-
-FAQS = [
-    "",
-    "What benefits are covered under the policy?",
-    "How do I file a claim and what documents are required?",
-    "What are the exclusions and limitations?",
-    "Is pre-authorization needed for hospitalization?",
-    "What is the reimbursement timeline?",
-    "How are outpatient vs inpatient services handled?",
-    "How can I check my network hospitals/clinics?",
-    "What is the co-pay or deductible policy?",
-]
-
-def use_faq(selected_faq: str, free_text: str):
-    prompt = (selected_faq or "").strip() or (free_text or "").strip()
-    if not prompt:
-        return "", "Please select a FAQ or type your question."
-    return prompt, answer(prompt)
-
-# ===== UI =====
-CSS = """
-.header { display:flex; flex-direction:column; align-items:center; gap:6px; }
-.logo img { width:300px; height:300px; object-fit:contain; }  /* fixed 300x300 */
-.title { text-align:center; font-weight:700; font-size:1.4rem; margin:6px 0 0 0; }
-.subnote { text-align:center; margin-top:-2px; opacity:0.8; }
-"""
-
-with gr.Blocks(css=CSS, theme=gr.themes.Soft()) as demo:
-    with gr.Row():
-        with gr.Column():
-            gr.Markdown("<div class='header'>")
-            gr.Image(value=LOGO_PATH, show_label=False, elem_classes=["logo"])
-            gr.Markdown(
-                "<h1 class='title'>Omantel Insurance Q&A — RAG Assistant</h1>"
-                "<p class='subnote'>Answers strictly from your insurance document(s)</p>"
-            )
-            gr.Markdown("</div>")
+with gr.Blocks(css=CUSTOM_CSS, title="Mulhim • Omantel Knowledge Assistant (Aurora)") as demo:
+    # Header
+    with gr.Row(elem_classes="header"):
+        with gr.Column(scale=0, elem_classes="logo"):
+            gr.HTML(f'''
+                <div class="pill"><span class="dot"></span> Online • Mulhim</div>
+                <br><img src="{LOGO_URL}" alt="Omantel Logo">
+            ''')
+        with gr.Column(scale=1, elem_classes="title"):
+            gr.HTML("""
+                <h1>Mulhim — Omantel Knowledge Assistant</h1>
+                <p>Answers are <b>strictly</b> grounded in your indexed PDF(s). If it’s not in the file, you’ll be told.</p>
+            """)
+        with gr.Column(scale=0):
+            gr.HTML("")  # spacer
+
+    # Explainer / Hero
+    gr.HTML("""
+      <div class="hero panel">
+        <h2>How it works</h2>
+        <p>Ask about internal applications, steps, or focal points. Mulhim cites only what's inside your indexed document.</p>
+      </div>
+    """)
 
     with gr.Row():
-        with gr.Column(scale=1):
-            gr.Markdown("### Ask from Frequently Asked Questions")
-            faq = gr.Dropdown(choices=FAQS, value=FAQS[0], label="Select a common question")
-
-            gr.Markdown("### Or type your question")
-            user_q = gr.Textbox(
-                label="Your question",
-                placeholder="e.g., What is covered under outpatient benefits?",
-                lines=2
-            )
-            ask_btn = gr.Button("Ask", variant="primary")
-
-        with gr.Column(scale=1):
-            chosen_prompt = gr.Textbox(label="Query sent", interactive=False)
-            answer_box = gr.Markdown()
-
-    ask_btn.click(use_faq, inputs=[faq, user_q], outputs=[chosen_prompt, answer_box])
-
-if __name__ == "__main__":
-    demo.launch()
+        # Left: Ask + Answer
+        with gr.Column(scale=7):
+            with gr.Group(elem_classes="panel"):
+                inp = gr.Textbox(
+                    label="Your question",
+                    placeholder="e.g., Procurement System — steps and owner contact?",
+                    lines=3,
+                    autofocus=True
+                )
+                with gr.Row(elem_classes="actions"):
+                    ask_btn = gr.Button("Ask Mulhim", variant="primary", elem_classes="primary")
+                    clear_btn = gr.Button("Clear", variant="secondary", elem_classes="secondary")
+                gr.Markdown('<div class="helper">Tip: Mention the process or department for best results. Press <kbd>Enter</kbd> to submit.</div>')
+
+                # quick chips
+                with gr.Row(elem_classes="chips"):
+                    chip1 = gr.Button("Focal point • Technology Strategy", elem_id=None, elem_classes="chip", variant="secondary")
+                    chip2 = gr.Button("Steps • New vendor contract", elem_classes="chip", variant="secondary")
+                    chip3 = gr.Button("Process • Customer complaints (CEX)", elem_classes="chip", variant="secondary")
+                    chip4 = gr.Button("Finance • Budget reallocation", elem_classes="chip", variant="secondary")
+
+            with gr.Group(elem_classes="panel"):
+                out = gr.Textbox(
+                    label="Answer",
+                    lines=14,
+                    elem_id="answer_box",
+                    show_copy_button=True
+                )
+                gr.Markdown('<div class="small-note">If the answer isn’t found in the PDF, you’ll see: <i>“I couldn’t find that in the document.”</i></div>')
+
+        # Right: Examples + Notes
+        with gr.Column(scale=5):
+            with gr.Group(elem_classes="panel"):
+                gr.Markdown("**Quick examples**")
+                examples = gr.Examples(
+                    examples=[
+                        ["Who is the focal point for Technology Strategy and how can I reach them?"],
+                        ["I need to submit a new vendor contract. Which application and steps?"],
+                        ["For customer complaints (CEX), what's the process and owner contact?"],
+                        ["Finance: how to request a budget reallocation and who to email?"],
+                    ],
+                    inputs=inp,
+                )
+            with gr.Group(elem_classes="panel"):
+                gr.Markdown("**Notes**")
+                gr.Markdown(
+                    "- Answers are sourced only from the indexed PDF/document.\n"
+                    "- If information isn’t found, Mulhim will say so.\n"
+                    "- For department-specific queries, the related contact is shown if present in the doc."
+                )
+
+    gr.Markdown(f'<div class="footer">Pinecone index: <b>{index_name}</b> • Namespace: <b>{PINECONE_NAMESPACE}</b> • LlamaIndex + Pinecone</div>')
+
+    # Interactions
+    ask_btn.click(fn=query_doc, inputs=inp, outputs=out)
+    inp.submit(fn=query_doc, inputs=inp, outputs=out)
+    clear_btn.click(lambda: ("", ""), inputs=None, outputs=[inp, out])
+
+    # Chip wiring (pre-fill the input, then auto-ask)
+    chip1.click(lambda: "Who is the focal point for Technology Strategy and how can I reach them?", outputs=inp).then(query_doc, inp, out)
+    chip2.click(lambda: "I need to submit a new vendor contract. Which application and steps?", outputs=inp).then(query_doc, inp, out)
+    chip3.click(lambda: "For customer complaints (CEX), what's the process and owner contact?", outputs=inp).then(query_doc, inp, out)
+    chip4.click(lambda: "Finance: how to request a budget reallocation and who to email?", outputs=inp).then(query_doc, inp, out)
+
+demo.launch()