update score calculation on server and update detail profile (get from backend instead read manually from db)

src/app/api/agentic/route.ts

@@ -0,0 +1,86 @@
+import { CalculateWeightPayload, WeightBody } from "@/types/calculate";
+import { FilterFormValues } from "@/types/candidate-table";
+import { cookies } from "next/headers";
+import { NextRequest, NextResponse } from "next/server";
+
+function toFilterBody(filters: FilterFormValues) {
+  return {
+    gpa_edu_1:   filters.educations[0]?.gpa       || null,
+    univ_edu_1:  filters.educations[0]?.university || null,
+    major_edu_1: filters.educations[0]?.major      || null,
+    gpa_edu_2:   filters.educations[1]?.gpa        || null,
+    univ_edu_2:  filters.educations[1]?.university || null,
+    major_edu_2: filters.educations[1]?.major      || null,
+    gpa_edu_3:   filters.educations[2]?.gpa        || null,
+    univ_edu_3:  filters.educations[2]?.university || null,
+    major_edu_3: filters.educations[2]?.major      || null,
+    domicile:        filters.domicile      || null,
+    yoe:             filters.yoe           || null,
+    hardskills:      filters.hardskills?.length    ? [filters.hardskills]    : null,
+    softskills:      filters.softskills?.length    ? [filters.softskills]    : null,
+    certifications:  filters.certifications?.length ? [filters.certifications] : null,
+    business_domain: filters.businessDomain?.length ? [filters.businessDomain] : null,
+  }
+}
+
+function toWeightBody(value: CalculateWeightPayload): WeightBody {
+  const edu = (i: number) => value.education[i] ?? { university: 0, major: 0, gpa: 0 }
+  return {
+    univ_edu_1: edu(0).university / 100, major_edu_1: edu(0).major / 100, gpa_edu_1: edu(0).gpa / 100,
+    univ_edu_2: edu(1).university / 100, major_edu_2: edu(1).major / 100, gpa_edu_2: edu(1).gpa / 100,
+    univ_edu_3: edu(2).university / 100, major_edu_3: edu(2).major / 100, gpa_edu_3: edu(2).gpa / 100,
+    domicile:        value.others.domicile / 100,
+    yoe:             value.others.yearOfExperiences / 100,
+    hardskills:      value.others.hardskills / 100,
+    softskills:      value.others.softskills / 100,
+    certifications:  value.others.certifications / 100,
+    business_domain: value.others.businessDomain / 100,
+  }
+}
+
+export async function POST(request: NextRequest) {
+  const cookieStore = await cookies();
+  const token = cookieStore.get('auth_token')?.value;
+  const body = await request.json()
+
+  const resCreateFilter = await fetch(
+    `https://byteriot-candidateexplorer.hf.space/CandidateExplorer/agentic/create_filter`,
+    {
+      method: "POST",
+      headers: {
+      Authorization: `Bearer ${token}`,
+      "Content-Type": "application/json",
+    },
+      body: JSON.stringify(toFilterBody(body.filters)),
+    }
+  )
+
+  const dataFilter = await resCreateFilter.json()
+
+  const resCreateWeight = await fetch(
+     `https://byteriot-candidateexplorer.hf.space/CandidateExplorer/agentic/create_weight?criteria_id=${dataFilter.criteria_id}`,
+    {
+      method: "POST",
+      headers: {
+      Authorization: `Bearer ${token}`,
+      "Content-Type": "application/json",
+    },
+      body: JSON.stringify(toWeightBody(body.weights)),
+    }
+  )
+
+  const dataWeight = await resCreateWeight.json()
+
+  const resCalculate = await fetch(
+     `https://byteriot-candidateexplorer.hf.space/CandidateExplorer/agentic/calculate_score?weight_id=${dataWeight.data.weight_id}`,
+    {
+      method: "POST",
+      headers: {
+      Authorization: `Bearer ${token}`,
+      "Content-Type": "application/json",
+    }
+    }
+  )
+
+  return NextResponse.json(dataFilter, { status: resCalculate.status })
+}

src/app/api/cv-profile/profile-detail/route.ts

