import { PlusOutlined } from "@ant-design/icons";
import axios from "axios";
import React from "react";

const UploadImageComponent = () => {
  const handleImageChange = async info => {
    console.log("info", info);
    // setFileList(info.fileList);
    let formData = new FormData();
    formData.append("files", info.file.originFileObj);
    console.log("foles", formData);
    try {
      const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/upload`, formData, {
        headers: {
          "Content-Type": "multipart/form-data",
          Authorization: `Bearer ${session.jwt}`
        }
      });
      console.log("response image", response);
      // if (response.status == 200) {
      //   toast.success("Uploaded successfully");
      // }
      setimagesArrayComponent([...imagesArrayComponent, response.data[0].id]);

      // setimagesArrayComponent(
      //   response.data.map(item => {
      //     return { imageUrl: `${process.env.NEXT_PUBLIC_BACKEND_API_URL}${item.url}` };
      //   })
      // );
      // eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MywiaWF0IjoxNzE2MzY5MzQyLCJleHAiOjE3MTg5NjEzNDJ9.dHTpIvuUi4r4Eh7n-74WKDXUlSaqvhjppGJ-1G4GvHk
      // if (response.status === 200) {
      //   message.success("upload successfully.");
      //   console.log("Uploaded file URL:", response.data[0].url); // The URL of the uploaded file
      // } else {
      //   message.error("upload failed.");
      // }
    } catch (error) {
      message.error("upload failed.");
    } finally {
      setUploading(false);
    }
  };
  return (
    <div>
      <div className="upload-file">
        {/* <button> */}
        <input
          className="upload-file-input"
          type="file"
          id={`termsConditionsFile`}
          name={`termsConditionsFile`}
          onInput={e => {
            console.log(e);
          }}
        />
        {/* <PlusOutlined /> */}
        {/* </button> */}
        {/* <label className="custom-file-label" htmlFor={`termsConditionsFile`}>
          Upload
        </label> */}
      </div>
    </div>
  );
};

export default UploadImageComponent;