Develop (#166)

Pr aberta pelo @GiovanniDonati  para correção dos endpoints do card.

Author: Benevanio

README.md

@@ -247,8 +247,6 @@ Usuários:
 
 Jobs:
 
-- GET /jobs
-- GET /jobs/files
 - GET /jobs/search
 
 Keywords:

docker-compose.yml

@@ -1,4 +1,3 @@
-
 services:
   scraper-go:
     build:

docker/node.Dockerfile

@@ -40,6 +40,12 @@ COPY --from=frontend /app/frontend/dist /usr/share/nginx/html
 
 FROM deps AS front-admin
 
+ARG VITE_API_URL
+ARG VITE_APP_ENV=production
+
+ENV VITE_API_URL=$VITE_API_URL
+ENV VITE_APP_ENV=$VITE_APP_ENV
+
 COPY front_admin ./front_admin
 
 WORKDIR /app/front_admin
@@ -50,4 +56,4 @@ RUN npm run build
 
 FROM nginx:1.27-alpine AS front-admin-runtime
 
-COPY --from=front-admin /app/front_admin/dist /usr/share/nginx/html
+COPY --from=front-admin /app/front_admin/dist /usr/share/nginx/html

frontend/src/domains/jobs/application/useJobsData.ts

@@ -1,44 +1,44 @@
 import {
-  fetchJobFiles,
-  fetchJobsByFile,
+  fetchJobsByAPI,
   runScraperRequest,
 } from "@/domains/jobs/infrastructure/jobsApi";
-import type { Job, JobFile, JobsMeta } from "@/domains/jobs/domain/job.types";
+import type { Job, JobsResponse } from "@/domains/jobs/domain/job.types";
 import { useCallback, useEffect, useState } from "react";
 
-const EMPTY_META: JobsMeta = { file: "", modifiedAt: null, total: 0 };
+export type JobsPaginationMeta = Omit<JobsResponse, "jobs">;
 
-export function useJobsData(initialSelectedFile = "") {
-  const [files, setFiles] = useState<JobFile[]>([]);
-  const [selectedFile, setSelectedFile] = useState(initialSelectedFile);
+const EMPTY_META: JobsPaginationMeta = {
+  total: 0,
+  hasNext: false,
+  hasPrev: false,
+  page: 0,
+  limit: 0,
+  totalPages: 0,
+};
+
+export function useJobsData(page: number = 1, limit: number = 5) {
   const [jobs, setJobs] = useState<Job[]>([]);
-  const [meta, setMeta] = useState<JobsMeta>(EMPTY_META);
+  const [meta, setMeta] = useState<JobsPaginationMeta>(EMPTY_META);
   const [loading, setLoading] = useState(false);
   const [scraping, setScraping] = useState(false);
   const [error, setError] = useState("");
 
-  const loadFiles = useCallback(async () => {
-    const foundFiles = await fetchJobFiles();
-    setFiles(foundFiles);
-    return foundFiles;
-  }, []);
-
-  const loadJobs = useCallback(async (fileName: string) => {
+  const loadJobs = useCallback(async () => {
     setLoading(true);
     setError("");
 
     try {
-      const data = await fetchJobsByFile(fileName);
-      setJobs(data.jobs);
+      const data = await fetchJobsByAPI(page, limit);
+      setJobs(data.jobs ?? []);
+      
       setMeta({
-        file: data.file,
-        modifiedAt: data.modifiedAt,
-        total: data.total,
+        total: data.total ?? 0,
+        hasNext: data.hasNext ?? false,
+        hasPrev: data.hasPrev ?? false,
+        page: data.page ?? page,
+        limit: data.limit ?? limit,
+        totalPages: data.totalPages ?? 0,
       });
-
-      if (data.file && data.file !== fileName) {
-        setSelectedFile(data.file);
-      }
     } catch (err: unknown) {
       setJobs([]);
       setMeta(EMPTY_META);
@@ -50,57 +50,30 @@ export function useJobsData(initialSelectedFile = "") {
     } finally {
       setLoading(false);
     }
-  }, []);
+  }, [page, limit]);
 
   useEffect(() => {
-    async function initializeFiles() {
-      const foundFiles = await loadFiles();
-      if (foundFiles[0]?.file) {
-        setSelectedFile((current) => current || foundFiles[0].file);
-      }
-    }
+    let isMounted = true;
 
-    initializeFiles().catch(() => {
-      setError("Nao foi possivel listar arquivos .xlsx da pasta output.");
-    });
-  }, [loadFiles]);
+    const initialize = async () => {
+      if (!isMounted) return;
+      await loadJobs();
+    };
 
-  useEffect(() => {
-    const syncState = setTimeout(() => {
-      if (!selectedFile) {
-        setJobs([]);
-        setMeta(EMPTY_META);
-        return;
-      }
+    initialize();
 
-      loadJobs(selectedFile);
-    }, 0);
-
-    return () => clearTimeout(syncState);
-  }, [selectedFile, loadJobs]);
+    return () => {
+      isMounted = false;
+    };
+  }, [loadJobs]);
 
   const triggerScraper = useCallback(async () => {
     setScraping(true);
     setError("");
 
     try {
       await runScraperRequest();
-      const foundFiles = await loadFiles();
-      const nextFile = foundFiles[0]?.file ?? "";
-
-      if (!nextFile) {
-        setSelectedFile("");
-        setJobs([]);
-        setMeta(EMPTY_META);
-        return;
-      }
-
-      if (nextFile !== selectedFile) {
-        setSelectedFile(nextFile);
-        return;
-      }
-
-      await loadJobs(nextFile);
+      await loadJobs();
     } catch (err: unknown) {
       setError(
         err instanceof Error
@@ -110,12 +83,9 @@ export function useJobsData(initialSelectedFile = "") {
     } finally {
       setScraping(false);
     }
-  }, [loadFiles, loadJobs, selectedFile]);
+  }, [loadJobs]);
 
   return {
-    files,
-    selectedFile,
-    setSelectedFile,
     jobs,
     meta,
     loading,

frontend/src/domains/jobs/domain/job.types.ts

@@ -1,27 +1,23 @@
 export interface Job {
-  palavra?: string | null;
+  keyword?: string | null;
   keywords?: string[] | null;
-  titulo?: string | null;
-  empresa?: string | null;
+  title?: string | null;
+  company?: string | null;
   source?: string | null;
   sources?: string[] | null;
-  local?: string | null;
-  link?: string | null;
-}
-
-export interface JobFile {
-  file: string;
+  location?: string | null;
+  url?: string | null;
 }
 
 export interface JobsMeta {
-  file: string;
-  modifiedAt: string | number | null;
+  hasNext: boolean;
+  hasPrev: boolean;
+  limit: number;
+  page: number;
   total: number;
+  totalPages: number;
 }
 
-export interface JobsResponse {
+export interface JobsResponse extends JobsMeta {
   jobs: Job[];
-  file: string;
-  modifiedAt: string | number | null;
-  total: number;
 }

frontend/src/domains/jobs/infrastructure/jobsApi.ts

@@ -1,4 +1,4 @@
-import type { JobFile, JobsResponse } from "@/domains/jobs/domain/job.types";
+import type { JobsResponse } from "@/domains/jobs/domain/job.types";
 
 function normalizeBaseUrl(value: string | undefined): string {
   return typeof value === "string" ? value.trim().replace(/\/+$/, "") : "";
@@ -57,38 +57,15 @@ function readMessage(payload: unknown): string | undefined {
   return undefined;
 }
 
-export async function fetchJobFiles(): Promise<JobFile[]> {
-  const response = await fetch(buildApiUrl("/jobs/files"), {
-    credentials: "include",
-  });
-  const payload = (await readPayload(response)) as { files?: unknown } & Record<
-    string,
-    unknown
-  >;
-
-  if (!response.ok) {
-    throw buildError(
-      readMessage(payload),
-      "Falha ao listar arquivos de vagas.",
-    );
-  }
-
-  if (!Array.isArray(payload.files)) {
-    return [];
-  }
+export async function fetchJobsByAPI(page?: number, limit?: number): Promise<JobsResponse> {
+  const queryParams = new URLSearchParams();
+  if (page !== undefined) queryParams.set("page", String(page));
+  if (limit !== undefined) queryParams.set("limit", String(limit));
 
-  return payload.files.filter(
-    (entry): entry is JobFile =>
-      !!entry &&
-      typeof entry === "object" &&
-      "file" in entry &&
-      typeof (entry as { file: unknown }).file === "string",
-  );
-}
+  const queryString = queryParams.toString();
+  const urlPath = queryString ? `/jobs/search?${queryString}` : `/jobs/search`;
 
-export async function fetchJobsByFile(fileName: string): Promise<JobsResponse> {
-  const suffix = fileName ? `?file=${encodeURIComponent(fileName)}` : "";
-  const response = await fetch(buildApiUrl(`/jobs${suffix}`), {
+  const response = await fetch(buildApiUrl(urlPath), {
     credentials: "include",
   });
   const payload = (await readPayload(response)) as Record<string, unknown>;
@@ -99,13 +76,12 @@ export async function fetchJobsByFile(fileName: string): Promise<JobsResponse> {
 
   return {
     jobs: Array.isArray(payload.jobs) ? payload.jobs : [],
-    file: typeof payload.file === "string" ? payload.file : "",
-    modifiedAt:
-      typeof payload.modifiedAt === "string" ||
-      typeof payload.modifiedAt === "number"
-        ? payload.modifiedAt
-        : null,
     total: Number(payload.total || 0),
+    hasNext: Boolean(payload.hasNext),
+    hasPrev: Boolean(payload.hasPrev),
+    page: Number(payload.page || 0),
+    limit: Number(payload.limit || 0),
+    totalPages: Number(payload.totalPages || 0),
   };
 }
 

frontend/src/domains/jobs/presentation/components/JobsFiltersCard.tsx

@@ -1,7 +1,7 @@
 import { Badge } from "@/shared/ui/badge";
 import { Card, CardContent } from "@/shared/ui/card";
 import { Input } from "@/shared/ui/input";
-import type { JobFile, JobsMeta } from "@/domains/jobs/domain/job.types";
+import type { JobsPaginationMeta } from "@/domains/jobs/application/useJobsData";
 import {
   useMemo,
   useState,
@@ -13,7 +13,6 @@ import {
 import {
   FiBriefcase,
   FiCheck,
-  FiFileText,
   FiFilter,
   FiPlus,
   FiSearch,
@@ -30,10 +29,7 @@ interface JobsFiltersCardProps {
   onRemoveFilter: (filterToRemove: string) => void;
   onClearFilters: () => void;
   keywords: string[];
-  selectedFile: string;
-  setSelectedFile: Dispatch<SetStateAction<string>>;
-  files: JobFile[];
-  meta: JobsMeta;
+  meta: JobsPaginationMeta;
   actions?: ReactNode;
 }
 
@@ -56,11 +52,7 @@ export function JobsFiltersCard({
   onRemoveFilter,
   onClearFilters,
   keywords,
-  selectedFile,
-  setSelectedFile,
-  files,
   meta,
-  actions,
 }: JobsFiltersCardProps) {
   const [seeKeywordsModal, setSeeKeywordsModal] = useState(false);
   const [searchTerm, setSearchTerm] = useState("");
@@ -99,7 +91,10 @@ export function JobsFiltersCard({
     }
 
     setSearch((current) => {
-      const currentTerms = getSelectedFilters(current, []);
+      const currentTerms = current
+        .split(/[,;/]+/)
+        .map((item) => item.trim())
+        .filter(Boolean);
 
       if (currentTerms.includes(nextTerm)) {
         return current;
@@ -132,7 +127,6 @@ export function JobsFiltersCard({
                 <FiPlus className="h-4 w-4" />
               </button>
             </form>
-            <div className="flex items-center gap-2">{actions}</div>
           </div>
 
           <div className="flex flex-col gap-3 xl:flex-row xl:items-center xl:justify-between">
@@ -151,28 +145,7 @@ export function JobsFiltersCard({
                 ))}
               </select>
 
-              <select
-                aria-label="Selecionar arquivo"
-                className="h-12 min-w-[180px] rounded-2xl border border-slate-300 bg-white px-3 text-sm text-slate-900 focus:outline-none focus:ring-2 focus:ring-[#14AE5C]/40 dark:border-[#35506f] dark:bg-[#0b1527] dark:text-slate-100"
-                value={selectedFile}
-                onChange={(event) => setSelectedFile(event.target.value)}
-              >
-                {files.map((file) => (
-                  <option key={file.file} value={file.file}>
-                    {file.file}
-                  </option>
-                ))}
-              </select>
-
               <div>
-                <Badge
-                  variant="secondary"
-                  className="gap-1.5 rounded-full border border-slate-300 bg-slate-100 px-3 py-1 text-xs text-slate-700 dark:border-[#35506f] dark:bg-[#24324c] dark:text-slate-100"
-                >
-                  <FiFileText className="h-3.5 w-3.5" />
-                  {meta.file || "Sem arquivo"}
-                </Badge>
-
                 <Badge className="gap-1.5 rounded-full bg-[#0c6b35] px-3 py-1 text-xs text-white">
                   <FiBriefcase className="h-3.5 w-3.5" />
                   {meta.total} vagas
@@ -239,4 +212,4 @@ export function JobsFiltersCard({
       )}
     </>
   );
-}
+}