@@ -0,0 +1,42 @@
+import { cookies } from "next/headers";
+import { NextResponse } from "next/server";
+
+export async function GET(req: Request) {
+  try {
+    const cookieStore = await cookies();
+    const token = cookieStore.get("auth_token")?.value;
+
+    if (!token) {
+      return NextResponse.json(
+        { message: "Not authenticated" },
+        { status: 401 },
+      );
+    }
+    
+    const { searchParams } = new URL(req.url);
+    const profile_id = searchParams.get("profile_id");
+
+    const response = await fetch(
+      `https://byteriot-candidateexplorer.hf.space/CandidateExplorer/profile/${profile_id}`,
+      {
+        headers: { Authorization: `Bearer ${token}` },
+      },
+    );
+
+    if (!response.ok) {
+      return NextResponse.json(
+        { message: 'Invalid token' },
+        { status: 401 }
+      );
+    }
+
+    const scoreCardData = await response.json();
+    return NextResponse.json(scoreCardData, { status: 200 });
+  } catch (error) {
+    console.error("Get Profile error:", error);
+    return NextResponse.json(
+      { message: "Failed to fetch profile" },
+      { status: 500 },
+    );
+  }
+}

src/components/dashboard/detail-dialog.tsx

@@ -1,7 +1,10 @@
 'use client';
 
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
+import { authFetch } from '@/lib/api';
 import { Candidate } from '@/types/candidate-table';
+import { Profile } from '@/types/profile';
+import { useQuery } from '@tanstack/react-query';
 import { Download } from 'lucide-react';
 import { Badge } from '../ui/badge';
 
@@ -11,107 +14,165 @@ interface DetailDialogProps {
   candidate?: Candidate | null;
 }
 
