Update src/streamlit_app.py

src/streamlit_app.py

@@ -84,7 +84,7 @@ class GoogleSheetsLogger:
     def _init_google_sheets(_self):
         """Initialize Google Sheets connection with caching"""
         try:
-            creds_dict = json.loads(_self.config.google_creds_json)
+            creds_dict = json.loads(_self.config.google_sheets_credentials)
             scope = [
                 "https://www.googleapis.com/auth/spreadsheets",
                 "https://www.googleapis.com/auth/drive"
@@ -188,7 +188,7 @@ Please follow these guidelines:
                 repetition_penalty=1.1,
             )
 
-            # `response` is a string; clean it
+            # `response` will be a string, so just clean it
             cleaned_response = re.sub(r"<think>.*?</think>", "", response, flags=re.DOTALL)
             return cleaned_response.strip()
             
@@ -245,10 +245,12 @@ class HelpInterface:
     
     def render_question(self, question: str, question_id: str, is_demo: bool = False):
         """Render a single question interface"""
+        # Debug logging
         logger.info(f"Rendering question {question_id}, is_demo: {is_demo}")
         
-        # Question container styling
+        # Question container with enhanced styling
         if is_demo:
+            # Demo question styling
             st.markdown(f"""
             <div style='
                 background: linear-gradient(135deg, #fdcb6e 0%, #e17055 100%);
@@ -281,6 +283,7 @@ class HelpInterface:
             </div>
             """, unsafe_allow_html=True)
         else:
+            # Regular question styling
             st.markdown(f"""
             <div style='
                 background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
@@ -313,8 +316,10 @@ class HelpInterface:
             </div>
             """, unsafe_allow_html=True)
         
+        # Check if question is submitted
         is_submitted = self.session_manager.get_question_state(question_id, "submitted", False)
         
+        # Student response area with improved spacing - only show if not submitted
         if not is_submitted:
             st.markdown("<div style='margin: 20px 0;'>", unsafe_allow_html=True)
             st.text_area(
@@ -326,6 +331,7 @@ class HelpInterface:
             )
             st.markdown("</div>", unsafe_allow_html=True)
         
+        # Enhanced button section with better spacing and styling
         st.markdown("""
         <div style='
             margin: 30px 0 20px 0;
@@ -334,6 +340,7 @@ class HelpInterface:
         '>
         """, unsafe_allow_html=True)
         
+        # Button layout with improved spacing
         col1, col2, col3 = st.columns([1, 0.2, 1])
         
         with col1:
@@ -366,9 +373,11 @@ class HelpInterface:
                 if st.button("🔍 Need Help?", key=f"help_{question_id}", type="primary", use_container_width=True):
                     self._toggle_help(question, question_id, is_demo)
             else:
+                # Empty space to maintain layout when submitted
                 st.markdown("<div style='height: 55px;'></div>", unsafe_allow_html=True)
         
         with col2:
+            # Empty column for spacing
             st.markdown("<div style='height: 55px;'></div>", unsafe_allow_html=True)
         
         with col3:
@@ -401,6 +410,7 @@ class HelpInterface:
                 if st.button("📝 Submit Answer", key=f"submit_{question_id}", use_container_width=True):
                     self._handle_submit(question, question_id, is_demo)
             else:
+                # Submitted state with enhanced styling
                 st.markdown("""
                 <div style='
                     background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
@@ -421,22 +431,29 @@ class HelpInterface:
                 </div>
                 """, unsafe_allow_html=True)
         
+        # Close button container
         st.markdown("</div>", unsafe_allow_html=True)
         
+        # Render help section if active and not submitted
         if (self.session_manager.get_question_state(question_id, "show_sections", False) and 
             not is_submitted):
             self._render_help_section(question, question_id, is_demo)
         
+        # Add spacing between questions
         st.markdown("<div style='margin-bottom: 40px;'></div>", unsafe_allow_html=True)
     
     def _handle_submit(self, question: str, question_id: str, is_demo: bool = False):
+        """Handle submit button click"""
         logger.info(f"Handle submit called for question {question_id}, is_demo: {is_demo}")
         
