Update app.py

app.py

@@ -596,37 +596,19 @@ custom_css = """
     margin-bottom: 20px !important;
     border: 1px solid #e5e7eb !important;
 }
+
+/* Persistent Header Styling */
+.persistent-header {
+    display: flex; 
+    align-items: center; 
+    justify-content: space-between;
+    padding-bottom: 15px;
+    border-bottom: 2px solid #e5e7eb;
+    margin-bottom: 20px;
+}
 """
 
-with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
-    
-    with gr.Row():
-        with gr.Column(scale=4):
-            main_title = gr.Markdown("# Policy Coherence Annotation Tool")
-        lang_selector = gr.Dropdown(choices=list(LANG_CODES.keys()), value="English", label="Language / Langue", scale=1)
-        
-    main_desc = gr.Markdown(
-        "Evaluate how specific elements of different policies interact with one another.\n\n"
-        "**Definitions:**\n"
-        "- **Nexus Domain:** The broad sector being analyzed (e.g., Land, Water, Energy).\n"
-        "- **Policy:** The specific document under review.\n"
-        "- **Target:** The exact objective or statement you are currently evaluating.\n"
-        "- **Context:** The broader set of measures belonging to the policy, provided as background reference."
-    )
-    
-    # NEW: Accordion containing the 7 classes table
-    with gr.Accordion("Interaction Class Definitions (Click to Expand)", open=False):
-        gr.Markdown(
-            "| Interaction Label | Meaning | Implication |\n"
-            "| :--- | :--- | :--- |\n"
-            "| **+3 (Indivisible)** | Progress on one target automatically delivers progress on another | There is high level of compatibility between the two targets. |\n"
-            "| **+2 (Reinforcing)** | Progress on one target makes it easier to make progress on another | There is relatively higher level of compatibility between the targets being compared. |\n"
-            "| **+1 (Enabling)** | Progress on one target creates conditions that enable progress on another | There is a small level of compatibility between the two targets compared. |\n"
-            "| **0 (Consistent)** | There is no significant link between two targets' progress | There is no significant compatibility between the two targets being evaluated. |\n"
-            "| **-1 (Constraining)** | Progress on one target constrains the options for how to deliver on another | The targets are relatively competitive resulting in counterproductive effects. |\n"
-            "| **-2 (Counteracting)** | Progress on one target makes it more difficult to make progress on another | The targets are counterproductive and do not support each other. |\n"
-            "| **-3 (Cancelling)** | Progress on one target automatically leads to a negative impact on another | The targets are highly opposite and are highly counterproductive. Cannot deliver synergistic effects. |"
-        )
+with gr.Blocks(css=custom_css) as demo:
     
     hf_df_state = gr.State()
     user_tag_state = gr.State()
@@ -642,8 +624,33 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
     ctx_a_eng_state = gr.State("")
     ctx_b_eng_state = gr.State("")
 
-    # --- LOGIN PANEL ---
-    with gr.Group() as login_box:
+    # --- PERSISTENT HEADER ---
+    with gr.Row():
+        gr.HTML("""
+        <div class="persistent-header">
+            <div style="display: flex; align-items: center; gap: 15px;">
+                <img src="https://epic-africa.org/wp-content/uploads/2023/10/EPIC-Africa-Logo.png" alt="EPIC Africa Logo" style="height: 50px;">
+                <h2 style="margin: 0; color: #374151;">Policy Coherence Annotation Tool</h2>
+            </div>
+        </div>
+        """)
+        lang_selector = gr.Dropdown(choices=list(LANG_CODES.keys()), value="English", label="Language / Langue", min_width=120)
+
+    # --- 1. LANDING PAGE ---
+    with gr.Column(visible=True) as landing_page:
+        gr.Markdown(
+            "### Mapping Policy Synergies Across Sectors\n\n"
+            "Welcome to the EPIC Africa Policy Coherence Annotation Tool. This platform is designed to help researchers and policymakers "
+            "systematically evaluate how specific objectives within different policy documents interact with one another.\n\n"
+            "**How it works:**\n"
+            "You will be presented with a target objective from one policy and asked to score its interaction against objectives from a different policy. "
+            "By identifying whether these targets reinforce, enable, or constrain one another, you help build a comprehensive understanding of cross-sectoral coherence.\n\n"
+            "Click below to authenticate and begin your session."
+        )
+        start_btn = gr.Button("Get Started", variant="primary", size="lg")
+
+    # --- 2. LOGIN PANEL ---
+    with gr.Column(visible=False) as login_box:
         login_title = gr.Markdown("### User Authentication & Informed Consent")
         
         gr.Markdown(
@@ -666,7 +673,6 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
         login_btn = gr.Button("Login & Accept", variant="primary")
         login_status = gr.Markdown(value="Waiting for authentication...")
         
-        # Logic to disable the second question if the first is 'No'
         def toggle_followup(link_choice):
             if link_choice == "Yes":
                 return gr.update(interactive=True)
@@ -675,8 +681,8 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                 
         consent_link_radio.change(fn=toggle_followup, inputs=consent_link_radio, outputs=consent_follow_radio)
 
-    # --- EXPERTISE / SECTOR SELECTION ---
-    with gr.Group(visible=False) as sector_box:
+    # --- 3. EXPERTISE / SECTOR SELECTION ---
+    with gr.Column(visible=False) as sector_box:
         gr.Markdown("### What is your expertise?")
         sector_cb = gr.CheckboxGroup(
             choices=SECTOR_CHOICES,
@@ -684,15 +690,34 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
         )
         proceed_btn = gr.Button("Proceed to Workspace", variant="primary", size="lg")
 
-    # --- MAIN APPLICATION ---
-    with gr.Group(visible=False) as app_box:
+    # --- 4. MAIN APPLICATION ---
+    with gr.Column(visible=False) as app_box:
+        
+        main_desc = gr.Markdown(
+            "**Definitions:**\n"
+            "- **Nexus Domain:** The broad sector being analyzed (e.g., Land, Water, Energy).\n"
+            "- **Policy:** The specific document under review.\n"
+            "- **Target:** The exact objective or statement you are currently evaluating.\n"
+            "- **Context:** The broader set of measures belonging to the policy, provided as background reference."
+        )
         
+        with gr.Accordion("Interaction Class Definitions (Click to Expand)", open=False):
+            gr.Markdown(
+                "| Interaction Label | Meaning | Implication |\n"
+                "| :--- | :--- | :--- |\n"
+                "| **+3 (Indivisible)** | Progress on one target automatically delivers progress on another | There is high level of compatibility between the two targets. |\n"
+                "| **+2 (Reinforcing)** | Progress on one target makes it easier to make progress on another | There is relatively higher level of compatibility between the targets being compared. |\n"
+                "| **+1 (Enabling)** | Progress on one target creates conditions that enable progress on another | There is a small level of compatibility between the two targets compared. |\n"
+                "| **0 (Consistent)** | There is no significant link between two targets' progress | There is no significant compatibility between the two targets being evaluated. |\n"
+                "| **-1 (Constraining)** | Progress on one target constrains the options for how to deliver on another | The targets are relatively competitive resulting in counterproductive effects. |\n"
+                "| **-2 (Counteracting)** | Progress on one target makes it more difficult to make progress on another | The targets are counterproductive and do not support each other. |\n"
+                "| **-3 (Cancelling)** | Progress on one target automatically leads to a negative impact on another | The targets are highly opposite and are highly counterproductive. Cannot deliver synergistic effects. |"
+            )
+
         with gr.Accordion("Data Selection", open=True) as data_acc:
-            
-            # --- NEW LOCATION FOR BACK BUTTON ---
             with gr.Row():
                 back_to_sectors_btn = gr.Button("⬅️ Back to Sector Selection", variant="secondary", size="sm")
-                gr.Markdown("") # Empty markdown to push button to the left
+                gr.Markdown("") 
                 gr.Markdown("")
             
             with gr.Row():
@@ -710,34 +735,28 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                 target_col_dd = gr.Dropdown(choices=AVAILABLE_COLUMNS, value='Strategic objectives / directions', label="Target Column")
                 context_col_dd = gr.Dropdown(choices=AVAILABLE_COLUMNS, value='Policy Actions and Measures (PAMs)', label="Context Column")
             
-            # Just the Load Button at the bottom now
             load_btn = gr.Button("Fetch Data", variant="primary")
 
         gr.Markdown("---")
         progress_text = gr.Markdown("**Progress:** Waiting for data selection...")
 
-        with gr.Group(visible=False) as workspace_box:
+        with gr.Column(visible=False) as workspace_box:
             
-            # --- THE FIXED HEADER ---
-            # This stays naturally at the top of the workspace
             with gr.Row():
                 with gr.Column(scale=1, variant="panel"):
                     meta_a = gr.Markdown("### Source A Information")
                     display_context_a = gr.Textbox(label="Context A", interactive=False, lines=4)
-                    # display_target_a = gr.Textbox(label="Target A (Active)", interactive=False, lines=4)
                     
                 with gr.Column(scale=1, variant="panel"):
                     meta_b = gr.Markdown("### Source B Information")
                     display_context_b = gr.Textbox(label="Context B", interactive=False, lines=4)
 
-            # --- AI CHATBOT QUERY OPTION ---
             with gr.Accordion("💬 Ask AI about the Context & Policies", open=False):
                 chatbot = gr.Chatbot(height=300)
                 with gr.Row():
                     chat_input = gr.Textbox(placeholder="Ask a question about the policies or targets...", scale=4, show_label=False)
                     chat_submit = gr.Button("Send", scale=1)
 
-            # --- THE SCROLLABLE ROWS ---
             with gr.Group(elem_classes="scrollable-rows-container"):
                 bulk_title = gr.Markdown("### Bulk Coherence Evaluation")
                 bulk_desc = gr.Markdown(
@@ -746,18 +765,16 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                     "You may leave a row entirely blank to skip it."
                 )
                 
-                # --- DYNAMIC BULK ROWS ---
                 eval_rows = []
                 for i in range(MAX_ROWS):
-                    with gr.Group(visible=False, elem_classes="row-card") as row_container:
+                    with gr.Column(visible=False, elem_classes="row-card") as row_container:
                         m_coarse_st = gr.State("")
                         m_drill_st = gr.State("")
                         m_conf_st = gr.State("")
                         m_ai_just_st = gr.State("") 
                         m_ig_json_st = gr.State("")
                         
-                        # FIX: Show Target A and Target B side-by-side in every row block
-                        with gr.Row(equal_height=True):
+                        with gr.Row():
                             with gr.Column(scale=1):
                                 a_text_display = gr.Textbox(label="Target A (Active)", interactive=False, lines=3, elem_classes="scrollable-target")
                             with gr.Column(scale=1):
@@ -769,7 +786,6 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                                 conf_md = gr.Markdown("")
                             
                             with gr.Column(scale=1, min_width=200):
-                                # ADDED allow_custom_value=True to prevent strict validation crashes on swap/clear
                                 inter_dd = gr.Dropdown(choices=[], label="2. Drill Down Interaction", interactive=True, allow_custom_value=True)
                                 explain_btn = gr.Button("✨ AI Explainability", size="sm", elem_classes="explain-btn")
                                 explain_html = gr.HTML("")
@@ -780,7 +796,7 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                                 
                                 explain_btn.click(
                                     fn=generate_row_explanation,
-                                    inputs=[target_a_list_state, current_index_state, b_text, lang_selector], # Passed lang_selector here
+                                    inputs=[target_a_list_state, current_index_state, b_text, lang_selector],
                                     outputs=[explain_html, just_box, m_ai_just_st, m_ig_json_st] 
                                 )
                                 
@@ -790,16 +806,37 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
                                     outputs=[rel_radio, inter_dd, just_box]
                                 )
                         
