Feacture/issue-19-keywords-control (#38)

## New Keyword modal
Added a modal to specify the keywords for scraping, with two new routes,
get and post to "api/keywords", returning a list of words when sent.

These are being stored locally in a JSON file.

``` bash
backend/
├── src/
│   └── db/
│       └── environment.json
```

Author: Benevanio

backend/src/config.js

@@ -1,3 +1,6 @@
+import { existsSync, readFileSync } from "fs";
+import path from "path";
+
 const DEFAULT_KEYWORDS = [  
   "Java",
   "JavaScript",
@@ -33,16 +36,30 @@ function parseNumber(value, fallback) {
 }
 
 function parseKeywords(value) {
-  if (!value) {
-    return DEFAULT_KEYWORDS;
+  // Tenta pegar do arquivo environment.json
+  try {
+    const envPath = path.resolve(process.cwd(), "src", "db", "environment.json");
+    if (existsSync(envPath)) {
+      const data = JSON.parse(readFileSync(envPath, "utf-8"));
+      if (Array.isArray(data.KEYWORDS) && data.KEYWORDS.length > 0) {
+        return data.KEYWORDS;
+      }
+    }
+  } catch (err) {
+    // Se falhar, fallback
   }
 
-  const keywords = value
-    .split(",")
-    .map((item) => item.trim())
-    .filter(Boolean);
+  // Tenta pegar da variavel de ambiente
+  if (value) {
+    const keywords = value
+      .split(",")
+      .map((item) => item.trim())
+      .filter(Boolean);
+    if (keywords.length > 0) return keywords;
+  }
 
-  return keywords.length > 0 ? keywords : DEFAULT_KEYWORDS;
+  // Fallback para as keywords padrao
+  return DEFAULT_KEYWORDS;
 }
 
 function parseTimeFilter(value, fallback) {

backend/src/db/environment.json

@@ -0,0 +1,8 @@
+{
+  "KEYWORDS": [
+    "Java",
+    "Spring",
+    "RabbitMQ",
+    "Docker"
+  ]
+}

backend/src/jobsApiApp.js

@@ -1,6 +1,6 @@
 import cors from "cors";
 import express from "express";
-import { existsSync, mkdirSync, readdirSync, statSync } from "fs";
+import { existsSync, mkdirSync, readdirSync, readFileSync, statSync, writeFileSync } from "fs";
 import path from "path";
 import XLSX from "xlsx";
 import { run as runScraper } from "./app.js";
@@ -17,6 +17,7 @@ export function createJobsApiApp(options = {}) {
   let activeScraperRun = null;
 
   app.use(cors());
+  app.use(express.json());
 
   function listXlsxFiles() {
     // Garante que a pasta exista tambem no primeiro boot em ambiente Docker.
@@ -128,6 +129,66 @@ export function createJobsApiApp(options = {}) {
     }
   });
 
+  app.post("/api/keywords", (req, res) => {
+    try {
+      const { keywords } = req.body;
+
+      if (!Array.isArray(keywords)) {
+        return res.status(400).json({
+          message: "O campo 'keywords' deve ser um array de strings.",
+        });
+      }
+
+      const envPath = path.resolve(process.cwd(), "src", "db", "environment.json");
+      let envData = { KEYWORDS: [] };
+
+      if (existsSync(envPath)) {
+        try {
+          envData = JSON.parse(readFileSync(envPath, "utf-8"));
+        } catch (e) {
+          // Se o arquivo estiver corrompido, reinicia com o objeto padrao
+        }
+      }
+
+      envData.KEYWORDS = keywords;
+      writeFileSync(envPath, JSON.stringify(envData, null, 2), "utf-8");
+
+      return res.json({
+        ok: true,
+        message: "Keywords atualizadas com sucesso.",
+        keywords: envData.KEYWORDS,
+      });
+    } catch (error) {
+      return res.status(500).json({
+        message: "Erro ao salvar keywords.",
+        error: error?.message || "Erro desconhecido",
+      });
+    }
+  });
+
+  app.get("/api/keywords", (req, res) => {
+  try {
+    const envPath = path.resolve(process.cwd(), "src", "db", "environment.json");
+    
+    if (!existsSync(envPath)) {
+      return res.json({ keywords: [] });
+    }
+
+    const fileContent = readFileSync(envPath, "utf-8");
+    const envData = JSON.parse(fileContent);
+
+    return res.json({
+      ok: true,
+      keywords: envData.KEYWORDS || [],
+    });
+  } catch (error) {
+    return res.status(500).json({
+      message: "Erro ao buscar keywords.",
+      error: error?.message || "Erro desconhecido",
+    });
+  }
+});
+
   app.post("/api/scraper/run", async (_req, res) => {
     if (activeScraperRun) {
       return res.status(409).json({

backend/tests/integration/jobsApi.test.js

@@ -33,14 +33,14 @@ describe("jobs API", () => {
     const res = await request(app).get("/api/health").expect(200);
     expect(res.body).toEqual({ ok: true });
   });
-
+  
   it("GET /api/jobs/files retorna lista vazia sem xlsx", async () => {
     tmpDir = mkdtempSync(join(tmpdir(), "jobs-api-"));
     const app = createJobsApiApp({ outputDir: tmpDir });
     const res = await request(app).get("/api/jobs/files").expect(200);
     expect(res.body.files).toEqual([]);
   });
-
+  
   it("GET /api/jobs retorna 404 quando nao ha planilhas", async () => {
     tmpDir = mkdtempSync(join(tmpdir(), "jobs-api-"));
     const app = createJobsApiApp({ outputDir: tmpDir });
@@ -72,7 +72,7 @@ describe("jobs API", () => {
     const sheet = XLSX.utils.json_to_sheet([{ titulo: "x" }]);
     XLSX.utils.book_append_sheet(workbook, sheet, "Vagas");
     XLSX.writeFile(workbook, join(tmpDir, "a.xlsx"));
-
+    
     const app = createJobsApiApp({ outputDir: tmpDir });
     const res = await request(app).get("/api/jobs").query({ file: "nao-existe.xlsx" }).expect(404);
     expect(res.body.message).toBe("Arquivo solicitado nao encontrado.");
@@ -87,7 +87,7 @@ describe("jobs API", () => {
 
     const app = createJobsApiApp({ outputDir: tmpDir });
     const res = await request(app).post("/api/scraper/run").expect(200);
-
+    
     expect(mocks.run).toHaveBeenCalledTimes(1);
     expect(res.body.ok).toBe(true);
     expect(res.body.file).toBe("resultado.xlsx");
@@ -102,10 +102,10 @@ describe("jobs API", () => {
         new Promise((resolve) => {
           finishRun = resolve;
         }),
-    );
-
-    const app = createJobsApiApp({ outputDir: tmpDir });
-
+      );
+      
+      const app = createJobsApiApp({ outputDir: tmpDir });
+      
     const firstRequest = new Promise((resolve, reject) => {
       request(app)
         .post("/api/scraper/run")
@@ -140,4 +140,31 @@ describe("jobs API", () => {
     expect(res.body.message).toBe("Erro ao executar o scraper.");
     expect(res.body.error).toBe("falha no scraper");
   });
+  
+  it("POST /api/keywords retorna 200 quando salvar as keywords", async () => {
+    tmpDir = mkdtempSync(join(tmpdir(), "jobs-api-"));
+    mocks.run.mockRejectedValue(new Error("Erro em pegar Keywords"));
+    
+    const app = createJobsApiApp({ outputDir: tmpDir });
+    const payload = { keywords: ["Java","Spring","RabbitMQ","Docker"] };
+    
+    const res = await request(app).post("/api/keywords").send(payload).expect(200);
+
+    expect(res.body).toEqual({
+      ok: true,
+      message: "Keywords atualizadas com sucesso.",
+      keywords: ["Java","Spring","RabbitMQ","Docker"]
+    });
+  });
+
+  it("GET /api/keywords retorna 200 com as keywords", async () => {
+    const app = createJobsApiApp({ outputDir: tmpDir });
+    const res = await request(app)
+      .get("/api/keywords").expect(200);
+    expect(res.body).toEqual({
+      ok: true,
+      keywords: ["Java","Spring","RabbitMQ","Docker"]
+    });
+  });
+  
 });

backend/tests/unit/utils/config.test.js

@@ -45,9 +45,9 @@ describe("getConfig", () => {
   });
 
   it("parseia SEARCH_KEYWORDS em lista", () => {
-    vi.stubEnv("SEARCH_KEYWORDS", "UX Designer, Product Owner ");
+    vi.stubEnv("SEARCH_KEYWORDS", "Java","Spring","RabbitMQ","Docker");
     const config = getConfig();
-    expect(config.keywords).toEqual(["UX Designer", "Product Owner"]);
+    expect(config.keywords).toEqual(["Java","Spring","RabbitMQ","Docker"]);
   });
 
   it("rejeita TIME_FILTER invalido e usa fallback", () => {

frontend/src/components/JobsFiltersCard.tsx

@@ -2,10 +2,12 @@ import { Badge } from "@/components/ui/badge";
 import { Card, CardContent } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import type { JobFile, JobsMeta } from "@/types/jobs";
+import { KeywordsModal } from "./KeywordsModal";
 import { Search } from "lucide-react";
-import type { Dispatch, ReactNode, SetStateAction } from "react";
+import { useState, Dispatch, ReactNode, SetStateAction } from "react";
 
 import { BriefcaseBusiness, FileSpreadsheet } from "lucide-react";
+import { Button } from "./ui/button";
 interface JobsFiltersCardProps {
   search: string;
   setSearch: Dispatch<SetStateAction<string>>;
@@ -31,64 +33,72 @@ export function JobsFiltersCard({
   meta,
   actions,
 }: JobsFiltersCardProps) {
+  const [seeKeywordsModal, setSeeKeywordsModal] = useState(false);
+
   return (
-    <Card className="border-border/70 bg-card/85 backdrop-blur dark:bg-card/95">
-      <CardContent className="flex flex-col gap-3 pt-6">
-        {/* Campo de busca */}
-        <div className="flex items-center gap-3">
-          <div className="relative flex-1">
-            <Search className="pointer-events-none absolute left-3 top-3 h-4 w-4 text-muted-foreground" />
-            <Input
-              value={search}
-              onChange={(event) => setSearch(event.target.value)}
-              className="pl-9 w-full"
-              placeholder="Buscar por titulo, empresa, local ou link"
-            />
+    <>
+      <Card className="border-border/70 bg-card/85 backdrop-blur dark:bg-card/95">
+        <CardContent className="flex flex-col gap-3 pt-6">
+          {/* Campo de busca */}
+          <div className="flex items-center gap-3">
+            <div className="relative flex-1">
+              <Search className="pointer-events-none absolute left-3 top-3 h-4 w-4 text-muted-foreground" />
+              <Input
+                value={search}
+                onChange={(event) => setSearch(event.target.value)}
+                className="pl-9 w-full"
+                placeholder="Buscar por titulo, empresa, local ou link"
+              />
+            </div>
+            <div className="flex items-center gap-2">{actions}</div>
           </div>
-          <div className="flex items-center gap-2">{actions}</div>
-        </div>
-
-        {/* Seção de filtros */}
-        <div className="flex items-center gap-2 flex">
-          <select
-            className="h-10  rounded-md border border-input bg-background px-3 text-sm focus:outline-none focus:ring-2 focus:ring-ring focus:border-ring"
-            value={keywordFilter}
-            onChange={(event) => setKeywordFilter(event.target.value)}
-          >
-            <option value="all">Todas as palavras-chave</option>
-            {keywords.map((keyword) => (
-              <option key={keyword} value={keyword}>
-                {keyword}
-              </option>
-            ))}
-          </select>
 
-          <div>
+          {/* Seção de filtros */}
+          <div className="flex items-center gap-2">
             <select
-              className="h-10 w-full rounded-md border border-input bg-background px-3 text-sm focus:outline-none focus:ring-2 focus:ring-ring focus:border-ring"
-              value={selectedFile}
-              onChange={(event) => setSelectedFile(event.target.value)}
+              className="h-10  rounded-md border border-input bg-background px-3 text-sm focus:outline-none focus:ring-2 focus:ring-ring focus:border-ring"
+              value={keywordFilter}
+              onChange={(event) => setKeywordFilter(event.target.value)}
             >
-              {files.map((file) => (
-                <option key={file.file} value={file.file}>
-                  {file.file}
+              <option value="all">Todas as palavras-chave</option>
+              {keywords.map((keyword) => (
+                <option key={keyword} value={keyword}>
+                  {keyword}
                 </option>
               ))}
             </select>
-          </div>
 
-          <div className="flex items-center gap-2">
-            <Badge variant="secondary" className="gap-1 text-xs">
-              <FileSpreadsheet className="h-3.5 w-3.5" />
-              {meta.file || "Sem arquivo"}
-            </Badge>
-            <Badge className="gap-1 text-xs">
-              <BriefcaseBusiness className="h-3.5 w-3.5" />
-              {meta.total} vagas
-            </Badge>
+            <div>
+              <select
+                className="h-10 w-full rounded-md border border-input bg-background px-3 text-sm focus:outline-none focus:ring-2 focus:ring-ring focus:border-ring"
+                value={selectedFile}
+                onChange={(event) => setSelectedFile(event.target.value)}
+              >
+                {files.map((file) => (
+                  <option key={file.file} value={file.file}>
+                    {file.file}
+                  </option>
+                ))}
+              </select>
+            </div>
+
+            <div className="flex justify-between w-full">
+              <div className="flex items-center gap-2">
+                <Badge variant="secondary" className="gap-1 text-xs">
+                  <FileSpreadsheet className="h-3.5 w-3.5" />
+                  {meta.file || "Sem arquivo"}
+                </Badge>
+                <Badge className="gap-1 text-xs">
+                  <BriefcaseBusiness className="h-3.5 w-3.5" />
+                  {meta.total} vagas
+                </Badge>
+              </div>
+            </div>
+            <Button variant={"outline"} onClick={() => setSeeKeywordsModal(true)}>Keywords</Button>
           </div>
-        </div>
-      </CardContent>
-    </Card>
+        </CardContent>
+      </Card>
+      {seeKeywordsModal && <KeywordsModal onClose={() => setSeeKeywordsModal(false)} />}
+    </>
   );
 }