Update app.py

app.py

@@ -1,19 +1,26 @@
 # app.py
 import streamlit as st
-import requests
+import os
 import time
 import plotly.express as px
-import os
+from groq import Groq
 from dotenv import load_dotenv
 
 # Load environment variables
 load_dotenv()
 
+# Initialize Groq client
+try:
+    client = Groq(api_key=os.getenv("GROQ_API_KEY"))
+except:
+    st.error("Failed to initialize Groq client. Please check your API key.")
+    st.stop()
+
 # Set up Streamlit page
 st.set_page_config(
-    page_title="Legal Rights Explorer",
+    page_title="Legal Rights Explorer Pro",
     page_icon="⚖️",
-    layout="wide",
+    layout="centered",
     initial_sidebar_state="collapsed"
 )
 
@@ -23,119 +30,148 @@ st.markdown("""
     :root {
         --primary: #2c3e50;
         --secondary: #3498db;
-        --accent: #e74c3c;
+        --accent: #1abc9c;
         --light: #ecf0f1;
         --dark: #2c3e50;
         --success: #27ae60;
-        --card-shadow: 0 6px 20px rgba(0,0,0,0.1);
+        --card-shadow: 0 6px 20px rgba(0,0,0,0.08);
+        --transition: all 0.3s ease;
     }
     
     .stApp {
         background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
         color: #333;
         font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        max-width: 1000px;
+        margin: 0 auto;
     }
     
     .header {
         background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
         color: white;
-        padding: 1.8rem 2rem;
-        border-radius: 0 0 20px 20px;
+        padding: 2.5rem 2rem;
+        border-radius: 0 0 25px 25px;
         box-shadow: var(--card-shadow);
         margin-bottom: 2.5rem;
+        text-align: center;
     }
     
     .card {
         background: white;
-        border-radius: 15px;
-        padding: 1.8rem;
+        border-radius: 18px;
+        padding: 2rem;
         box-shadow: var(--card-shadow);
-        margin-bottom: 1.8rem;
-        transition: all 0.3s ease;
-        border-left: 4px solid var(--secondary);
+        margin-bottom: 2rem;
+        transition: var(--transition);
+        border-left: 5px solid var(--accent);
     }
     
     .card:hover {
         box-shadow: 0 12px 30px rgba(0,0,0,0.15);
-        transform: translateY(-5px);
     }
     
     .scenario-btn {
         width: 100%;
-        padding: 1.1rem;
+        padding: 1.2rem;
         background: linear-gradient(135deg, var(--secondary) 0%, #2980b9 100%);
         color: white;
         border: none;
-        border-radius: 12px;
+        border-radius: 15px;
         font-weight: 600;
-        margin: 0.7rem 0;
+        margin: 0.8rem 0;
         cursor: pointer;
-        transition: all 0.3s ease;
+        transition: var(--transition);
         text-align: left;
-        padding-left: 20px;
-        font-size: 1.05rem;
+        padding-left: 25px;
+        font-size: 1.1rem;
+        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
     }
     
     .scenario-btn:hover {
         background: linear-gradient(135deg, var(--primary) 0%, #2c3e50 100%);
-        transform: scale(1.02);
+        transform: translateY(-3px);
+        box-shadow: 0 8px 20px rgba(0,0,0,0.15);
     }
     
     .response-card {
         background: white;
         border-left: 5px solid var(--success);
-        border-radius: 12px;
-        padding: 2rem;
-        margin-top: 2rem;
+        border-radius: 15px;
+        padding: 2.5rem;
+        margin-top: 2.5rem;
         box-shadow: var(--card-shadow);
-        animation: fadeIn 0.6s ease;
+        animation: fadeIn 0.8s ease;
     }
     
     .country-card {
         display: flex;
         align-items: center;
         gap: 15px;
-        padding: 1.2rem;
-        border-radius: 12px;
+        padding: 1.5rem;
+        border-radius: 15px;
         background: white;
         box-shadow: var(--card-shadow);
-        margin-bottom: 15px;
+        margin-bottom: 18px;
         cursor: pointer;
-        transition: all 0.3s ease;
+        transition: var(--transition);
+        border: 2px solid transparent;
     }
     
     .country-card:hover {
-        transform: translateX(5px);
-        box-shadow: 0 8px 25px rgba(0,0,0,0.15);
+        transform: translateX(8px);
+        box-shadow: 0 10px 25px rgba(0,0,0,0.15);
     }
     
     .country-card.selected {
-        background: linear-gradient(135deg, var(--light) 0%, var(--secondary) 100%);
-        border-left: 4px solid var(--accent);
+        background: linear-gradient(135deg, var(--light) 0%, #d6eaf8 100%);
+        border: 2px solid var(--accent);
+        box-shadow: 0 8px 25px rgba(0,0,0,0.12);
     }
     
     .footer {
         text-align: center;
-        padding: 2rem;
-        margin-top: 3rem;
+        padding: 2.5rem;
+        margin-top: 3.5rem;
         color: var(--dark);
-        font-size: 0.95rem;
+        font-size: 1rem;
         background: rgba(236, 240, 241, 0.7);
-        border-radius: 15px;
+        border-radius: 20px;
+        box-shadow: var(--card-shadow);
+    }
+    
+    .spinner {
+        display: flex;
+        justify-content: center;
+        margin: 3rem 0;
     }
     
     @keyframes fadeIn {
-        from { opacity: 0; transform: translateY(20px); }
+        from { opacity: 0; transform: translateY(30px); }
         to { opacity: 1; transform: translateY(0); }
     }
     
+    @keyframes pulse {
+        0% { transform: scale(1); }
+        50% { transform: scale(1.05); }
+        100% { transform: scale(1); }
+    }
+    
+    .pulse {
+        animation: pulse 2s infinite;
+    }
+    
     @media (max-width: 768px) {
         .header {
-            padding: 1.3rem;
+            padding: 1.8rem 1.2rem;
         }
         
         .card {
-            padding: 1.3rem;
+            padding: 1.5rem;
+        }
+        
+        .scenario-btn {
+            padding: 1rem;
+            font-size: 1rem;
         }
     }
 </style>
@@ -154,7 +190,7 @@ COUNTRIES = {
     "🇧🇷 Brazil": "BR",
     "🇿🇦 South Africa": "ZA",
     "🇪🇸 Spain": "ES",
-    "🇮🇹 Italy": "IT"
+    "🇸🇬 Singapore": "SG"
 }
 
 # Common legal scenarios
@@ -173,114 +209,88 @@ SCENARIOS = [
     "Immigration Rights"
 ]
 
-# Simulated API function
-def get_legal_rights(country, scenario):
-    """Simulate API response with country-specific legal rights"""
-    # In a real implementation, this would call an external API
-    # For this demo, we'll return simulated responses
-    
-    # Simulate API delay
-    time.sleep(1.5)
-    
-    # Base rights that apply to most countries
-    base_rights = [
-        "Right to remain silent",
-        "Right to legal representation",
-        "Right to be treated with dignity and respect",
-        "Right to understand the charges against you",
-        "Right to a fair and impartial process"
-    ]
-    
-    # Country-specific additions
-    country_specific = {
-        "US": [
-            "Right to refuse unwarranted searches (4th Amendment)",
-            "Right to due process (5th Amendment)",
-            "Right to a speedy and public trial (6th Amendment)"
-        ],
-        "UK": [
-            "Right to legal advice under the Police and Criminal Evidence Act",
-            "Right to have someone informed of your arrest",
-            "Protection under the Human Rights Act 1998"
-        ],
-        "CA": [
-            "Right to be informed of the reason for detention (Charter of Rights)",
-            "Right to retain and instruct counsel without delay",
-            "Right to habeas corpus"
-        ],
-        "AU": [
-            "Right to silence during police questioning",
-            "Right to communicate with a friend or relative",
-            "Protection under the Australian Human Rights Commission Act"
-        ],
-        "IN": [
-            "Right to free legal aid under Article 39A of the Constitution",
-            "Protection against self-incrimination (Article 20)",
-            "Right to be informed of grounds for arrest (Article 22)"
-        ]
-    }
-    
-    # Scenario-specific additions
-    scenario_specific = {
-        "Traffic Stop by Police": [
-            "Right to see official identification",
-            "Right to know the reason for the stop",
-            "Right to refuse a search without probable cause",
-            "Right to record the interaction"
-        ],
-        "Workplace Discrimination": [
-            "Right to a discrimination-free workplace",
-            "Right to report without retaliation",
-            "Right to reasonable accommodations",
-            "Right to equal pay for equal work"
-        ],
-        "Medical Emergency Rights": [
-            "Right to emergency treatment regardless of insurance",
-            "Right to informed consent",
-            "Right to access medical records",
-            "Right to privacy of health information"
-        ],
-        "Arrest or Detention": [
-            "Right to be informed of charges",
-            "Right to contact your embassy if foreign national",
-            "Right to humane treatment",
-            "Right to challenge the lawfulness of detention"
-        ]
-    }
+# LLM models available on Groq
+MODELS = {
+    "Llama3-70b (Best)": "llama3-70b-8192",
+    "Llama3-8b (Fast)": "llama3-8b-8192",
+    "Mixtral-8x7b": "mixtral-8x7b-32768"
+}
+
+# Function to get rights information from Groq API
+def get_legal_rights(country, scenario, model_name):
+    """Get legal rights information using Groq API"""
+    system_prompt = f"""
+    You are an expert legal assistant specializing in {country} law. 
+    Provide clear, accurate information about an individual's rights in the given scenario.
     
-    # Combine rights based on country and scenario
-    rights = base_rights.copy()
+    Guidelines:
+    - List 5-7 key rights as bullet points
+    - Start with a brief context about the legal situation
+    - Use plain language understandable to non-lawyers
+    - Include relevant legal references when appropriate
+    - Highlight any critical actions the person should take
+    - Mention any country-specific variations
+    - Keep response under 350 words
+    - Format with emojis for readability
+    - End with important disclaimers
+    """
     
-    if country in country_specific:
-        rights.extend(country_specific[country])
+    user_prompt = f"""
+    Scenario: {scenario}
+    Country: {country}
     
-    for key, value in scenario_specific.items():
-        if key in scenario:
-            rights.extend(value)
-            break
+    Please provide a comprehensive list of rights for this situation in {country}.
+    """
     
-    # Format the response
-    response = f"## 🔍 Your Rights in {country}\n"
-    response += f"### Situation: {scenario}\n\n"
-    response += "Based on the laws of your selected country, you have the following rights:\n\n"
+    try:
+        chat_completion = client.chat.completions.create(
+            messages=[
+                {
+                    "role": "system",
+                    "content": system_prompt
+                },
+                {
+                    "role": "user",
+                    "content": user_prompt
+                }
+            ],
+            model=model_name,
+            temperature=0.3,
+            max_tokens=1024,
+            top_p=1,
+            stream=False,
+            stop=None,
+        )
+        
+        return chat_completion.choices[0].message.content
     
-    for i, right in enumerate(set(rights), 1):
-        response += f"✅ **{right}**\n\n"
+    except Exception as e:
+        st.error(f"Error fetching data: {str(e)}")
+        return None
+
+# Function to display response with animation
+def display_response(response):
+    """Display the response with typing animation effect"""
+    message_placeholder = st.empty()
+    full_response = ""
     
-    response += "\n**Important Notes:**\n"
-    response += "- This information is for educational purposes only\n"
-    response += "- Laws vary by jurisdiction and circumstances\n"
-    response += "- Consult a qualified attorney for legal advice\n"
+    # Simulate stream of response with milliseconds delay
+    for chunk in response.split():
+        full_response += chunk + " "
+        time.sleep(0.03)
+        # Add a blinking cursor to simulate typing
+        message_placeholder.markdown(f'<div class="response-card">{full_response}▌</div>', unsafe_allow_html=True)
     
-    return response
+    # Display final message without the cursor
+    message_placeholder.markdown(f'<div class="response-card">{response}</div>', unsafe_allow_html=True)
 
 # Main app
 def main():
     # Header section
     st.markdown("""
     <div class="header">
-        <h1 style="margin:0;font-size:2.3rem;">Legal Rights Explorer</h1>
-        <p style="margin:0;font-size:1.2rem;opacity:0.9;">Know your rights in any situation, anywhere in the world</p>
+        <h1 style="margin:0;font-size:2.8rem;">Legal Rights Explorer Pro</h1>
+        <p style="margin:0;font-size:1.3rem;opacity:0.9;margin-top:12px;">Know your rights • Protect your freedom</p>
     </div>
     """, unsafe_allow_html=True)
     
@@ -291,8 +301,18 @@ def main():
     if 'selected_scenario' not in st.session_state:
         st.session_state.selected_scenario = None
     
+    # Model selection at top
+    st.markdown("### ⚙️ AI Model Selection")
+    model_cols = st.columns(3)
+    with model_cols[0]:
+        selected_model = st.selectbox("Choose AI Model", list(MODELS.keys()), index=0)
+    
+    with model_cols[1]:
+        st.markdown("### 🌎 Country")
+        st.caption("Selected: " + st.session_state.selected_country)
+    
     # Main content columns
-    col1, col2 = st.columns([1, 2], gap="large")
+    col1, col2 = st.columns([1, 1.2], gap="large")
     
     with col1:
         st.markdown("### 🌍 Select Your Country")
@@ -301,14 +321,14 @@ def main():
         # Country selection cards
         for country_display in COUNTRIES.keys():
             is_selected = st.session_state.selected_country == country_display
-            card_class = "country-card selected" if is_selected else "country-card"
             
-            st.markdown(f"""
-            <div class="{card_class}" onclick="selectCountry('{country_display}')">
-                <span style="font-size:1.8rem;">{country_display.split()[0]}</span>
-                <span style="font-weight:500;">{country_display.split(' ', 1)[1]}</span>
-            </div>
-            """, unsafe_allow_html=True)
+            # Use button to capture click
+            if st.button(country_display, 
+                         key=f"btn_{country_display}",
+                         use_container_width=True,
+                         type="primary" if is_selected else "secondary"):
+                st.session_state.selected_country = country_display
+                st.rerun()
         
         # Country visualization
         st.markdown("### 📊 Global Rights Index")
@@ -320,7 +340,7 @@ def main():
             y=awareness,
             labels={'x': 'Country', 'y': 'Rights Awareness'},
             color=awareness,
-            color_continuous_scale='Blues',
+            color_continuous_scale='Teal',
             height=300
         )
         fig.update_layout(
@@ -331,12 +351,13 @@ def main():
         st.plotly_chart(fig, use_container_width=True)
         
         # Legal resources
-        with st.expander("📚 Legal Resources"):
+        with st.expander("📚 Legal Resources & References"):
             st.markdown("""
             - [United Nations Human Rights](https://www.ohchr.org/)
             - [International Justice Resource Center](https://ijrcenter.org/)
             - [Global Legal Information Network](https://www.loc.gov/law/help/legal-info.php)
             - [World Legal Information Institute](https://www.worldlii.org/)
+            - [Amnesty International](https://www.amnesty.org/)
             """)
     
     with col2:
@@ -356,28 +377,29 @@ def main():
                     st.session_state.selected_scenario = scenario
         
         # Custom scenario input
-        custom_scenario = st.text_input("**Or describe your specific situation:**", placeholder="e.g., 'Rights during home search'")
+        custom_scenario = st.text_input("**Or describe your specific situation:**", placeholder="e.g., 'Rights during home search', 'Employee privacy rights'")
         if custom_scenario:
             st.session_state.selected_scenario = custom_scenario
         
         # Response area
-        st.markdown("### ⚖️ Your Legal Rights")
+        st.markdown("### ⚖️ Your Legal Rights Analysis")
         
         if st.session_state.selected_scenario:
             country_code = COUNTRIES[st.session_state.selected_country]
             
-            with st.spinner(f"Analyzing your rights for {st.session_state.selected_scenario} in {country_code}..."):
+            with st.spinner(f"🔍 Analyzing your rights for '{st.session_state.selected_scenario}' in {country_code}..."):
                 response = get_legal_rights(
                     country_code, 
-                    st.session_state.selected_scenario
+                    st.session_state.selected_scenario,
+                    MODELS[selected_model]
                 )
                 
                 if response:
-                    st.markdown(f'<div class="response-card">{response}</div>', unsafe_allow_html=True)
+                    display_response(response)
                 else:
                     st.error("Failed to get response. Please try again.")
         else:
-            st.info("Please select a legal scenario to see your rights information")
+            st.info("👆 Please select a legal scenario to see your rights information")
             st.image("https://images.unsplash.com/photo-1589391886645-d51941baf7fb?auto=format&fit=crop&w=600&h=400", 
                      caption="Know Your Rights, Exercise Your Freedom")
             
@@ -399,28 +421,12 @@ def main():
     # Footer
     st.markdown("""
     <div class="footer">
-        <p>Legal Rights Explorer | © 2023 | For Educational Purposes Only | Not Legal Advice</p>
-        <p>Always consult a qualified attorney in your jurisdiction for your specific legal situation</p>
+        <h4>Legal Rights Explorer Pro</h4>
+        <p>© 2023 • For Educational Purposes Only • Not Legal Advice</p>
+        <p style="font-size:0.9rem;margin-top:10px;">Always consult a qualified attorney in your jurisdiction for your specific legal situation</p>
+        <p style="font-size:0.8rem;opacity:0.7;margin-top:15px;">Powered by Groq Cloud & Open-Source LLMs</p>
     </div>
     """, unsafe_allow_html=True)
-    
-    # JavaScript for country selection
-    st.markdown("""
-    <script>
-    function selectCountry(country) {
-        window.parent.document.querySelectorAll("button[kind='secondary']")[0].click();
-        setTimeout(function() {
-            const countryButtons = window.parent.document.querySelectorAll("button[kind='secondary']");
-            for (let btn of countryButtons) {
-                if (btn.innerText.includes(country)) {
-                    btn.click();
-                    break;
-                }
-            }
-        }, 100);
-    }
-    </script>
-    """, unsafe_allow_html=True)
 
 if __name__ == "__main__":
     main()