-                        # Added a_text_display to the tuple
                         eval_rows.append((row_container, a_text_display, b_text, rel_radio, conf_md, inter_dd, just_box, m_coarse_st, m_drill_st, m_conf_st, m_ai_just_st, m_ig_json_st))
 
-            # --- NAVIGATION BUTTONS ---
             with gr.Row():
                 skip_btn = gr.Button("Skip Target A", size="lg")
                 save_btn = gr.Button("Save Filled Annotations", variant="primary", size="lg")
                 
             status_box = gr.Textbox(label="System Log", interactive=False)
 
+    # --- PERSISTENT FOOTER ---
+    gr.Markdown(
+        "---\n"
+        "<div style='text-align: center; color: #6b7280; font-size: 0.9em; padding: 10px;'>"
+        "<strong>Disclaimer:</strong> This tool is developed and maintained by EPIC Africa. "
+        "The European Union (EU) is not liable for the content, use, or outputs generated by this tool."
+        "</div>"
+    )
+
+    # --- Event binding for the Landing Page ---
+    start_btn.click(
+        fn=lambda: (gr.update(visible=False), gr.update(visible=True)),
+        inputs=None,
+        outputs=[landing_page, login_box]
+    )
+
+            # --- NAVIGATION BUTTONS ---
+            # with gr.Row():
+            #     skip_btn = gr.Button("Skip Target A", size="lg")
+            #     save_btn = gr.Button("Save Filled Annotations", variant="primary", size="lg")
+                
+            # status_box = gr.Textbox(label="System Log", interactive=False)
+
             # --- NAVIGATION BUTTONS ---
             # Kept outside the scrollable box so they are always visible at the very bottom
             # with gr.Row():
@@ -1014,7 +1051,7 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
     def render_target_a(a_list, tasks_dict, idx, lang, user_tag, pol_a, pol_b, hf_df, progress=gr.Progress()): 
         updates = []
         
-        empty_row = [gr.update(visible=False), gr.update(), gr.update(), gr.update(), gr.update(), gr.update(), gr.update(), "", "", "", "", ""]
+        empty_row = [gr.update(visible=False)] + [gr.skip()] * 11
         
         if not a_list:
             prog_txt = t_text("**Progress:** No unannotated items found.", lang)
@@ -1150,11 +1187,13 @@ with gr.Blocks(theme=gr.themes.Soft(), css=custom_css) as demo:
         progress(0.1, desc="Validating selections...")
         if not pol_a or not pol_b:
             err = t_text("Error: Select both policies.", lang)
-            return [gr.update(value=err)] + [gr.skip()] * (14 + MAX_ROWS*12) 
+            # return [gr.update(value=err)] + [gr.skip()] * (14 + MAX_ROWS*12) 
+            return [gr.skip()] * 6 + [gr.update(value=err)] + [gr.skip()] * (6 + MAX_ROWS*12)
             
         if tar_col == ctx_col:
             err = t_text("Error: Target and Context cannot be the same.", lang)
-            return [gr.update(value=err)] + [gr.skip()] * (14 + MAX_ROWS*12) 
+            # return [gr.update(value=err)] + [gr.skip()] * (14 + MAX_ROWS*12) 
+            return [gr.skip()] * 6 + [gr.update(value=err)] + [gr.skip()] * (6 + MAX_ROWS*12)
             
         progress(0.2, desc="Extracting policy structures...")
         df_a = DOMAIN_MAP[dom_a]