Update app.py

app.py

@@ -4,6 +4,138 @@ import gradio as gr
 import json
 import plotly.graph_objects as go
 
+
+CONTEXTUAL_ZOOM_PROMPT = """
+You are an expert art historian specializing in interactive exploration. Analyze the query and generate contextually aware zoom configurations with explanations.
+
+###Input###
+User Query: {user_query}
+Current Zoom States: {
+    "temporal": {"level": "", "selection": ""},
+    "geographical": {"level": "", "selection": ""},
+    "style": {"level": "", "selection": ""},
+    "subject": {"level": "", "selection": ""}
+}
+
+###Output Format###
+{
+    "analysis": {
+        "query_focus": "main subject",
+        "historical_context": "brief explanation"
+    },
+    "axis_configurations": {
+        "temporal": {
+            "component": "st.slider",
+            "current_zoom": {
+                "level": "century/decade/year",
+                "range": [start, end],
+                "explanation": "Why this time range is relevant"
+            },
+            "available_zooms": {
+                "in": {
+                    "range": [narrower_start, narrower_end],
+                    "explanation": "What focusing here reveals"
+                },
+                "out": {
+                    "range": [broader_start, broader_end],
+                    "explanation": "Broader historical context"
+                }
+            },
+            "impacted_by": {
+                "geographical": "how location affects timeframe",
+                "style": "how style affects timeframe"
+            }
+        },
+        "geographical": {
+            "component": "st.map",
+            "current_zoom": {
+                "level": "continent/country/city",
+                "locations": [
+                    {
+                        "name": "",
+                        "lat": 0,
+                        "lon": 0,
+                        "relevance": "why this location matters"
+                    }
+                ]
+            },
+            "available_zooms": {
+                "in": {
+                    "locations": ["more specific locations"],
+                    "explanation": "What focusing here reveals"
+                },
+                "out": {
+                    "locations": ["broader regions"],
+                    "explanation": "Broader geographical context"
+                }
+            },
+            "impacted_by": {
+                "temporal": "how time period affects locations",
+                "style": "how style affects locations"
+            }
+        },
+        "style": {
+            "component": "st.multiselect" if current_zoom == "broad" else "st.selectbox",
+            "current_zoom": {
+                "level": "movement/sub_movement/specific",
+                "options": ["list of styles"],
+                "explanation": "Style context for this period/location"
+            }
+        }
+    },
+    "streamlit_adaptations": {
+        "recommended_components": {
+            "component_name": "reason for recommendation based on zoom level",
+            "configuration": {}
+        }
+    }
+}
+
+###Example for "paint during napoleon war"###
+{
+    "temporal": {
+        "component": "st.slider",
+        "current_zoom": {
+            "level": "period",
+            "range": [1799, 1815],
+            "explanation": "Napoleon's reign as First Consul and Emperor"[1]
+        },
+        "available_zooms": {
+            "in": {
+                "range": [1812, 1815],
+                "explanation": "Focus on final campaigns and artistic responses"[1]
+            }
+        }
+    },
+    "geographical": {
+        "component": "st.map",
+        "current_zoom": {
+            "level": "continent",
+            "locations": [
+                {
+                    "name": "France",
+                    "relevance": "Center of Napoleonic art production"[2]
+                },
+                {
+                    "name": "Spain",
+                    "relevance": "Goya's war paintings perspective"[1]
+                }
+            ]
+        }
+    }
+}
+
+###Requirements###
+1. Explain zoom level changes and their historical significance
+2. Adapt Streamlit components based on zoom level
+3. Show relationships between different axes
+4. Provide historical context for available selections
+5. Consider how selections affect other axes
+6. Include relevant historical explanations for each zoom level
+
+Generate only the JSON response, maintaining strict JSON format."""
+
+
 class ArtExplorer:
     def __init__(self):
         self.client = openai.OpenAI(
@@ -38,32 +170,119 @@ class ArtExplorer:
         return fig
 
     def get_llm_response(self, query: str, zoom_context: dict = None) -> dict:
-        system_prompt = """You are an art history expert. Generate a structured JSON configuration for an interactive art exploration interface."""
-        
-        user_prompt = f"""
-        Query: {query}
-        Zoom Level: {self.current_state['zoom_level']}
-        Current Selections: {json.dumps(zoom_context) if zoom_context else 'None'}
-        
-        Return a JSON object with configurations for temporal, geographical, and style axes.
-        Include exact coordinates for geographical locations in this format:
-        "locations": [
-            {{"name": "Paris", "lat": 48.8566, "lon": 2.3522, "description": "Center of French art"}},
-            {{"name": "Florence", "lat": 43.7696, "lon": 11.2558, "description": "Renaissance art hub"}}
-        ]
-        """
-
-        response = self.client.chat.completions.create(
-            model="mixtral-8x7b-32768",
-            messages=[
-                {"role": "system", "content": system_prompt},
-                {"role": "user", "content": user_prompt}
-            ],
-            temperature=0.1,
-            max_tokens=1024
-        )
-        
-        return json.loads(response.choices[0].message.content)
+        try:
+            # Format the CONTEXTUAL_ZOOM_PROMPT with current values
+            formatted_prompt = CONTEXTUAL_ZOOM_PROMPT.format(
+                user_query=query,
+                current_zoom_states={
+                    "temporal": {
+                        "level": self.current_state.get("zoom_level", ""),
+                        "selection": zoom_context.get("temporal") if zoom_context else ""
+                    },
+                    "geographical": {
+                        "level": self.current_state.get("zoom_level", ""),
+                        "selection": zoom_context.get("geographical") if zoom_context else ""
+                    },
+                    "style": {
+                        "level": self.current_state.get("zoom_level", ""),
+                        "selection": zoom_context.get("style") if zoom_context else ""
+                    },
+                    "subject": {
+                        "level": self.current_state.get("zoom_level", ""),
+                        "selection": zoom_context.get("subject") if zoom_context else ""
+                    }
+                }
+            )
+    
+            response = self.client.chat.completions.create(
+                model="mixtral-8x7b-32768",
+                messages=[
+                    {
+                        "role": "system",
+                        "content": "You are an expert art historian specializing in interactive exploration."
+                    },
+                    {
+                        "role": "user",
+                        "content": formatted_prompt
+                    }
+                ],
+                temperature=0.1,
+                max_tokens=2048
+            )
+            
+            result = json.loads(response.choices[0].message.content)
+            
+            # Validate response structure
+            if "axis_configurations" not in result:
+                raise KeyError("Missing axis_configurations in LLM response")
+                
+            return result
+            
+        except Exception as e:
+            print(f"Error in LLM response: {str(e)}")
+            # Return default structure following the same format as the prompt
+            return {
+                "analysis": {
+                    "query_focus": "Default focus",
+                    "historical_context": "Default historical context"
+                },
+                "axis_configurations": {
+                    "temporal": {
+                        "component": "st.slider",
+                        "current_zoom": {
+                            "level": "century",
+                            "range": [1700, 2000],
+                            "explanation": "Default time range"
+                        },
+                        "available_zooms": {
+                            "in": {
+                                "range": [1800, 1900],
+                                "explanation": "Zoom in to see more detail"
+                            },
+                            "out": {
+                                "range": [1500, 2024],
+                                "explanation": "Broader historical context"
+                            }
+                        },
+                        "impacted_by": {
+                            "geographical": "Location affects time period",
+                            "style": "Style affects time period"
+                        }
+                    },
+                    "geographical": {
+                        "component": "st.map",
+                        "current_zoom": {
+                            "level": "continent",
+                            "locations": [
+                                {
+                                    "name": "Paris",
+                                    "lat": 48.8566,
+                                    "lon": 2.3522,
+                                    "relevance": "Default location"
+                                }
+                            ]
+                        },
+                        "available_zooms": {
+                            "in": {
+                                "locations": ["Paris", "London", "Rome"],
+                                "explanation": "Major art centers"
+                            },
+                            "out": {
+                                "locations": ["Europe", "Americas", "Asia"],
+                                "explanation": "Global art movements"
+                            }
+                        }
+                    },
+                    "style": {
+                        "component": "st.multiselect",
+                        "current_zoom": {
+                            "level": "movement",
+                            "options": ["Classical", "Modern"],
+                            "explanation": "Default art movements"
+                        }
+                    }
+                }
+            }
 
     def create_interface(self):
         with gr.Blocks() as demo: