app.py

import gradio as gr
import json
from groq import Groq
import os

class ArtExplorer:
    def __init__(self):
        self.groq_client = Groq(api_key=os.getenv("GROQ_API_KEY"))
        self.current_state = {
            "zoom_level": 0,
            "selections": {
                "temporal": None,
                "geographical": None,
                "style": None
            }
        }

    def get_llm_configuration(self, query, zoom_level, current_selections=None):
        prompt = f"""
        User Query: {query}
        Current Zoom Level: {zoom_level}
        Current Selections: {json.dumps(current_selections) if current_selections else 'None'}
        
        Generate configuration for interactive art exploration interface.
        """
        
        response = self.groq_client.chat.completions.create(
            messages=[
                {"role": "system", "content": "You are an art history expert."},
                {"role": "user", "content": prompt}
            ],
            model="mixtral-8x7b-32768",
            temperature=0.1
        )
        
        return json.loads(response.choices[0].message.content)

    def create_interface(self):
        with gr.Blocks() as demo:
            gr.Markdown("# Interactive Art History Explorer")
            
            # Initial query input
            with gr.Row():
                query = gr.Textbox(label="Enter your art history query (e.g., 'Napoleon wars')")
                search_btn = gr.Button("Explore")

            # Main display area
            with gr.Row():
                # Time Period Column
                with gr.Column():
                    gr.Markdown("## Time Period")
                    time_slider = gr.Slider(
                        minimum=1000,
                        maximum=2024,
                        label="Select Time Period",
                        interactive=True
                    )
                    time_explanation = gr.Markdown("Time period context will appear here")
                    time_zoom = gr.Button("Zoom In - Timeline")

                # Geographic Column
                with gr.Column():
                    gr.Markdown("## Geographic Location")
                    map_component = gr.Map(label="Select Locations")
                    geo_explanation = gr.Markdown("Geographic context will appear here")
                    geo_zoom = gr.Button("Zoom In - Geography")

            # Style Selection
            with gr.Row():
                gr.Markdown("## Artistic Styles")
                style_dropdown = gr.Dropdown(
                    multiselect=True,
                    label="Select Styles"
                )
                style_explanation = gr.Markdown("Style context will appear here")
                style_zoom = gr.Button("Zoom In - Styles")

            # Initial search handler
            def initial_search(query):
                config = self.get_llm_configuration(query, zoom_level=0)
                
                # Update components with initial values
                return {
                    time_slider: config["temporal"]["range"],
                    map_component: config["geographical"]["locations"],
                    style_dropdown: gr.Dropdown(choices=config["style"]["options"]),
                    time_explanation: config["temporal"]["explanation"],
                    geo_explanation: config["geographical"]["explanation"],
                    style_explanation: config["style"]["explanation"]
                }

            # Zoom handlers
            def zoom_timeline(query, current_time):
                config = self.get_llm_configuration(
                    query,
                    zoom_level=self.current_state["zoom_level"] + 1,
                    current_selections={"temporal": current_time}
                )
                return {
                    time_slider: config["temporal"]["range"],
                    time_explanation: config["temporal"]["explanation"]
                }

            def zoom_geography(query, current_locations):
                config = self.get_llm_configuration(
                    query,
                    zoom_level=self.current_state["zoom_level"] + 1,
                    current_selections={"geographical": current_locations}
                )
                return {
                    map_component: config["geographical"]["locations"],
                    geo_explanation: config["geographical"]["explanation"]
                }

            def zoom_styles(query, current_styles):
                config = self.get_llm_configuration(
                    query,
                    zoom_level=self.current_state["zoom_level"] + 1,
                    current_selections={"style": current_styles}
                )
                return {
                    style_dropdown: gr.Dropdown(choices=config["style"]["options"]),
                    style_explanation: config["style"]["explanation"]
                }

            # Connect event handlers
            search_btn.click(
                fn=initial_search,
                inputs=[query],
                outputs=[time_slider, map_component, style_dropdown,
                        time_explanation, geo_explanation, style_explanation]
            )

            time_zoom.click(
                fn=zoom_timeline,
                inputs=[query, time_slider],
                outputs=[time_slider, time_explanation]
            )

            geo_zoom.click(
                fn=zoom_geography,
                inputs=[query, map_component],
                outputs=[map_component, geo_explanation]
            )

            style_zoom.click(
                fn=zoom_styles,
                inputs=[query, style_dropdown],
                outputs=[style_dropdown, style_explanation]
            )

        return demo

if __name__ == "__main__":
    explorer = ArtExplorer()
    demo = explorer.create_interface()
    demo.launch()