feat: implement job suggestion

be_repo/app.py

@@ -202,5 +202,21 @@ def interview_question_suggestion():
     return jsonify({"response": response}), 200
 
 
+@app.route('/suggest/jobs', methods=['POST', 'OPTIONS'])
+def job_suggestion():
+    if request.method == 'OPTIONS':
+        return jsonify({'status': 'OK'}), 200
+
+    user_id = request.form.get('user_id')
+
+    if not user_id:
+        return jsonify({"error": "No user ID provided."}), 400
+
+    # Get answer using LangGraph
+    response = 'Example response'
+
+    return jsonify({"response": response}), 200
+
+
 if __name__ == '__main__':
     app.run(host='0.0.0.0', debug=True, port=5000)

fe_repo/src/App.tsx

@@ -1,6 +1,6 @@
 import {ChatBox, Content, Header} from './pages'
 import {ReactNode, useState} from "react";
-import {analyze, sendMessage, suggest} from "./functions/api.ts";
+import {analyze, sendMessage, suggest, suggestJob} from "./functions/api.ts";
 
 export type Message = {
   text: string | ReactNode,
@@ -101,11 +101,35 @@ function App() {
     setMessages((messages) => [...messages]);
   }
 
+  const onSuggestJob = async () => {
+    const sendingMessage: Message = {
+      text: 'Waiting for job suggestions...',
+      isUser: false
+    };
+    // show loading message
+    setMessages((messages) => [...messages, {
+      text: 'Suggest jobs',
+      isUser: true
+    }, sendingMessage]);
+    // show loading message
+    const response = await suggestJob();
+    if (null === response) {
+      sendingMessage.text = "Something went wrong, please try again later."
+    } else {
+      sendingMessage.text = (
+        <>
+          <div className="font-bold">Suggested questions:<br/>{response.response}</div>
+        </>
+      );
+    }
+    setMessages((messages) => [...messages]);
+  }
+
   return (
     <div className="flex flex-col h-screen bg-gray-100 p-5">
       <Header/>
       <Content messages={messages}></Content>
-      <ChatBox onSendMessage={onSendMessage} onAnalyze={onAnalyze} onSuggest={onSuggest}></ChatBox>
+      <ChatBox onSendMessage={onSendMessage} onAnalyze={onAnalyze} onSuggest={onSuggest} onSuggestJob={onSuggestJob}></ChatBox>
     </div>
   )
 }

fe_repo/src/functions/api.test.ts

@@ -1,5 +1,5 @@
 import {expect, test} from 'vitest';
-import {analyze, getHasResume, getUserId, login, sendMessage, suggest, uploadFile} from "./api.ts";
+import {analyze, getHasResume, getUserId, login, sendMessage, suggest, uploadFile, suggestJob} from "./api.ts";
 
 test('sendMessage', () => {
   expect(sendMessage("I'm adam")).toBeDefined();
@@ -30,6 +30,11 @@ test('suggest', () => {
   expect(async () => (await suggest())).toBeDefined();
 })
 
+test('suggestJob', () => {
+  // make sure message is always returned
+  expect(async () => (await suggestJob())).toBeDefined();
+})
+
 test('getUserId', () => {
   // make sure message is always returned
   expect(getUserId()).toBeDefined();

fe_repo/src/functions/api.ts

@@ -40,6 +40,22 @@ export async function suggest(): Promise<QuestionResponse | null> {
   }
 }
 
+export async function suggestJob(): Promise<QuestionResponse | null> {
+  try {
+    return axios.post<QuestionResponse>(uri + '/suggest/jobs',
+      {user_id: getUserId()},
+      {headers: {'Content-Type': 'multipart/form-data'}})
+      .then(response => response.data)
+      .catch(error => {
+        console.error('Error fetching response', error);
+        return null;
+      });
+  } catch (error) {
+    console.error('Error fetching the backend response', error);
+    return null;
+  }
+}
+
 export async function sendMessage(message: string): Promise<QuestionResponse> {
   console.log("Sending message: " + message);
   try {

fe_repo/src/pages/ChatBox.tsx

@@ -8,9 +8,10 @@ interface IChatBoxProps {
   onSendMessage: (message: string) => void;
   onAnalyze: (jd: string) => void;
   onSuggest: () => void;
+  onSuggestJob: () => void;
 }
 
-export const ChatBox = ({onSendMessage, onAnalyze, onSuggest}: IChatBoxProps) => {
+export const ChatBox = ({onSendMessage, onAnalyze, onSuggest, onSuggestJob}: IChatBoxProps) => {
 
   const [message, setMessage] = useState("");
   const [showPrompt, setShowPrompt] = useState(false);
@@ -123,6 +124,18 @@ export const ChatBox = ({onSendMessage, onAnalyze, onSuggest}: IChatBoxProps) =>
         >
           <span className="text-base">🛈</span> Interview question suggestion
         </button>
+        <button
+          className="cursor-pointer px-4 py-2 rounded-full bg-blue-500 text-white text-sm flex items-center gap-1 hover:bg-blue-600 transition"
+          onClick={() => {
+            if (!hasResume) {
+              alert("Please upload your resume.");
+              return;
+            }
+            onSuggestJob();
+          }}
+        >
+          <span className="text-base">💼</span> Job suggestion
+        </button>
         {/*🛈 /!* Example icon - you can use actual icons here *!/*/}
         {/*💼 /!* Example icon for interview *!/*/}
       </div>