Spaces:
Running
Running
Update ui/ui_main_page_enhancements.py
Browse files- ui/ui_main_page_enhancements.py +101 -49
ui/ui_main_page_enhancements.py
CHANGED
@@ -521,29 +521,42 @@ def update_report_display_enhanced(selected_report_id: str, current_token_state:
|
|
521 |
)
|
522 |
|
523 |
def build_main_app_ui(
|
524 |
-
PLOT_ID_TO_FORMULA_KEY_MAP,
|
525 |
-
PLOT_FORMULAS,
|
526 |
-
BOMB_ICON
|
527 |
-
|
528 |
-
|
529 |
-
|
530 |
-
|
531 |
-
|
532 |
-
|
533 |
-
|
534 |
-
|
535 |
-
|
536 |
-
|
537 |
-
|
538 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
539 |
"""
|
540 |
Builds the main Gradio application UI with enhanced styling and structure.
|
541 |
-
|
542 |
Args:
|
543 |
(All necessary functions and constants are passed as arguments to ensure self-containment
|
544 |
within the UI module without direct imports of non-UI related logic)
|
545 |
AGENTIC_MODULES_LOADED (bool): Whether agentic modules are loaded
|
546 |
get_initial_okr_display_func (callable): Function to get initial OKR display
|
|
|
|
|
|
|
|
|
|
|
547 |
|
548 |
Returns:
|
549 |
tuple: A tuple containing:
|
@@ -559,6 +572,9 @@ def build_main_app_ui(
|
|
559 |
- agentic_display_outputs (list): List of Gradio components for agentic results.
|
560 |
- analytics_tab_instance (AnalyticsTab): The analytics tab instance itself.
|
561 |
- chat_histories_st (gr.State): State for chat histories.
|
|
|
|
|
|
|
562 |
"""
|
563 |
app = gr.Blocks(
|
564 |
theme=custom_theme,
|
@@ -570,7 +586,6 @@ def build_main_app_ui(
|
|
570 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
571 |
"""
|
572 |
)
|
573 |
-
|
574 |
with app:
|
575 |
# --- STATE MANAGEMENT ---
|
576 |
token_state = gr.State(value={
|
@@ -583,18 +598,15 @@ def build_main_app_ui(
|
|
583 |
"config_date_col_followers": "date", "config_media_type_col": "media_type",
|
584 |
"config_eb_labels_col": "li_eb_label"
|
585 |
})
|
586 |
-
|
587 |
# States for analytics tab chatbot
|
588 |
chat_histories_st = gr.State({})
|
589 |
current_chat_plot_id_st = gr.State(None)
|
590 |
plot_data_for_chatbot_st = gr.State({})
|
591 |
-
|
592 |
# States for agentic results display
|
593 |
orchestration_raw_results_st = gr.State(None)
|
594 |
# KEPT for compatibility with load_and_display_agentic_results signature
|
595 |
key_results_for_selection_st = gr.State([])
|
596 |
selected_key_result_ids_st = gr.State([])
|
597 |
-
|
598 |
# --- NEW: Session-specific cache for reconstructed OKR data ---
|
599 |
reconstruction_cache_st = gr.State({})
|
600 |
# NEW: State to hold the actionable_okrs dictionary explicitly
|
@@ -610,18 +622,17 @@ def build_main_app_ui(
|
|
610 |
<div class="subtitle">Advanced Analytics & AI-Powered Insights for LinkedIn Organizations</div>
|
611 |
</div>
|
612 |
""")
|
613 |
-
|
614 |
-
# Hidden components for token management
|
615 |
url_user_token_display = gr.Textbox(label="User Token (Hidden)", interactive=False, visible=False)
|
616 |
org_urn_display = gr.Textbox(label="Org URN (Hidden)", interactive=False, visible=False)
|
617 |
-
|
618 |
# Status section with better styling
|
619 |
with gr.Row():
|
620 |
with gr.Column():
|
621 |
gr.HTML('<div class="status-container">')
|
622 |
status_box = gr.Textbox(
|
623 |
-
label="🔄 System Status",
|
624 |
-
interactive=False,
|
625 |
value="🔄 Initializing dashboard...",
|
626 |
elem_classes=["status-display"]
|
627 |
)
|
@@ -629,7 +640,6 @@ def build_main_app_ui(
|
|
629 |
|
630 |
# Instantiate AnalyticsTab here, after all its required gr.State components are defined
|
631 |
from services.analytics_tab_module import AnalyticsTab # Local import to ensure it's loaded within context
|
632 |
-
|
633 |
analytics_icons = {'bomb': BOMB_ICON, 'explore': EXPLORE_ICON, 'formula': FORMULA_ICON, 'active': ACTIVE_ICON}
|
634 |
analytics_tab_instance = AnalyticsTab(
|
635 |
token_state=token_state,
|
@@ -651,7 +661,6 @@ def build_main_app_ui(
|
|
651 |
with gr.TabItem("🏠 Home", id="tab_home", elem_classes=["tabitem"]):
|
652 |
# Call the new function from ui_generators to build the Home tab content
|
653 |
btn_graphs, btn_reports, btn_okr, btn_help = build_home_tab_ui_func()
|
654 |
-
|
655 |
# Link buttons to tab selection
|
656 |
btn_graphs.click(fn=lambda: gr.update(selected="tab_analytics_module"), outputs=tabs)
|
657 |
btn_reports.click(fn=lambda: gr.update(selected="tab_agentic_report"), outputs=tabs)
|
@@ -679,7 +688,6 @@ def build_main_app_ui(
|
|
679 |
</div>
|
680 |
</div>
|
681 |
""")
|
682 |
-
|
683 |
# The `AGENTIC_MODULES_LOADED` check should control visibility from app.py, not prevent creation here
|
684 |
# to avoid NoneType errors during UI building.
|
685 |
if not AGENTIC_MODULES_LOADED: # This check is for conditional display, not creation
|
@@ -711,7 +719,6 @@ def build_main_app_ui(
|
|
711 |
key_results_cbg = gr.CheckboxGroup(label="Select Key Results", choices=[], value=[], interactive=True)
|
712 |
gr.Markdown("### Detailed OKRs and Tasks (OLD UI - HIDDEN)")
|
713 |
okr_detail_display_md = gr.Markdown("I dettagli OKR appariranno qui.")
|
714 |
-
|
715 |
# NEW: Add the enhanced OKR display HTML component
|
716 |
enhanced_okr_display_html = create_enhanced_okr_tab_func()
|
717 |
|
@@ -724,28 +731,73 @@ def build_main_app_ui(
|
|
724 |
</p>
|
725 |
</div>
|
726 |
""")
|
727 |
-
|
728 |
-
|
729 |
-
|
730 |
-
|
731 |
-
|
732 |
-
|
733 |
-
|
734 |
-
|
735 |
-
|
736 |
-
|
737 |
-
|
738 |
-
|
739 |
-
|
740 |
-
|
741 |
-
|
742 |
-
|
743 |
-
|
744 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
745 |
|
746 |
return (app, url_user_token_display, org_urn_display, status_box,
|
747 |
token_state, reconstruction_cache_st, enhanced_okr_display_html,
|
748 |
tabs, report_selector_dd, agentic_display_outputs,
|
749 |
-
analytics_tab_instance, chat_histories_st,
|
750 |
-
current_chat_plot_id_st, plot_data_for_chatbot_st, #
|
751 |
format_report_for_display_func) # Return format_report_for_display_func as well
|
|
|
521 |
)
|
522 |
|
523 |
def build_main_app_ui(
|
524 |
+
PLOT_ID_TO_FORMULA_KEY_MAP: Dict[str, Any],
|
525 |
+
PLOT_FORMULAS: Dict[str, Any],
|
526 |
+
BOMB_ICON: str,
|
527 |
+
EXPLORE_ICON: str,
|
528 |
+
FORMULA_ICON: str,
|
529 |
+
ACTIVE_ICON: str,
|
530 |
+
build_analytics_tab_plot_area_func: Callable,
|
531 |
+
update_analytics_plots_figures_func: Callable,
|
532 |
+
create_placeholder_plot_func: Callable,
|
533 |
+
get_initial_insight_prompt_and_suggestions_func: Callable,
|
534 |
+
generate_llm_response_func: Callable,
|
535 |
+
build_home_tab_ui_func: Callable,
|
536 |
+
create_enhanced_report_tab_func: Callable,
|
537 |
+
create_enhanced_okr_tab_func: Callable,
|
538 |
+
format_report_for_display_func: Callable, # New argument to pass the formatting function
|
539 |
+
AGENTIC_MODULES_LOADED: bool, # ADD THIS PARAMETER
|
540 |
+
get_initial_okr_display_func: Callable = None, # ADD THIS PARAMETER TOO
|
541 |
+
# NEW: Added parameters for initial event binding functions
|
542 |
+
initial_data_load_sequence_func: Callable = None,
|
543 |
+
get_url_user_token_func: Callable = None,
|
544 |
+
load_and_display_agentic_results_func: Callable = None,
|
545 |
+
format_okrs_for_enhanced_display_func: Callable = None,
|
546 |
+
update_report_display_enhanced_func: Callable = None
|
547 |
+
) -> tuple:
|
548 |
"""
|
549 |
Builds the main Gradio application UI with enhanced styling and structure.
|
|
|
550 |
Args:
|
551 |
(All necessary functions and constants are passed as arguments to ensure self-containment
|
552 |
within the UI module without direct imports of non-UI related logic)
|
553 |
AGENTIC_MODULES_LOADED (bool): Whether agentic modules are loaded
|
554 |
get_initial_okr_display_func (callable): Function to get initial OKR display
|
555 |
+
initial_data_load_sequence_func (callable): Function to handle initial data load.
|
556 |
+
get_url_user_token_func (callable): Function to get URL user token.
|
557 |
+
load_and_display_agentic_results_func (callable): Function to load and display agentic results.
|
558 |
+
format_okrs_for_enhanced_display_func (callable): Function to format OKRs for enhanced display.
|
559 |
+
update_report_display_enhanced_func (callable): Function to update enhanced report display.
|
560 |
|
561 |
Returns:
|
562 |
tuple: A tuple containing:
|
|
|
572 |
- agentic_display_outputs (list): List of Gradio components for agentic results.
|
573 |
- analytics_tab_instance (AnalyticsTab): The analytics tab instance itself.
|
574 |
- chat_histories_st (gr.State): State for chat histories.
|
575 |
+
- current_chat_plot_id_st (gr.State): State for current chat plot ID.
|
576 |
+
- plot_data_for_chatbot_st (gr.State): State for plot data for chatbot.
|
577 |
+
- format_report_for_display_func (callable): The report display formatting function.
|
578 |
"""
|
579 |
app = gr.Blocks(
|
580 |
theme=custom_theme,
|
|
|
586 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
587 |
"""
|
588 |
)
|
|
|
589 |
with app:
|
590 |
# --- STATE MANAGEMENT ---
|
591 |
token_state = gr.State(value={
|
|
|
598 |
"config_date_col_followers": "date", "config_media_type_col": "media_type",
|
599 |
"config_eb_labels_col": "li_eb_label"
|
600 |
})
|
|
|
601 |
# States for analytics tab chatbot
|
602 |
chat_histories_st = gr.State({})
|
603 |
current_chat_plot_id_st = gr.State(None)
|
604 |
plot_data_for_chatbot_st = gr.State({})
|
|
|
605 |
# States for agentic results display
|
606 |
orchestration_raw_results_st = gr.State(None)
|
607 |
# KEPT for compatibility with load_and_display_agentic_results signature
|
608 |
key_results_for_selection_st = gr.State([])
|
609 |
selected_key_result_ids_st = gr.State([])
|
|
|
610 |
# --- NEW: Session-specific cache for reconstructed OKR data ---
|
611 |
reconstruction_cache_st = gr.State({})
|
612 |
# NEW: State to hold the actionable_okrs dictionary explicitly
|
|
|
622 |
<div class="subtitle">Advanced Analytics & AI-Powered Insights for LinkedIn Organizations</div>
|
623 |
</div>
|
624 |
""")
|
625 |
+
# Hidden components for token management
|
|
|
626 |
url_user_token_display = gr.Textbox(label="User Token (Hidden)", interactive=False, visible=False)
|
627 |
org_urn_display = gr.Textbox(label="Org URN (Hidden)", interactive=False, visible=False)
|
628 |
+
|
629 |
# Status section with better styling
|
630 |
with gr.Row():
|
631 |
with gr.Column():
|
632 |
gr.HTML('<div class="status-container">')
|
633 |
status_box = gr.Textbox(
|
634 |
+
label="🔄 System Status",
|
635 |
+
interactive=False,
|
636 |
value="🔄 Initializing dashboard...",
|
637 |
elem_classes=["status-display"]
|
638 |
)
|
|
|
640 |
|
641 |
# Instantiate AnalyticsTab here, after all its required gr.State components are defined
|
642 |
from services.analytics_tab_module import AnalyticsTab # Local import to ensure it's loaded within context
|
|
|
643 |
analytics_icons = {'bomb': BOMB_ICON, 'explore': EXPLORE_ICON, 'formula': FORMULA_ICON, 'active': ACTIVE_ICON}
|
644 |
analytics_tab_instance = AnalyticsTab(
|
645 |
token_state=token_state,
|
|
|
661 |
with gr.TabItem("🏠 Home", id="tab_home", elem_classes=["tabitem"]):
|
662 |
# Call the new function from ui_generators to build the Home tab content
|
663 |
btn_graphs, btn_reports, btn_okr, btn_help = build_home_tab_ui_func()
|
|
|
664 |
# Link buttons to tab selection
|
665 |
btn_graphs.click(fn=lambda: gr.update(selected="tab_analytics_module"), outputs=tabs)
|
666 |
btn_reports.click(fn=lambda: gr.update(selected="tab_agentic_report"), outputs=tabs)
|
|
|
688 |
</div>
|
689 |
</div>
|
690 |
""")
|
|
|
691 |
# The `AGENTIC_MODULES_LOADED` check should control visibility from app.py, not prevent creation here
|
692 |
# to avoid NoneType errors during UI building.
|
693 |
if not AGENTIC_MODULES_LOADED: # This check is for conditional display, not creation
|
|
|
719 |
key_results_cbg = gr.CheckboxGroup(label="Select Key Results", choices=[], value=[], interactive=True)
|
720 |
gr.Markdown("### Detailed OKRs and Tasks (OLD UI - HIDDEN)")
|
721 |
okr_detail_display_md = gr.Markdown("I dettagli OKR appariranno qui.")
|
|
|
722 |
# NEW: Add the enhanced OKR display HTML component
|
723 |
enhanced_okr_display_html = create_enhanced_okr_tab_func()
|
724 |
|
|
|
731 |
</p>
|
732 |
</div>
|
733 |
""")
|
734 |
+
|
735 |
+
# Ensure agentic_display_outputs correctly maps to the newly created components
|
736 |
+
# This list must match the outputs of load_and_display_agentic_results
|
737 |
+
# These variables are now defined within the `with app:` block
|
738 |
+
agentic_display_outputs = [
|
739 |
+
agentic_pipeline_status_md, # 0: Status Markdown (hidden)
|
740 |
+
report_selector_dd, # 1: Dropdown for selecting reports
|
741 |
+
key_results_cbg if AGENTIC_MODULES_LOADED else gr.State([]), # Ensure it's a component or dummy state
|
742 |
+
okr_detail_display_md if AGENTIC_MODULES_LOADED else gr.State(None), # Ensure it's a component or dummy state
|
743 |
+
orchestration_raw_results_st, # 4: Raw results state
|
744 |
+
selected_key_result_ids_st, # 5: Selected KR IDs state (kept hidden)
|
745 |
+
key_results_for_selection_st, # 6: All KRs for selection state (kept hidden)
|
746 |
+
report_header_html_display, # 7: New HTML output for header
|
747 |
+
report_body_markdown_display, # 8: New Markdown output for body
|
748 |
+
reconstruction_cache_st, # 9: Reconstruction cache state
|
749 |
+
enhanced_okr_display_html, # 10: The enhanced HTML display for OKRs
|
750 |
+
actionable_okrs_data_st # 11: NEW: The actionable_okrs dictionary state
|
751 |
+
]
|
752 |
+
|
753 |
+
# Event handlers (moved here to be within the gr.Blocks context)
|
754 |
+
if get_url_user_token_func: # Check if the function is provided
|
755 |
+
app.load(fn=get_url_user_token_func, inputs=None, outputs=[url_user_token_display, org_urn_display], api_name="get_url_params", show_progress=False)
|
756 |
+
|
757 |
+
if AGENTIC_MODULES_LOADED and update_report_display_enhanced_func: # Check if function is provided
|
758 |
+
report_selector_dd.change(
|
759 |
+
fn=lambda sr_id, c_state: update_report_display_enhanced_func(sr_id, c_state, format_report_for_display_func),
|
760 |
+
inputs=[report_selector_dd, token_state],
|
761 |
+
outputs=[agentic_display_outputs[7], agentic_display_outputs[8]], # report_header_html_display, report_body_markdown_display
|
762 |
+
show_progress="minimal"
|
763 |
+
)
|
764 |
+
|
765 |
+
if initial_data_load_sequence_func: # Check if function is provided
|
766 |
+
initial_load_event = org_urn_display.change(
|
767 |
+
fn=initial_data_load_sequence_func,
|
768 |
+
inputs=[url_user_token_display, org_urn_display, token_state],
|
769 |
+
outputs=[status_box, token_state],
|
770 |
+
show_progress="full"
|
771 |
+
)
|
772 |
+
|
773 |
+
# Chain the loading events
|
774 |
+
if analytics_tab_instance:
|
775 |
+
initial_load_event.then(
|
776 |
+
fn=analytics_tab_instance.refresh_analytics_graphs_ui,
|
777 |
+
inputs=[token_state, analytics_tab_instance.date_filter_selector, analytics_tab_instance.custom_start_date_picker,
|
778 |
+
analytics_tab_instance.custom_end_date_picker, chat_histories_st], # Changed from chat_histories_st_returned
|
779 |
+
outputs=analytics_tab_instance.graph_refresh_outputs_list,
|
780 |
+
show_progress="full"
|
781 |
+
)
|
782 |
+
if AGENTIC_MODULES_LOADED and load_and_display_agentic_results_func:
|
783 |
+
initial_load_event.then(
|
784 |
+
fn=load_and_display_agentic_results_func,
|
785 |
+
inputs=[token_state, reconstruction_cache_st],
|
786 |
+
outputs=agentic_display_outputs,
|
787 |
+
show_progress="minimal"
|
788 |
+
)
|
789 |
+
if AGENTIC_MODULES_LOADED and format_okrs_for_enhanced_display_func:
|
790 |
+
initial_load_event.then(
|
791 |
+
fn=format_okrs_for_enhanced_display_func,
|
792 |
+
inputs=[reconstruction_cache_st],
|
793 |
+
outputs=[enhanced_okr_display_html],
|
794 |
+
show_progress="minimal"
|
795 |
+
)
|
796 |
+
|
797 |
|
798 |
return (app, url_user_token_display, org_urn_display, status_box,
|
799 |
token_state, reconstruction_cache_st, enhanced_okr_display_html,
|
800 |
tabs, report_selector_dd, agentic_display_outputs,
|
801 |
+
analytics_tab_instance, chat_histories_st, # Returned directly as defined in this function
|
802 |
+
current_chat_plot_id_st, plot_data_for_chatbot_st, # Returned directly as defined in this function
|
803 |
format_report_for_display_func) # Return format_report_for_display_func as well
|