-export function DetailDialog({ open, onOpenChange, candidate }: DetailDialogProps) {
-  if (!candidate) return null;
+// Helper: check if value is meaningful
+const isValidValue = (value: any) => {
+  if (value === null || value === undefined) return false
+  if (typeof value === "string" && value.trim() === "") return false
+  if (typeof value === "number" && value === 0) return false
+  return true
+}
+
+const InfoItem = ({ label, value }: { label: string; value: React.ReactNode }) => {
+  if (!isValidValue(value)) return null
 
-  const InfoItem = ({ label, value }: { label: string; value: React.ReactNode }) => (
+  return (
     <div>
       <h3 className="text-sm text-gray-500">{label}</h3>
-      <div className="text-base">{value || "-"}</div>
+      <div className="text-base">{value}</div>
     </div>
   )
+}
+
+export function DetailDialog({ open, onOpenChange, candidate }: DetailDialogProps) {
+
+  const fetchProfile = async (profileId: string): Promise<Profile> => {
+    const res = await authFetch(`/api/cv-profile/profile-detail?profile_id=${profileId}`)
+    if (!res.ok) throw new Error("Failed to fetch profile")
+    return res.json()
+  }
+
+  const { data, isLoading } = useQuery({
+    queryKey: ["profile-detail", candidate?.profile_id],
+    queryFn: () => fetchProfile(candidate!.profile_id),
+    enabled: open && !!candidate?.profile_id,
+    staleTime: 0,
+    refetchOnWindowFocus: false,
+  })
+
+  const handleDownload = () => {
+    if (!data?.url) return
+    window.open(data.url, '_blank')
+  }
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-2xl">
+
         <DialogHeader>
-          <DialogTitle>Profile Candidates</DialogTitle>
+          <DialogTitle>Profile Candidate</DialogTitle>
         </DialogHeader>
 
-        <div className="grid grid-cols-2 gap-4">
-          <InfoItem label="Full Name" value={candidate.fullname} />
-          <InfoItem label="Domicile" value={candidate.domicile} />
-          <InfoItem label="Year of Experience" value={candidate.yoe ? `${candidate.yoe} year${candidate.yoe !== 1 ? "s" : ""}` : "-"} />
-          <InfoItem label="Filename" value={candidate.filename} />
-
-          {/* Education 1 */}
-          {candidate.univ_edu_1 && (
-            <InfoItem label="University 1" value={candidate.univ_edu_1} />
-          )}
-          {candidate.major_edu_1 && (
-            <InfoItem label="Major 1" value={candidate.major_edu_1} />
-          )}
-          {candidate.gpa_edu_1 && (
-            <InfoItem label="GPA 1" value={candidate.gpa_edu_1} />
-          )}
-
-          {/* Education 2 */}
-          {candidate.univ_edu_2 && (
-            <InfoItem label="University 2" value={candidate.univ_edu_2} />
-          )}
-          {candidate.major_edu_2 && (
-            <InfoItem label="Major 2" value={candidate.major_edu_2} />
-          )}
-          {candidate.gpa_edu_2 && (
-            <InfoItem label="GPA 2" value={candidate.gpa_edu_2} />
-          )}
-
-          {/* Education 3 */}
-          {candidate.univ_edu_3 && (
-            <InfoItem label="University 3" value={candidate.univ_edu_3} />
-          )}
-          {candidate.major_edu_3 && (
-            <InfoItem label="Major 3" value={candidate.major_edu_3} />
-          )}
-          {candidate.gpa_edu_3 && (
-            <InfoItem label="GPA 3" value={candidate.gpa_edu_3} />
-          )}
-
-          {/* Array fields */}
-          <div className="col-span-2">
-            <h3 className="text-sm text-gray-500 mb-1">Hardskills</h3>
-            <div className="flex flex-wrap gap-2">
-              {candidate.hardskills?.length > 0
-                ? candidate.hardskills.map((s) => <Badge variant="outline" key={s}>{s}</Badge>)
-                : "-"}
-            </div>
+        {/* ===================== */}
+        {/* 🔹 LOADING SKELETON */}
+        {/* ===================== */}
+        {isLoading && (
+          <div className="grid grid-cols-2 gap-4 animate-pulse">
+            {Array.from({ length: 10 }).map((_, i) => (
+              <div key={i}>
+                <div className="h-3 bg-gray-200 rounded w-24 mb-2" />
+                <div className="h-4 bg-gray-200 rounded w-full" />
+              </div>
+            ))}
           </div>
+        )}
 
-          <div className="col-span-2">
-            <h3 className="text-sm text-gray-500 mb-1">Softskills</h3>
-            <div className="flex flex-wrap gap-2">
-              {candidate.softskills?.length > 0
-                ? candidate.softskills.map((s) => <Badge variant="outline" key={s}>{s}</Badge>)
-                : "-"}
-            </div>
-          </div>
+        {/* ===================== */}
+        {/* 🔹 CONTENT */}
+        {/* ===================== */}
+        {!isLoading && data && (
+          <div className="grid grid-cols-2 gap-4">
 
-          <div className="col-span-2">
-            <h3 className="text-sm text-gray-500 mb-1">Certifications</h3>
-            <div className="flex flex-wrap gap-2">
-              {candidate.certifications?.length > 0
-                ? candidate.certifications.map((s) => <Badge variant="outline" key={s}>{s}</Badge>)
-                : "-"}
-            </div>
-          </div>
+            <InfoItem label="Full Name" value={data.fullname} />
+            <InfoItem label="Domicile" value={data.domicile} />
 
-          <div className="col-span-2">
-            <h3 className="text-sm text-gray-500 mb-1">Business Domain</h3>
-            <div className="flex flex-wrap gap-2">
-              {candidate.business_domain?.length > 0
-                ? candidate.business_domain.map((s) => <Badge variant="outline" key={s}>{s}</Badge>)
-                : "-"}
-            </div>
-          </div>
+            <InfoItem
+              label="Year of Experience"
+              value={
+                isValidValue(data.yoe)
+                  ? `${data.yoe} year${data.yoe !== 1 ? "s" : ""}`
+                  : null
+              }
+            />
+
+            <InfoItem label="Filename" value={data.filename} />
+
+            {/* Education 1 */}
+            <InfoItem label="University 1" value={data.univ_edu_1} />
+            <InfoItem label="Major 1" value={data.major_edu_1} />
+            <InfoItem label="GPA 1" value={data.gpa_edu_1} />
+
+            {/* Education 2 */}
+            <InfoItem label="University 2" value={data.univ_edu_2} />
+            <InfoItem label="Major 2" value={data.major_edu_2} />
+            <InfoItem label="GPA 2" value={data.gpa_edu_2} />
+
+            {/* Education 3 */}
+            <InfoItem label="University 3" value={data.univ_edu_3} />
+            <InfoItem label="Major 3" value={data.major_edu_3} />
+            <InfoItem label="GPA 3" value={data.gpa_edu_3} />
+
+            {/* Arrays */}
+            {data.hardskills?.length > 0 && (
+              <div className="col-span-2">
+                <h3 className="text-sm text-gray-500 mb-1">Hardskills</h3>
+                <div className="flex flex-wrap gap-2">
+                  {data.hardskills.map((s) => (
+                    <Badge variant="outline" key={s}>{s}</Badge>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {data.softskills?.length > 0 && (
+              <div className="col-span-2">
+                <h3 className="text-sm text-gray-500 mb-1">Softskills</h3>
+                <div className="flex flex-wrap gap-2">
+                  {data.softskills.map((s) => (
+                    <Badge variant="outline" key={s}>{s}</Badge>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {data.certifications?.length > 0 && (
+              <div className="col-span-2">
+                <h3 className="text-sm text-gray-500 mb-1">Certifications</h3>
+                <div className="flex flex-wrap gap-2">
+                  {data.certifications.map((s) => (
+                    <Badge variant="outline" key={s}>{s}</Badge>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {data.business_domain?.length > 0 && (
+              <div className="col-span-2">
+                <h3 className="text-sm text-gray-500 mb-1">Business Domain</h3>
+                <div className="flex flex-wrap gap-2">
+                  {data.business_domain.map((s) => (
+                    <Badge variant="outline" key={s}>{s}</Badge>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            {/* Download */}
+            {isValidValue(data.url) && (
+              <div>
+                <h3 className="text-sm text-gray-500">CV</h3>
+                <button
+                  className="mt-1 flex items-center gap-1 text-sm text-green-600 hover:underline"
+                  onClick={handleDownload}
+                >
+                  <Download className="size-4" />
+                  {data.filename}
+                </button>
+              </div>
+            )}
 
-          <div>
-            <h3 className="text-sm text-gray-500">CV</h3>
-            <button className="mt-1 flex items-center gap-1 text-sm text-green-600 hover:underline">
-              <Download className="size-4" />
-              {candidate.filename}
-            </button>
           </div>
-        </div>
+        )}
+
       </DialogContent>
     </Dialog>
   );

src/lib/scoring-service.ts

@@ -53,17 +53,9 @@ export async function createAndCalculateScore(
   filters: FilterFormValues,
   weights: CalculateWeightPayload
 ): Promise<{ criteriaId: string }> {
-  // Step 1 — create filter → get criteria_id
-  const filterData = await postJSON(`${BASE_URL}/create_filter`, toFilterBody(filters))
-
-  // Step 2 — create weight → get weight_id + criteria_id
-  const weightData = await postJSON(
-    `${BASE_URL}/create_weight?criteria_id=${filterData.criteria_id}`,
-    toWeightBody(weights)
-  )
-
-  // Step 3 — trigger score calculation
-  await postJSON(`${BASE_URL}/calculate_score?weight_id=${weightData.data.weight_id}`)
-
-  return { criteriaId: weightData.data.criteria_id }
+  const res = await postJSON("/api/agentic", {
+    filters,
+    weights
+  })
+  return { criteriaId: res.criteria_id }
 }

src/types/profile.ts

@@ -0,0 +1,30 @@
+export type Profile = {
+  profile_id: string
+  fullname: string
+
+  gpa_edu_1: number
+  univ_edu_1: string
+  major_edu_1: string
+
+  gpa_edu_2: number
+  univ_edu_2: string
+  major_edu_2: string
+
+  gpa_edu_3: number
+  univ_edu_3: string
+  major_edu_3: string
+
+  domicile: string
+  yoe: number
+
+  hardskills: string[]
+  softskills: string[]
+  certifications: string[]
+  business_domain: string[]
+
+  filename: string
+  file_id: string
+
+  created_at: string // ISO date string
+  url: string
+}