profile page connected to backend and PATCH added, plagiatCheck updated and sertificate generate updated base backend types

src/features/modals/sertificateModal/useSertificateModal.ts

@@ -1,4 +1,7 @@
-import { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
+import { useMutation } from '@tanstack/react-query';
+import { apiRequest } from '@/shared/request/apiRequest';
+import { links } from '@/shared/request/links';
 import { CertificateFormData } from './types';
 
 interface UseCertificateModalProps {
@@ -7,6 +10,12 @@ interface UseCertificateModalProps {
   setOpen: () => void;
 }
 
+interface CertificatePayload {
+  full_name: string;
+  file_name: string;
+  document_type: number;
+}
+
 export function useCertificateModal({
   document_id,
   open,
@@ -18,11 +27,43 @@ export function useCertificateModal({
     document_type: '',
     document_id,
   });
-  const [loading, setLoading] = useState(false);
   const [success, setSuccess] = useState(false);
   const [visible, setVisible] = useState(false);
   const inputRef = useRef<HTMLInputElement>(null);
 
+  const certificateMutation = useMutation({
+    mutationFn: (payload: CertificatePayload) =>
+      apiRequest('POST', links.sertifikat(document_id), payload).then(
+        (res) => res.data as ArrayBuffer,
+      ),
+    onSuccess: (data: ArrayBuffer) => {
+      if (data) {
+        const blob = new Blob([data], { type: 'application/pdf' });
+        const objectUrl = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = objectUrl;
+        a.download = `certificate-${document_id}.pdf`;
+        a.click();
+        URL.revokeObjectURL(objectUrl);
+      }
+      setSuccess(true);
+      setTimeout(() => {
+        setOpen();
+        setSuccess(false);
+        resetForm();
+      }, 1500);
+    },
+  });
+
+  const resetForm = () => {
+    setForm({
+      fullname: '',
+      document_theme: '',
+      document_type: '',
+      document_id,
+    });
+  };
+
   useEffect(() => {
     if (open) {
       setVisible(true);
@@ -53,39 +94,13 @@ export function useCertificateModal({
     !!form.document_theme.trim() &&
     !!form.document_type;
 
-  /** Payload ready to send to backend */
-  const buildPayload = (): CertificateFormData => ({ ...form });
-
-  const handleSubmit = async () => {
-    if (!isFormValid || loading) return;
-    setLoading(true);
-
-    try {
-      const payload = buildPayload();
-
-      const response = await fetch(`/api/certificates`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(payload),
-      });
-
-      if (!response.ok) throw new Error('Failed');
-
-      setSuccess(true);
-      setTimeout(() => {
-        setOpen();
-        setSuccess(false);
-      }, 1800);
-    } catch {
-      // Demo mode: simulate success
-      setSuccess(true);
-      setTimeout(() => {
-        setOpen();
-        setSuccess(false);
-      }, 1800);
-    } finally {
-      setLoading(false);
-    }
+  const handleSubmit = () => {
+    if (!isFormValid || certificateMutation.isPending) return;
+    certificateMutation.mutate({
+      full_name: form.fullname,
+      file_name: form.document_theme,
+      document_type: Number(form.document_type),
+    });
   };
 
   const handleKeyDown = (e: React.KeyboardEvent) => {
@@ -100,7 +115,7 @@ export function useCertificateModal({
   return {
     form,
     updateField,
-    loading,
+    loading: certificateMutation.isPending,
     success,
     visible,
     isFormValid,