Update interface

server/app.py

@@ -28,8 +28,7 @@ app.add_middleware(
 
 
 @app.post("/generate_questions")
-async def generate_questions(body: Body):
-    print(body)
+def generate_questions(body: Body):
     if body.promptValue:
         query = body.promptValue
     else:

web/src/App.jsx

@@ -15,6 +15,7 @@ import { Input } from "@/components/ui/input"
 
 function App() {
 
+  const [schoolSubject, setSchoolSubject] = useState("biologia");
   const [subject, setSubject] = useState("");
   const [difficultie, setDifficultie] = useState("");
 
@@ -25,7 +26,21 @@ function App() {
 
   const [promptValue, setPromptValue] = useState('');
 
-  const subjects = [
+  const schoolSubjects = [
+    { label: "História", value: "historia" },
+    { label: "Biologia", value: "biologia" },
+  ];
+
+  const historySubjects = [
+    { label: "Revoluções", value: "revoluções" },
+    { label: "Grécia", value: "grécia" },
+    { label: "Roma", value: "roma" },
+    { label: "Primeira Guerra Mundial", value: "primeira guerra mundial" },
+    { label: "Guerra Fria", value: "guerra fria" },
+    { label: "Feudalismo", value: "feudalismo" },
+  ]
+
+  const biologySubjects = [
     { label: "Fisiologia", value: "fisiologia" },
     { label: "Embriologia", value: "embriologia" },
     { label: "Citologia", value: "citologia" },
@@ -47,7 +62,7 @@ function App() {
     setIsLoading(true);
     try {
 
-      const body = promptMode ? { promptValue } : { subject, difficultie };
+      const body = promptMode ? { promptValue } : { subject, difficultie, school_subject: schoolSubject };
 
       const res = await fetch("/generate_questions", {
         method: "POST",
@@ -129,12 +144,16 @@ function App() {
                 className="flex flex-col gap-2.5 top-0 h-full ">
                 <fieldset>
                   <h2>Selecione uma matéria:</h2>
-                  <Select defaultValue="biologia">
+                  <Select defaultValue="biologia" onValueChange={value => setSchoolSubject(value)}>
                     <SelectTrigger className="w-[180px]">
                       <SelectValue placeholder="Matéria" />
                     </SelectTrigger>
                     <SelectContent>
-                      <SelectItem value="biologia">Biologia</SelectItem>
+                      {
+                        schoolSubjects.map(({ label, value }) => (
+                          <SelectItem key={value} value={value}>{label}</SelectItem>
+                        ))
+                      }
                     </SelectContent>
                   </Select>
                   <h2>Selecione um conteúdo:</h2>
@@ -142,10 +161,17 @@ function App() {
                     <SelectTrigger className="w-[180px]">
                       <SelectValue placeholder="Conteúdo" />
                     </SelectTrigger>
-                    <SelectContent onChange={e => console.log(e)}>
-                      {subjects && subjects.map(({ label, value }) => (
-                        <SelectItem key={value} value={value}>{label}</SelectItem>
-                      ))}
+                    <SelectContent>
+                      {schoolSubjects &&
+                        schoolSubject === "historia" ?
+                        historySubjects.map(({ label, value }) => (
+                          <SelectItem key={value} value={value}>{label}</SelectItem>
+                        ))
+                        :
+                        biologySubjects.map(({ label, value }) => (
+                          <SelectItem key={value} value={value}>{label}</SelectItem>
+                        ))
+                      }
                     </SelectContent>
                   </Select>
                   <h2>Selecione uma dificuldade:</h2>
@@ -202,8 +228,8 @@ function App() {
                   Resposta correta: {answer}
                 </div>
               ))
-              : 
-              
+              :
+
               !promptMode && <div className="p-2.5 bg-slate-950 ring-2 ring-white rounded">Escolha os filtros para criar as questões</div>
             }
           </div>