extra_code.txt

// after taking file input converting file to base64 format and pushing to /api/upload
const [file, setFile] = useState<File | null>(null);

  const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const selectedFile = event.target.files?.[0] || null;
     setFile(selectedFile);
   };

   const handleUpload = async () => {
     if (!file) {
       alert("Please select a file to upload.");
       return;
     }
     const base64String = await fileToBase64(file);
     const formData = new FormData();
     formData.append("file", base64String);
     const filename = file.name;
     formData.append("filename", filename); 

     console.log(filename);
     console.log(base64String);

     try {
       const response = await fetch("/api/upload", {
         method: "POST",
         body: formData,
     });

       if (response.ok) {
         alert("File uploaded successfully!");
       } else {
         alert("File upload failed.");
       }
     } catch (error) {
       console.error("Error uploading file:", error);
       alert("An error occurred while uploading the file.");
     }
   };

    // File to base64 code
   const fileToBase64 = (file: File): Promise<string> => {
     return new Promise((resolve, reject) => {
       const reader = new FileReader();
       reader.onloadend = () => {
         const base64 = reader.result?.toString().replace(/^data:.+;base64,/, '') || '';
         resolve(base64); // Return the Base64 string
       };
       reader.onerror = (error) => {
         reject(error);
       };
       reader.readAsDataURL(file);
     });
   };



    // Taking input and uploading it to /documents

    <input
        type="file"
        onChange={handleFileChange}
        className="mb-4 p-2 border border-gray-400 rounded"
    />

      <Link href={"/documents"}>
      <button
        onClick={handleUpload}
        className="px-4 py-3 m-3 bg-blue-500 text-white rounded hover:bg-blue-600"
      >
        Upload
      </button>
      </Link>