Session 8: Frontend by Ignacio Mena

backend/src/application/services/positionService.ts

@@ -1,65 +1,70 @@
 import { PrismaClient } from '@prisma/client';
-import { Position } from '../../domain/models/Position';
 
 const prisma = new PrismaClient();
 
 const calculateAverageScore = (interviews: any[]) => {
-    if (interviews.length === 0) return 0;
-    const totalScore = interviews.reduce((acc, interview) => acc + (interview.score || 0), 0);
-    return totalScore / interviews.length;
+  if (interviews.length === 0) return 0;
+  const totalScore = interviews.reduce(
+    (acc, interview) => acc + (interview.score || 0),
+    0,
+  );
+  return totalScore / interviews.length;
 };
 
 export const getCandidatesByPositionService = async (positionId: number) => {
-    try {
-        const applications = await prisma.application.findMany({
-            where: { positionId },
-            include: {
-                candidate: true,
-                interviews: true,
-                interviewStep: true
-            }
-        });
+  try {
+    const applications = await prisma.application.findMany({
+      where: { positionId },
+      include: {
+        candidate: true,
+        interviews: true,
+        interviewStep: true,
+      },
+    });
 
-        return applications.map(app => ({
-            fullName: `${app.candidate.firstName} ${app.candidate.lastName}`,
-            currentInterviewStep: app.interviewStep.name,
-            averageScore: calculateAverageScore(app.interviews)
-        }));
-    } catch (error) {
-        console.error('Error retrieving candidates by position:', error);
-        throw new Error('Error retrieving candidates by position');
-    }
+    return applications.map((app) => ({
+      candidateId: app.candidateId,
+      applicationId: app.id,
+      fullName: `${app.candidate.firstName} ${app.candidate.lastName}`,
+      currentInterviewStep: app.interviewStep.name,
+      averageScore: calculateAverageScore(app.interviews),
+    }));
+  } catch (error) {
+    console.error('Error retrieving candidates by position:', error);
+    throw new Error('Error retrieving candidates by position');
+  }
 };
 
 export const getInterviewFlowByPositionService = async (positionId: number) => {
-    const positionWithInterviewFlow = await prisma.position.findUnique({
-        where: { id: positionId },
+  const positionWithInterviewFlow = await prisma.position.findUnique({
+    where: { id: positionId },
+    include: {
+      interviewFlow: {
         include: {
-            interviewFlow: {
-                include: {
-                    interviewSteps: true
-                }
-            }
-        }
-    });
+          interviewSteps: true,
+        },
+      },
+    },
+  });
 
-    if (!positionWithInterviewFlow) {
-        throw new Error('Position not found');
-    }
+  if (!positionWithInterviewFlow) {
+    throw new Error('Position not found');
+  }
 
-    // Formatear la respuesta para incluir el nombre de la posición y el flujo de entrevistas
-    return {
-        positionName: positionWithInterviewFlow.title,
-        interviewFlow: {
-            id: positionWithInterviewFlow.interviewFlow.id,
-            description: positionWithInterviewFlow.interviewFlow.description,
-            interviewSteps: positionWithInterviewFlow.interviewFlow.interviewSteps.map(step => ({
-                id: step.id,
-                interviewFlowId: step.interviewFlowId,
-                interviewTypeId: step.interviewTypeId,
-                name: step.name,
-                orderIndex: step.orderIndex
-            }))
-        }
-    };
-};
+  // Formatear la respuesta para incluir el nombre de la posición y el flujo de entrevistas
+  return {
+    positionName: positionWithInterviewFlow.title,
+    interviewFlow: {
+      id: positionWithInterviewFlow.interviewFlow.id,
+      description: positionWithInterviewFlow.interviewFlow.description,
+      interviewSteps:
+        positionWithInterviewFlow.interviewFlow.interviewSteps.map((step) => ({
+          id: step.id,
+          interviewFlowId: step.interviewFlowId,
+          interviewTypeId: step.interviewTypeId,
+          name: step.name,
+          orderIndex: step.orderIndex,
+        })),
+    },
+  };
+};

frontend/package.json

@@ -3,6 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@fortawesome/fontawesome-svg-core": "^6.6.0",
+    "@fortawesome/free-solid-svg-icons": "^6.6.0",
+    "@fortawesome/react-fontawesome": "^0.2.2",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
@@ -16,6 +19,8 @@
     "react-bootstrap": "^2.10.2",
     "react-bootstrap-icons": "^1.11.4",
     "react-datepicker": "^6.9.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.23.1",
     "react-scripts": "5.0.1",

frontend/src/App.js

@@ -1,9 +1,10 @@
-import React from 'react';
 import 'bootstrap/dist/css/bootstrap.min.css';
-import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import React from 'react';
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import AddCandidate from './components/AddCandidateForm';
+import InterviewProcess from './components/InterviewProcess/InterviewProcess';
+import Positions from './components/Positions';
 import RecruiterDashboard from './components/RecruiterDashboard';
-import AddCandidate from './components/AddCandidateForm'; 
-import Positions from './components/Positions'; 
 
 const App = () => {
   return (
@@ -12,9 +13,10 @@ const App = () => {
         <Route path="/" element={<RecruiterDashboard />} />
         <Route path="/add-candidate" element={<AddCandidate />} /> {/* Agrega esta línea */}
         <Route path="/positions" element={<Positions />} />
+        <Route path="/positions/:id" element={<InterviewProcess />} />
       </Routes>
     </BrowserRouter>
   );
 };
 
-export default App;
+export default App;