added: grade, subject and chapter in new chat, fixed that shitty card bug

frontend/src/components/chat-history/ChatHistory.jsx

@@ -3,9 +3,17 @@
    ======================================== */
 
 import Message from "../message/Message";
+import SelectorFlow from "../selector-flow/SelectorFlow";
 import "./ChatHistory.css";
 
-const ChatHistory = ({ messages, activeSubject, activeGrade, activeChapter, onPromptClick }) => {
+const ChatHistory = ({
+  messages,
+  activeGrade,
+  onPromptClick,
+  isTyping,
+  showSelectorFlow,
+  onGradeChange,
+}) => {
   const hasMessages = messages.length > 0;
 
   const suggestions = [
@@ -53,6 +61,8 @@ const ChatHistory = ({ messages, activeSubject, activeGrade, activeChapter, onPr
 
   const fullPromptTexts = suggestions.map((s) => s.text + s.keywords.join(" ") + s.textEnd);
 
+  const streamingMsg = messages.find((m) => m.streaming);
+
   if (hasMessages) {
     return (
       <div className="chat-history">
@@ -60,11 +70,23 @@ const ChatHistory = ({ messages, activeSubject, activeGrade, activeChapter, onPr
           {messages.map((message) => (
             <Message key={message.id} message={message} />
           ))}
+          {isTyping && !streamingMsg && (
+            <Message message={{ id: "typing", role: "assistant", text: "", streaming: true }} />
+          )}
+          <div ref={(el) => el && el.scrollIntoView({ behavior: "smooth", block: "end" })} />
         </div>
       </div>
     );
   }
 
+  if (showSelectorFlow) {
+    return (
+      <div className="chat-history">
+        <SelectorFlow grade={activeGrade} onGradeChange={onGradeChange} />
+      </div>
+    );
+  }
+
   return (
     <div className="chat-history">
       <div className="chat-history__focus">