+        # Set submission state
         self.session_manager.set_question_state(question_id, "submitted", True)
         
+        # Log submit only if not demo
         if not is_demo:
             help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
             retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            
             logger.info(f"Logging submit for question {question_id}")
             self.logger.log_button_click(
                 "Submit", question, SUBJECT, help_clicks, retry_count
@@ -447,108 +464,321 @@ class HelpInterface:
         st.rerun()
     
     def _toggle_help(self, question: str, question_id: str, is_demo: bool = False):
+        """Toggle help section visibility"""
         logger.info(f"Toggle help called for question {question_id}, is_demo: {is_demo}")
+        
         current_help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
         self.session_manager.set_question_state(question_id, "help_clicks", current_help_clicks + 1)
-        self.session_manager.set_question_state(question_id, "show_sections", True)
+        
+        current_show = self.session_manager.get_question_state(question_id, "show_sections", False)
+        self.session_manager.set_question_state(question_id, "show_sections", not current_show)
+        
+        # Reset other states
+        self.session_manager.set_question_state(question_id, "button_clicked", None)
         self.session_manager.set_question_state(question_id, "help_dismissed", False)
+        
+        # Log the help button click only if not demo
         if not is_demo:
             retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            logger.info(f"Logging help click for question {question_id}")
             self.logger.log_button_click(
-                "Need Help", question, SUBJECT, current_help_clicks + 1, retry_count
+                "Help", question, SUBJECT, 
+                current_help_clicks + 1, retry_count
             )
-        st.rerun()
-
+        else:
+            logger.info(f"Skipping logging for demo question {question_id}")
+    
     def _render_help_section(self, question: str, question_id: str, is_demo: bool = False):
-        st.markdown("<hr style='margin: 30px 0'>", unsafe_allow_html=True)
+        """Render the help section with options"""
+        st.markdown("""
+        <div style='
+            background: linear-gradient(135deg, #ffeaa7 0%, #fab1a0 100%);
+            padding: 15px;
+            border-radius: 10px;
+            margin: 15px 0;
+            border: 1px solid #e17055;
+            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
+        '>
+            <h4 style='
+                margin: 0 0 10px 0;
+                color: #2d3436;
+                font-size: 1.1em;
+            '>🎯 Choose Your Learning Style</h4>
+            <p style='
+                margin: 0;
+                font-size: 14px;
+                color: #636e72;
+            '>Select the type of help that works best for you:</p>
+        </div>
+        """, unsafe_allow_html=True)
+        
+        # Help option buttons in a more compact layout
         col1, col2, col3 = st.columns(3)
-        for col, btn_name in zip([col1, col2, col3],
-                                 ["Explain the question", "Give an example", "Who cares?"]):
-            with col:
-                btn_key = f"{btn_name}_{question_id}"
-                if st.button(btn_name, key=btn_key, use_container_width=True):
-                    self._handle_ai_button_click(question, question_id, btn_name, is_demo)
-
-        responses = self.session_manager.get_question_state(question_id, "responses", {})
-        last_clicked = self.session_manager.get_question_state(question_id, "button_clicked", None)
-        loading_states = self.session_manager.get_question_state(question_id, "loading_states", {})
-
-        if last_clicked and last_clicked in responses:
-            if loading_states.get(last_clicked, False):
-                with st.spinner(f"Generating {last_clicked}..."):
-                    time.sleep(0.5)
-            st.markdown(f"### {last_clicked} Response:")
-            st.write(responses[last_clicked])
-
-            retry_key = f"retry_{last_clicked}_{question_id}"
-            if st.button("🔄 Try a different explanation", key=retry_key):
-                self._retry_ai_response(question, question_id, last_clicked, is_demo)
-
-    def _handle_ai_button_click(self, question: str, question_id: str, button_name: str, is_demo: bool = False):
-        logger.info(f"AI button clicked: {button_name} for question {question_id}")
-        retry_counts = self.session_manager.get_question_state(question_id, "retry_counts", {})
-        retry_counts[button_name] = 0
-        self.session_manager.set_question_state(question_id, "retry_counts", retry_counts)
-        loading_states = self.session_manager.get_question_state(question_id, "loading_states", {})
-        loading_states[button_name] = True
-        self.session_manager.set_question_state(question_id, "loading_states", loading_states)
-        st.rerun()
-
-    def _retry_ai_response(self, question: str, question_id: str, button_name: str, is_demo: bool = False):
-        logger.info(f"Retry AI response for button {button_name} on question {question_id}")
-        retry_counts = self.session_manager.get_question_state(question_id, "retry_counts", {})
-        retry_counts[button_name] = retry_counts.get(button_name, 0) + 1
-        self.session_manager.set_question_state(question_id, "retry_counts", retry_counts)
-        loading_states = self.session_manager.get_question_state(question_id, "loading_states", {})
-        loading_states[button_name] = True
-        self.session_manager.set_question_state(question_id, "loading_states", loading_states)
+        
+        with col1:
+            if st.button("📝 Explain", key=f"explain_{question_id}", use_container_width=True):
+                self._handle_help_button("Explain the question", question, question_id, is_demo)
+        
+        with col2:
+            if st.button("💡 Example", key=f"example_{question_id}", use_container_width=True):
+                self._handle_help_button("Give an example", question, question_id, is_demo)
+        
+        with col3:
+            if st.button("🤔 Who cares?", key=f"application_{question_id}", use_container_width=True):
+                self._handle_help_button("Who cares?", question, question_id, is_demo)
+        
+        # Show response if available - NO GREEN BAR
+        current_response = self.session_manager.get_question_state(question_id, "responses", "")
+        current_button = self.session_manager.get_question_state(question_id, "button_clicked", None)
+        
+        if current_response and current_button:
+            # Simply display the response without any container styling
+            st.write(current_response)
+            
+            self._render_action_buttons(question, question_id, is_demo)
+    
+    def _handle_help_button(self, button_name: str, question: str, question_id: str, is_demo: bool = False):
+        """Handle help button click and generate response"""
+        logger.info(f"Handle help button called: {button_name} for question {question_id}, is_demo: {is_demo}")
+        
+        # Log button click only if not demo
+        if not is_demo:
+            help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
+            retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            
+            logger.info(f"Logging {button_name} click for question {question_id}")
+            self.logger.log_button_click(
+                button_name, question, SUBJECT, help_clicks, retry_count
+            )
+        else:
+            logger.info(f"Skipping logging for demo question {question_id}")
+        
+        # Generate response
+        with st.spinner("Generating response..."):
+            retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            response = self.ai_assistant.generate_response(button_name, question, retry_count)
+            
+            # Store response and button clicked
+            self.session_manager.set_question_state(question_id, "responses", response)
+            self.session_manager.set_question_state(question_id, "button_clicked", button_name)
+            self.session_manager.set_question_state(question_id, "retry_counts", 0)
+        
         st.rerun()
-
-    def _generate_and_store_response(self, question: str, question_id: str, button_name: str):
-        retry_counts = self.session_manager.get_question_state(question_id, "retry_counts", {})
-        retry_count = retry_counts.get(button_name, 0)
-        response = self.ai_assistant.generate_response(button_name, question, retry_count)
-        responses = self.session_manager.get_question_state(question_id, "responses", {})
-        responses[button_name] = response
-        self.session_manager.set_question_state(question_id, "responses", responses)
-        self.session_manager.set_question_state(question_id, "button_clicked", button_name)
-        loading_states = self.session_manager.get_question_state(question_id, "loading_states", {})
-        loading_states[button_name] = False
-        self.session_manager.set_question_state(question_id, "loading_states", loading_states)
-
-        if not question_id.startswith("demo"):
+    
+    def _render_action_buttons(self, question: str, question_id: str, is_demo: bool = False):
+        """Render action buttons after showing response"""
+        st.markdown("<div style='margin-top: 15px;'>", unsafe_allow_html=True)
+        col1, col2, col3 = st.columns(3)
+        
+        with col1:
+            if st.button("🔄 Retry", key=f"retry_{question_id}", use_container_width=True):
+                self._handle_retry(question, question_id, is_demo)
+        
+        with col2:
+            if st.button("💬 ChatGPT", key=f"chatgpt_{question_id}", use_container_width=True):
+                self._handle_chatgpt_redirect(question, question_id, is_demo)
+        
+        with col3:
+            if st.button("✅ Helped!", key=f"thanks_{question_id}", use_container_width=True):
+                self._handle_thank_you(question, question_id, is_demo)
+        
+        st.markdown("</div>", unsafe_allow_html=True)
+    
+    def _handle_retry(self, question: str, question_id: str, is_demo: bool = False):
+        """Handle retry button click"""
+        logger.info(f"Handle retry called for question {question_id}, is_demo: {is_demo}")
+        
+        current_retry = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+        new_retry_count = current_retry + 1
+        
+        self.session_manager.set_question_state(question_id, "retry_counts", new_retry_count)
+        
+        # Log retry only if not demo
+        if not is_demo:
             help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
-            self.logger.log_button_click(button_name, question, SUBJECT, help_clicks, retry_count)
-
-    def run(self):
-        st.title("📚 Interactive Help Interface for Precalculus")
-        demo_question = DEFAULT_QUESTIONS[0]
-        self.render_question(demo_question, "demo_1", is_demo=True)
-
-        for i, question in enumerate(DEFAULT_QUESTIONS[1:], start=1):
-            self.render_question(question, f"q{i+1}", is_demo=False)
-
-        for question_id in st.session_state.get("button_clicked", {}):
-            button_name = st.session_state["button_clicked"].get(question_id)
-            loading_states = st.session_state.get("loading_states", {})
-            if button_name and loading_states.get(button_name, False):
-                question = None
-                if question_id.startswith("demo"):
-                    question = demo_question
-                else:
-                    idx = int(question_id[1:]) - 2
-                    if 0 <= idx < len(DEFAULT_QUESTIONS[1:]):
-                        question = DEFAULT_QUESTIONS[idx + 1]
-                if question:
-                    self._generate_and_store_response(question, question_id, button_name)
-                    st.rerun()
-
+            logger.info(f"Logging retry for question {question_id}")
+            self.logger.log_button_click(
+                "More help", question, SUBJECT, help_clicks, new_retry_count
+            )
+        else:
+            logger.info(f"Skipping retry logging for demo question {question_id}")
+        
+        # Generate new response
+        current_button = self.session_manager.get_question_state(question_id, "button_clicked", None)
+        if current_button:
+            with st.spinner("Generating alternative response..."):
+                response = self.ai_assistant.generate_response(current_button, question, new_retry_count)
+                self.session_manager.set_question_state(question_id, "responses", response)
+            st.rerun()
+    
+    def _handle_chatgpt_redirect(self, question: str, question_id: str, is_demo: bool = False):
+        """Handle ChatGPT redirect"""
+        logger.info(f"Handle ChatGPT redirect called for question {question_id}, is_demo: {is_demo}")
+        
+        # Log only if not demo
+        if not is_demo:
+            help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
+            retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            
+            logger.info(f"Logging ChatGPT redirect for question {question_id}")
+            self.logger.log_button_click(
+                "Take me to ChatGPT", question, SUBJECT, help_clicks, retry_count
+            )
+        else:
+            logger.info(f"Skipping ChatGPT redirect logging for demo question {question_id}")
+        
+        st.markdown(f"""
+        <div style='text-align: center; margin: 15px 0;'>
+            <a href="https://chat.openai.com" target="_blank" style="
+                display: inline-block;
+                background: linear-gradient(135deg, #10A37F 0%, #0e8c6b 100%);
+                color: white;
+                padding: 12px 24px;
+                text-decoration: none;
+                border-radius: 8px;
+                font-weight: 500;
+                box-shadow: 0 4px 15px rgba(16, 163, 127, 0.3);
+                transition: all 0.3s ease;
+            ">🌐 Open ChatGPT</a>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    def _handle_thank_you(self, question: str, question_id: str, is_demo: bool = False):
+        """Handle thank you button click"""
+        logger.info(f"Handle thank you called for question {question_id}, is_demo: {is_demo}")
+        
+        # Log only if not demo
+        if not is_demo:
+            help_clicks = self.session_manager.get_question_state(question_id, "help_clicks", 0)
+            retry_count = self.session_manager.get_question_state(question_id, "retry_counts", 0)
+            
+            logger.info(f"Logging thank you for question {question_id}")
+            self.logger.log_button_click(
+                "Thank you", question, SUBJECT, help_clicks, retry_count
+            )
+        else:
+            logger.info(f"Skipping thank you logging for demo question {question_id}")
+        
+        # Hide help section
+        self.session_manager.set_question_state(question_id, "show_sections", False)
+        self.session_manager.set_question_state(question_id, "help_dismissed", True)
+        
+        st.success("🎉 Glad I could help! Feel free to ask for help anytime.")
+        st.rerun()
 
-# Main entry point for Streamlit app
 def main():
+    """Main application entry point"""
+    st.markdown("""
+    <div style='
+        text-align: center;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        padding: 30px;
+        border-radius: 20px;
+        margin-bottom: 30px;
+        box-shadow: 0 10px 40px rgba(0,0,0,0.15);
+    '>
+        <h1 style='
+            color: white;
+            margin: 0 0 10px 0;
+            font-size: 2.5em;
+            text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
+        '>🎓 Interactive Learning Quiz</h1>
+        <p style='
+            color: #e8eaed;
+            margin: 0;
+            font-size: 1.2em;
+            font-weight: 300;
+        '>Subject: {SUBJECT}</p>
+    </div>
+    """.format(SUBJECT=SUBJECT), unsafe_allow_html=True)
+    
+    # Initialize configuration and interface
     config = ConfigManager()
-    app = HelpInterface(config)
-    app.run()
+    interface = HelpInterface(config)
+    
+    # Render questions with proper numbering
+    question_number = 1
+    for i, question in enumerate(DEFAULT_QUESTIONS):
+        if i == 0:
+            # First question is demo - no logging, special styling
+            interface.render_question(question, "demo", is_demo=True)
+        else:
+            # Regular questions with logging and proper numbering (1, 2, 3, 4, 5)
+            interface.render_question(question, str(question_number), is_demo=False)
+            question_number += 1
+    
+    # Add custom CSS for enhanced styling
+    st.markdown("""
+    <style>
+    /* Enhanced button styling */
+    .stButton > button {
+        height: 2.5em;
+        font-size: 0.9rem;
+        border-radius: 8px;
+        transition: all 0.3s ease;
+        border: none;
+        font-weight: 500;
+    }
+    
+    .stButton > button:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 6px 20px rgba(0,0,0,0.15);
+    }
+    
+    /* Primary button styling */
+    .stButton > button[kind="primary"] {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+    }
+    
+    /* Text area styling */
+    .stTextArea > div > div > textarea {
+        border-radius: 10px;
+        border: 2px solid #e0e4e7;
+        font-size: 16px;
+        padding: 12px;
+        transition: all 0.3s ease;
+    }
+    
+    .stTextArea > label {
+        font-size: 14px;
+        font-weight: 500;
+        color: #666;
+    }
+    
+    .stTextArea > div > div > textarea:focus {
+        border-color: #667eea;
+        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
+    }
+    
+    /* Remove default spacing */
+    .block-container {
+        padding-top: 2rem;
+        padding-bottom: 2rem;
+    }
+    
+    /* Custom spacing */
+    .stMarkdown {
+        margin-bottom: 0;
+    }
+    
+    /* Success message styling */
+    .stSuccess {
+        background: linear-gradient(135deg, #00b894 0%, #00a085 100%);
+        border: none;
+        border-radius: 10px;
+        padding: 15px;
+        color: white;
+    }
+    
+    /* Spinner styling */
+    .stSpinner {
+        color: #667eea;
+    }
+    </style>
+    """, unsafe_allow_html=True)
 
 if __name__ == "__main__":
     main()
+
+