import React, { useState } from "react";
import { Drawer, Button, Space, Radio } from "antd";
import { useSelector } from "react-redux";
import style from "./Drawer.module.scss";
import mobileImg from "../../assets/images/infinix.jpeg";
import { AiFillPlusCircle, AiFillMinusCircle } from "react-icons/ai";

const MainDrawer = ({ visible, setVisible }) => {
  const { item } = useSelector((state) => state.cart);

  console.log(item);

  const showDrawer = () => {
    setVisible(true);
  };

  const onClose = () => {
    setVisible(false);
  };

  console.log(window.innerWidth);

  // window.innerWidth

  return (
    <>
      <Drawer
        title="Check Out"
        placement="right"
        width={500}
        onClose={onClose}
        visible={visible}
        // extra={
        //   <Space>
        //     <Button onClick={onClose}>Cancel</Button>
        //     <Button type="primary" onClick={onClose}>
        //       OK
        //     </Button>
        //   </Space>
        // }
      >
        {item?.map((item, index) => {
          return (
            <>
              <div className={style.mainContainer}>
                <div className={style.imageContainer}>
                  <img src={item?.image} alt="" />
                </div>
                <div className={style.rightContainer}>
                  <p>{item?.title}</p>
                  <p className={style.productPrice}>Rs: {item?.price}</p>
                  <div className={style.countingDiv}>
                    <span>
                      <AiFillMinusCircle />
                    </span>
                    <p>0</p>
                    <span>
                      <AiFillPlusCircle />
                    </span>
                  </div>
                </div>
              </div>
            </>
          );
        })}
        <div className={style.subTotalContainer}>
          <p>Sub Total:</p>
          <p>RS: 1200</p>
        </div>
        <button className={style.submitBtn}>Submit</button>
      </Drawer>
    </>
  );
};

export default MainDrawer;
