extraction func is added

apps/Frontend/src/hooks/use-extractPdfData.ts

@@ -16,17 +16,10 @@ export default function useExtractPdfData() {
       const formData = new FormData();
       formData.append("pdf", pdfFile);
 
-      const res = await apiRequest("POST", "/api/pdfExtraction/", formData);
+      const res = await apiRequest("POST", "/api/pdfExtraction/extract", formData);
       if (!res.ok) throw new Error("Failed to extract PDF");
       return res.json();
     },
-    onSuccess: () => {
-      toast({
-        title: "Success",
-        description: "PDF data extracted!",
-        variant: "default",
-      });
-    },
     onError: (error) => {
       toast({
         title: "Error",
@@ -34,5 +27,5 @@ export default function useExtractPdfData() {
         variant: "destructive",
       });
     },
-  });
+  }); 
 }

apps/Frontend/src/lib/queryClient.ts

@@ -16,14 +16,18 @@ export async function apiRequest(
 ): Promise<Response> {
   const token = localStorage.getItem("token");
 
+  const isFormData = typeof FormData !== "undefined" && data instanceof FormData;
+
+  const headers: Record<string, string> = {
+    ...(token ? { Authorization: `Bearer ${token}` } : {}),
+    // Only set Content-Type if not using FormData
+    ...(isFormData ? {} : { "Content-Type": "application/json" }),
+  };
+
   const res = await fetch(`${API_BASE_URL}${url}`, {
     method,
-    // headers: data ? { "Content-Type": "application/json" } : {},
-    headers: {
-      "Content-Type": "application/json",
-      ...(token ? { Authorization: `Bearer ${token}` } : {}), // Include JWT token if available
-    },
-    body: data ? JSON.stringify(data) : undefined,
+    headers,
+    body: isFormData ? data as FormData : JSON.stringify(data),
     credentials: "include",
   });
 

apps/Frontend/src/pages/patients-page.tsx

@@ -87,7 +87,7 @@ export default function PatientsPage() {
   const [isUploading, setIsUploading] = useState(false);
   const [isExtracting, setIsExtracting] = useState(false);
   const [formData, setFormData] = useState({ PatientName: "", PatientMemberId: "", PatientDob:"" });
-  const { mutate: extractPdf, isPending } = useExtractPdfData();
+  const { mutate: extractPdf} = useExtractPdfData();
 
 
   // Fetch patients
@@ -294,21 +294,39 @@ export default function PatientsPage() {
 
   // File upload handling
   const handleFileUpload = (file: File) => {
+    setIsUploading(true); 
     setUploadedFile(file);
-    setIsUploading(false); // In a real implementation, this would be set to true during upload
 
     toast({
       title: "File Selected",
       description: `${file.name} is ready for processing.`,
       variant: "default",
     });
+
+    setIsUploading(false);
   };
 
   // data extraction
-  const handleExtract = () => {
-    if (!uploadedFile) return alert("Please upload a PDF.");
+  const handleExtract = () =>{
+    setIsExtracting(true);
+
+    if (!uploadedFile){
+       return toast({
+        title: "Error",
+        description:"Please upload a PDF",
+        variant: "destructive",
+      });
+    }
     extractPdf(uploadedFile, {
       onSuccess: (data) => {
+        setIsExtracting(false);
+
+        toast({
+        title: "Success Pdf Data Extracted",
+        description: `Name: ${data.name}, Member ID: ${data.memberId}, DOB: ${data.dob}`,
+        variant: "default",
+      });
+
         setFormData({ PatientName: data.name || "", PatientMemberId: data.memberId || "",  PatientDob: data.dob || ""});
       },
     });