move from Gradio_UI to web fe

.dockerignore

@@ -0,0 +1,14 @@
+.git
+.gitignore
+.env
+__pycache__
+*.pyc
+*.pyo
+*.pyd
+.Python
+env/
+venv/
+.venv/
+node_modules/
+npm-debug.log
+logs/

.gitignore

@@ -1,3 +1,14 @@
+.git
+.gitignore
+.env
+__pycache__
+*.pyc
+*.pyo
+*.pyd
+.Python
+env/
+venv/
 .venv/
-__pycache__/
-.env
+node_modules/
+npm-debug.log
+logs/

Dockerfile

@@ -1,24 +1,42 @@
 FROM python:3.12-slim
 
-RUN useradd -m -u 1000 user
-ENV PATH="/home/user/.local/bin:$PATH"
-
 WORKDIR /app
 
 # Install system packages as root
 RUN apt-get update && \
-    apt-get install -y --no-install-recommends wget git && \
+    apt-get install -y --no-install-recommends wget git curl && \
+    curl -fsSL https://deb.nodesource.com/setup_18.x | bash - && \
+    apt-get install -y nodejs && \
     rm -rf /var/lib/apt/lists/*
 
-# Switch to non-root user for the rest of the build
+# Create logs directory as root and set permissions
+RUN mkdir -p logs
+
+# Create a non-root user and set permissions
+RUN useradd -m -u 1000 user && \
+    chown -R user:user /app
+
+# Switch to non-root user
 USER user
+ENV PATH="/home/user/.local/bin:$PATH"
 
-COPY --chown=user requirements.txt requirements.txt
-RUN pip install --upgrade -r requirements.txt
+# Copy Python requirements and install
+COPY --chown=user requirements.txt .
+RUN pip install --user --no-cache-dir -r requirements.txt
 
-COPY --chown=user . /app
+# Copy the entire project
+COPY --chown=user . .
+
+# Set up React frontend
+WORKDIR /app/frontend
+
+# Install dependencies and build
+RUN npm install && npm run build
+
+# Back to main app directory
+WORKDIR /app
 
-# Expose Gradio port (used by Hugging Face Spaces)
+# Expose port (used by FastAPI)
 EXPOSE 7860
 
 CMD ["python", "main.py"]

Gradio_UI.py

@@ -1,99 +0,0 @@
-import gradio as gr
-from typing import Optional
-import os
-from fastapi.responses import RedirectResponse
-
-class GradioUI:
-    """A Gradio interface that serves as a frontend for the agent API"""
-
-    def __init__(self, agent=None, file_upload_folder: str = None):
-        self.agent = agent
-        self.file_upload_folder = file_upload_folder
-        
-        if self.file_upload_folder is not None:
-            if not os.path.exists(file_upload_folder):
-                os.makedirs(file_upload_folder, exist_ok=True)
-
-    def create_interface(self):
-        with gr.Blocks(css="""
-            #main-container {
-                display: flex;
-                height: 100%;
-            }
-            #menu-column {
-                min-height: 600px;
-                border-right: 1px solid #ddd;
-            }
-            #chat-column {
-                min-height: 600px;
-                flex-grow: 1;
-            }
-            .button-container {
-                padding: 10px;
-            }
-        """) as interface:
-            with gr.Row(elem_id="main-container"):
-                # Left menu strip (1/4 width)
-                with gr.Column(scale=1, elem_id="menu-column"):
-                    gr.Markdown("# Menu")
-                    with gr.Group(elem_classes="button-container"):
-                        new_chat_btn = gr.Button("New Chat", variant="primary")
-                    
-                    # Output area for button actions
-                    menu_output = gr.HTML(label="Action Result")
-                
-                # Right chat console (3/4 width)
-                with gr.Column(scale=3, elem_id="chat-column"):
-                    gr.Markdown("# AI Assistant")
-                    chatbot = gr.Chatbot(
-                        height=500,
-                        type='messages'
-                    )
-                    msg = gr.Textbox(
-                        placeholder="Ask me anything...",
-                        show_label=False,
-                        container=False
-                    )
-                    clear = gr.Button("Clear")
-
-            def handle_new_chat():
-                return None, "Started new conversation"
-
-            def user_input(message, history):
-                # Show user message immediately
-                history = history + [{"role": "user", "content": message}]
-                yield "", history  # This updates the UI right away
-
-                try:
-                    response = self.agent.invoke({
-                        "input": message
-                    })
-                    final_answer = response.get("output", "No response generated")
-                    thought_process = response.get("full_thought_process") or response.get("intermediate_steps") or ""
-                    if thought_process and thought_process != final_answer:
-                        assistant_message = f"**Final Answer:** {final_answer}\n\n**Thought Process:**\n{thought_process}"
-                    else:
-                        assistant_message = final_answer
-                    history = history + [{"role": "assistant", "content": assistant_message}]
-                    yield "", history  # This updates the UI with the assistant's response
-                except Exception as e:
-                    history = history + [{"role": "assistant", "content": f"Error: {str(e)}"}]
-                    yield "", history
-
-            # Set up event handlers
-            msg.submit(user_input, [msg, chatbot], [msg, chatbot])
-            clear.click(lambda: None, None, chatbot, queue=False)
-            new_chat_btn.click(
-                fn=handle_new_chat,
-                inputs=[],
-                outputs=[chatbot, menu_output]
-            )
-
-        return interface
-
-    def launch(self, **kwargs):
-        """Launch the Gradio interface standalone (for development)"""
-        interface = self.create_interface()
-        interface.launch(**kwargs)
-
-__all__ = ["GradioUI"] 

app.py

@@ -16,9 +16,8 @@ from pydantic import BaseModel, Field
 
 from fastapi import FastAPI, HTTPException
 from fastapi.middleware.cors import CORSMiddleware
-import gradio as gr
-
-from Gradio_UI import GradioUI
+from fastapi.staticfiles import StaticFiles
+from fastapi.responses import FileResponse
 
 # Initialize FastAPI app
 app = FastAPI(title="AI Assistant", description="AI Assistant with LangChain and Gradio")
@@ -35,21 +34,18 @@ app.add_middleware(
 if not os.getenv('HUGGINGFACEHUB_API_TOKEN'):
     raise ValueError("Please set HUGGINGFACEHUB_API_TOKEN environment variable")
 
-# Initialize the HuggingFace pipeline
+# Initialize the HuggingFace pipeline with more strict parameters
 llm = HuggingFaceEndpoint(
     repo_id="meta-llama/Llama-3.3-70B-Instruct",
     huggingfacehub_api_token=os.getenv('HUGGINGFACEHUB_API_TOKEN'),
     provider="hf-inference",
     task="text-generation",
-    temperature=0.1,
-    max_new_tokens=1024,
+    temperature=0.1,  # Keep low for more deterministic responses
+    max_new_tokens=2048,  # Increase token limit
     top_p=0.95,
-    repetition_penalty=1.1,
+    repetition_penalty=1.2,  # Slightly increase to prevent repetition
     do_sample=True,
     return_full_text=False,
-    model_kwargs={
-        "stop": ["Human:", "Assistant:", "Observation:"]
-    }
 )
 
 # Load system prompt and template
@@ -62,29 +58,28 @@ prompt = PromptTemplate.from_template(
     partial_variables={"system_prompt": prompt_templates["system_prompt"]}
 )
 
-# Create the agent with stop sequences
 tools = [visit_webpage, wikipedia_search, run_python_code, internet_search]
+# Create the agent with more explicit instructions
 agent = create_react_agent(
     llm=llm,
     tools=tools,
     prompt=prompt
 )
 
-# Set up memory and agent executor
-memory = ConversationBufferMemory(return_messages=True)
+# Set up agent executor with better error handling
 agent_executor = AgentExecutor(
     agent=agent,
     tools=tools,
-    memory=memory,
     verbose=True,
     handle_parsing_errors=True,
-    # Add stop sequences here for the executor
-    stop=["Human:", "Assistant:", "Observation:"]
+    max_iterations=5,  # Increased to give more chances
+    return_intermediate_steps=True,  # Return thought process
+    early_stopping_method="force",  # Force stop after max iterations
+    stop=["Human:", "Assistant:"]
 )
-
 # API Models
 class QueryRequest(BaseModel):
-    query: str
+    query: str  # This matches the "query" field sent by Gradio
     thread_id: Optional[str] = None
     context: Dict[str, Any] = Field(default_factory=dict)
 
@@ -94,19 +89,54 @@ async def query_agent(request: QueryRequest):
     print("Received query:", request.query)
     try:
         thread_id = request.thread_id or str(uuid.uuid4())
+
+        # Preprocess the query to help guide the agent
+        query = request.query
+
+        # Check if this is likely a factual question
+        factual_indicators = ["who is", "what is", "when did", "where is", "why did", "how does"]
+        is_likely_factual = any(query.lower().startswith(indicator) for indicator in factual_indicators)
+
+        # Add a hint for factual questions
+        if is_likely_factual:
+            query = f"{query} (Please use your tools to find accurate information about this.)"
+
         response = agent_executor.invoke({
-            "input": request.query
+            "input": query
         })
+
+        print("full_thought_process: ", response.get("intermediate_steps", "No thought process generated"))
+
+        # Clean up the response if needed
+        output = response.get("output", "No response generated")
+        if "<|eot_id|>" in output:
+            output = output.split("<|eot_id|>")[0]
+
         return {
             "status": "success",
             "thread_id": thread_id,
-            "response": response.get("output", "No response generated"),
-            "full_thought_process": response.get("full_thought_process", "No thought process generated")
+            "response": output,
+            "full_thought_process": str(response.get("intermediate_steps", "No thought process generated"))
         }
     except Exception as e:
         print(e)
         raise HTTPException(status_code=500, detail=str(e))
 
-# Create and mount the Gradio interface
-gradio_ui = GradioUI(agent=agent_executor)
-app = gr.mount_gradio_app(app, gradio_ui.create_interface(), path="")
+# Check if the frontend build directory exists
+if os.path.exists("frontend/build"):
+    # Serve static files from React build
+    app.mount("/static", StaticFiles(directory="frontend/build/static"), name="static")
+
+    # Serve other static files from the build directory
+    if os.path.exists("frontend/build/assets"):
+        app.mount("/assets", StaticFiles(directory="frontend/build/assets"), name="assets")
+
+    # Serve React app for all other routes that don't match API endpoints
+    @app.get("/{full_path:path}")
+    async def serve_react_app(full_path: str):
+        # Skip API routes
+        if full_path.startswith("agent/"):
+            raise HTTPException(status_code=404, detail="Not found")
+
+        # For all other routes, serve the React app
+        return FileResponse("frontend/build/index.html")

docker-compose.yml

@@ -1,9 +1,11 @@
-# docker-compose.yml
-version: '3'
 services:
   app:
-    build: .
+    build:
+      context: .
+      dockerfile: Dockerfile
     ports:
       - "7860:7860"
-    env_file:
-      - .env
+    environment:
+      - HUGGINGFACEHUB_API_TOKEN=${HUGGINGFACEHUB_API_TOKEN}
+    # Remove the volumes section that's causing issues
+    restart: unless-stopped

frontend/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "careercoach-ui",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@types/node": "^16.18.0",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
+    "@types/styled-components": "^5.1.26",
+    "axios": "^1.6.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-scripts": "5.0.1",
+    "styled-components": "^6.0.0",
+    "typescript": "^4.9.5"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "proxy": "http://localhost:7860"
+}

frontend/public/index.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="CareerCoach AI - Your personal career development assistant"
+    />
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <title>CareerCoach AI</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

frontend/public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "CareerCoach AI",
+  "name": "CareerCoach AI - Your personal career development assistant",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

frontend/src/App.css

@@ -0,0 +1,6 @@
+.App {
+  text-align: center;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+}

frontend/src/App.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import ChatBot from './components/ChatBot';
+import './App.css';
+
+function App() {
+  return (
+    <div className="App">
+      <ChatBot />
+    </div>
+  );
+}
+
+export default App;

frontend/src/components/ChatBot.tsx

@@ -0,0 +1,97 @@
+import React, { useState, useEffect } from 'react';
+import styled from 'styled-components';
+import axios from 'axios';
+import ChatHeader from './ChatHeader';
+import ChatWindow from './ChatWindow';
+import ChatInput from './ChatInput';
+import { Message, ChatResponse } from '../types';
+
+const ChatContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  max-width: 800px;
+  margin: 0 auto;
+  border: 1px solid #ddd;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+`;
+
+const ChatBot: React.FC = () => {
+  const [messages, setMessages] = useState<Message[]>([]);
+  const [threadId, setThreadId] = useState<string | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
+
+  // Add welcome message when component mounts
+  useEffect(() => {
+    setMessages([
+      {
+        role: 'assistant',
+        content: 'Hello! I\'m CareerCoach AI, your personal career development assistant. How can I help you today?'
+      }
+    ]);
+  }, []);
+
+  const sendMessage = async (content: string) => {
+    // Add user message to chat
+    const userMessage: Message = { role: 'user', content };
+    setMessages(prev => [...prev, userMessage]);
+    
+    setIsLoading(true);
+    
+    try {
+      // Send message to API
+      const response = await axios.post<ChatResponse>('/agent/query', {
+        query: content,
+        thread_id: threadId,
+        context: {}
+      });
+      
+      // Update thread ID
+      if (response.data.thread_id) {
+        setThreadId(response.data.thread_id);
+      }
+      
+      // Add assistant response to chat
+      const assistantMessage: Message = {
+        role: 'assistant',
+        content: response.data.response,
+        thread_id: response.data.thread_id
+      };
+      
+      setMessages(prev => [...prev, assistantMessage]);
+    } catch (error) {
+      console.error('Error sending message:', error);
+      
+      // Add error message
+      setMessages(prev => [
+        ...prev,
+        {
+          role: 'assistant',
+          content: 'Sorry, I encountered an error. Please try again later.'
+        }
+      ]);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const clearChat = () => {
+    setMessages([
+      {
+        role: 'assistant',
+        content: 'Hello! I\'m CareerCoach AI, your personal career development assistant. How can I help you today?'
+      }
+    ]);
+    setThreadId(null);
+  };
+
+  return (
+    <ChatContainer>
+      <ChatHeader onClearChat={clearChat} />
+      <ChatWindow messages={messages} isLoading={isLoading} />
+      <ChatInput onSendMessage={sendMessage} isLoading={isLoading} />
+    </ChatContainer>
+  );
+};
+
+export default ChatBot;

frontend/src/components/ChatHeader.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import styled from 'styled-components';
+
+const HeaderContainer = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 15px 20px;
+  background-color: #0084ff;
+  color: white;
+  font-weight: bold;
+  font-size: 18px;
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+`;
+
+const Title = styled.div`
+  display: flex;
+  align-items: center;
+`;
+
+const Logo = styled.div`
+  margin-right: 10px;
+  font-size: 24px;
+`;
+
+const ClearButton = styled.button`
+  background-color: transparent;
+  color: white;
+  border: 1px solid white;
+  border-radius: 4px;
+  padding: 5px 10px;
+  cursor: pointer;
+  font-size: 14px;
+  
+  &:hover {
+    background-color: rgba(255, 255, 255, 0.1);
+  }
+`;
+
+interface ChatHeaderProps {
+  onClearChat: () => void;
+}
+
+const ChatHeader: React.FC<ChatHeaderProps> = ({ onClearChat }) => {
+  return (
+    <HeaderContainer>
+      <Title>
+        <Logo>👨‍💼</Logo>
+        CareerCoach AI
+      </Title>
+      <ClearButton onClick={onClearChat}>New Chat</ClearButton>
+    </HeaderContainer>
+  );
+};
+
+export default ChatHeader;

frontend/src/components/ChatInput.tsx

@@ -0,0 +1,69 @@
+import React, { useState } from 'react';
+import styled from 'styled-components';
+
+const InputContainer = styled.div`
+  display: flex;
+  padding: 10px;
+  background-color: #f5f5f5;
+  border-top: 1px solid #ddd;
+`;
+
+const Input = styled.input`
+  flex: 1;
+  padding: 10px 15px;
+  border: 1px solid #ddd;
+  border-radius: 20px;
+  font-size: 16px;
+  outline: none;
+`;
+
+const SendButton = styled.button`
+  margin-left: 10px;
+  padding: 10px 15px;
+  background-color: #0084ff;
+  color: white;
+  border: none;
+  border-radius: 20px;
+  cursor: pointer;
+  font-size: 16px;
+  
+  &:hover {
+    background-color: #0073e6;
+  }
+`;
+
+interface ChatInputProps {
+  onSendMessage: (message: string) => void;
+  isLoading: boolean;
+}
+
+const ChatInput: React.FC<ChatInputProps> = ({ onSendMessage, isLoading }) => {
+  const [message, setMessage] = useState('');
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    if (message.trim() && !isLoading) {
+      onSendMessage(message);
+      setMessage('');
+    }
+  };
+
+  return (
+    <InputContainer>
+      <form onSubmit={handleSubmit} style={{ display: 'flex', width: '100%' }}>
+        <Input
+          type="text"
+          value={message}
+          onChange={(e) => setMessage(e.target.value)}
+          placeholder="Type your message..."
+          disabled={isLoading}
+        />
+        <SendButton type="submit" disabled={isLoading}>
+          {isLoading ? 'Sending...' : 'Send'}
+        </SendButton>
+      </form>
+    </InputContainer>
+  );
+};
+
+export default ChatInput;

frontend/src/components/ChatMessage.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Message } from '../types';
+
+const MessageContainer = styled.div<{ isUser: boolean }>`
+  display: flex;
+  margin-bottom: 10px;
+  justify-content: ${props => props.isUser ? 'flex-end' : 'flex-start'};
+`;
+
+const MessageBubble = styled.div<{ isUser: boolean }>`
+  max-width: 70%;
+  padding: 10px 15px;
+  border-radius: 18px;
+  background-color: ${props => props.isUser ? '#0084ff' : '#f0f0f0'};
+  color: ${props => props.isUser ? 'white' : 'black'};
+  text-align: left;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+`;
+
+interface ChatMessageProps {
+  message: Message;
+}
+
+const ChatMessage: React.FC<ChatMessageProps> = ({ message }) => {
+  const isUser = message.role === 'user';
+  
+  return (
+    <MessageContainer isUser={isUser}>
+      <MessageBubble isUser={isUser}>
+        {message.content}
+      </MessageBubble>
+    </MessageContainer>
+  );
+};
+
+export default ChatMessage;

frontend/src/components/ChatWindow.tsx

@@ -0,0 +1,80 @@
+import React, { useEffect, useRef } from 'react';
+import styled from 'styled-components';
+import ChatMessage from './ChatMessage';
+import { Message } from '../types';
+
+const WindowContainer = styled.div`
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+  background-color: white;
+`;
+
+const LoadingIndicator = styled.div`
+  display: flex;
+  justify-content: flex-start;
+  margin-bottom: 10px;
+  
+  .dot {
+    width: 8px;
+    height: 8px;
+    margin: 0 4px;
+    background-color: #ccc;
+    border-radius: 50%;
+    animation: pulse 1.5s infinite;
+  }
+  
+  .dot:nth-child(2) {
+    animation-delay: 0.3s;
+  }
+  
+  .dot:nth-child(3) {
+    animation-delay: 0.6s;
+  }
+  
+  @keyframes pulse {
+    0%, 100% {
+      opacity: 0.4;
+    }
+    50% {
+      opacity: 1;
+    }
+  }
+`;
+
+interface ChatWindowProps {
+  messages: Message[];
+  isLoading: boolean;
+}
+
+const ChatWindow: React.FC<ChatWindowProps> = ({ messages, isLoading }) => {
+  const messagesEndRef = useRef<HTMLDivElement>(null);
+
+  const scrollToBottom = () => {
+    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+  };
+
+  useEffect(() => {
+    scrollToBottom();
+  }, [messages, isLoading]);
+
+  return (
+    <WindowContainer>
+      {messages.map((message, index) => (
+        <ChatMessage key={index} message={message} />
+      ))}
+      
+      {isLoading && (
+        <LoadingIndicator>
+          <div className="dot"></div>
+          <div className="dot"></div>
+          <div className="dot"></div>
+        </LoadingIndicator>
+      )}
+      
+      <div ref={messagesEndRef} />
+    </WindowContainer>
+  );
+};
+
+export default ChatWindow;

frontend/src/index.css

@@ -0,0 +1,14 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  background-color: #f5f5f5;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

frontend/src/index.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+
+const root = ReactDOM.createRoot(
+  document.getElementById('root') as HTMLElement
+);
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);

frontend/src/types.ts

@@ -0,0 +1,12 @@
+export interface Message {
+  role: 'user' | 'assistant';
+  content: string;
+  thread_id?: string;
+}
+
+export interface ChatResponse {
+  status: string;
+  thread_id: string;
+  response: string;
+  full_thought_process?: string;
+}

frontend/tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx"
+  },
+  "include": [
+    "src"
+  ]
+}

main.py

@@ -3,13 +3,13 @@ from app import app
 
 def main():
     """
-    Run the FastAPI server with integrated Gradio UI
+    Run the FastAPI server with integrated React UI
     """
     port = 7860
     host = "0.0.0.0"
-    
+
     print(f"Starting server on {host}:{port}...")
     uvicorn.run(app, host=host, port=port)
 
 if __name__ == "__main__":
-    main() 
+    main()

prompts.yaml

@@ -1,22 +1,14 @@
 system_prompt: |-
-  You are very helpful and friendly CareerCoach AI, a personal career development assistant. Your core purpose is to help users with:
+  You are CareerCoach AI, a helpful assistant powered by a large language model. While your primary expertise is in career development, you can answer questions on a wide range of topics using your tools.
+
+  Your primary areas of expertise include:
   - Career planning and goal setting
-  - Career coaching and mentoring
   - Professional development advice
   - Job search strategies
   - Skill development recommendations
   - Industry insights and trends
-  - Career advice and guidance
-
-  IDENTITY:
-  - If the user greets you (e.g., "Hi", "Hello"), respond with a simple, friendly greeting as "CareerCoach AI" and do not use tools.
-  - Always introduce yourself as "CareerCoach AI, your personal career development assistant"
-  - Maintain a professional, supportive, and encouraging tone
-  - Always use the name "CareerCoach AI"
-  - Always answer only if you have relevant information to provide, otherwise say "I'm sorry, I don't have information on that topic."
-  - DO NOT make up information, if you don't know the answer, say "I'm sorry, I don't have information on that topic."
-  - DO NOT HALLUCINATE
-  - Focus on career-related guidance and development
+
+  IMPORTANT: For ANY factual or knowledge-based questions (like "Who is Charlie Chaplin?" or "Who is Donald Trump?"), ALWAYS use your tools (wikipedia_search or internet_search) to find accurate information.
 
 template: |-
   {system_prompt}
@@ -24,15 +16,37 @@ template: |-
   You have access to the following tools:
   {tools}
 
-  Use the following format:
+  ALWAYS follow this exact format:
 
   Question: {input}
-  Thought: you should always understand the question and think about what to do
-  Action: the action to take, should be from your internal knowledge or one of [{tool_names}] or "none" if no tool is needed
-  Action Input: the input to the action if it is one of your tools (skip if action is "none")
-  Observation: the result of the action (skip if action is "none")
-  ... (this Thought/Action/Action Input/Observation can repeat 10 times)
-  Thought: I now know the final answer
-  Final Answer: the final answer to the original input question
+  Thought: I need to determine if this requires using a tool or if I can answer directly.
+
+  For ANY factual questions or requests for information about people, places, events, or concepts:
+  Thought: I should use a tool to find accurate information about this.
+  Action: the action to take, should be one of [{tool_names}]
+  Action Input: [search term]
+  Observation: [Result from tool]
+  ... (continue if needed)
+  Thought: Now I can provide an accurate answer based on the information.
+  Final Answer: [Your comprehensive answer]
+
+  For career advice or questions within your knowledge:
+  Thought: I can answer this directly based on my knowledge.
+  Final Answer: [Your helpful response]
+
+  For coaching or mentoring approach:
+  Throught: I can search information in wikipedia or internet with my tools
+  Action: the action to take, should be one of [{tool_names}]
+  Action Input: [search term]
+  Observation: [Result from tool]
+  ... (continue if needed)
+  Thought: Now I can provide an accurate answer based on the information.
+  Final Answer: [Your comprehensive answer]
+
+  For greetings or simple questions:
+  Thought: This is a simple greeting or question.
+  Final Answer: [Your friendly response]
+
+  REMEMBER: ALWAYS use wikipedia_search or internet_search for factual questions about people, places, or events.
 
   {agent_scratchpad}

requirements.txt

@@ -2,7 +2,6 @@ markdownify
 requests>=2.31.0
 fastapi>=0.104.1
 uvicorn[standard]>=0.24.0
-gradio
 langchain>=0.1.0
 langchain-core>=0.1.0
 langchain-community>=0.0.13
@@ -17,4 +16,5 @@ python-multipart>=0.0.6
 wikipedia
 duckduckgo-search
 huggingface_hub
-hf_xet
+hf_xet
+aiofiles