import React, { useState, useEffect } from "react";

import { getAdvertList, deleteAdvert } from "../../../api/advert-type-service"; // Assuming you have a deleteAdvert function in your API service

import {

  Container,

  Button,

} from "react-bootstrap";

import { AiOutlineDelete } from "react-icons/ai";

import { FiEdit2 } from "react-icons/fi";

import { LiaSearchMinusSolid } from "react-icons/lia";

import Spacer from "../../common/spacer";

​

const AdminAdvertTypes = (props) => {

  const [loading, setLoading] = useState(true);

  const [search, setSearch] = useState("");

  const [data, setData] = useState([]);

​

  const fetchData = async () => {

    try {

      const resp = await getAdvertList();

      setData(resp); // Assuming the response is an array of items

    } catch (error) {

      console.error("Error fetching data:", error);

    } finally {

      setLoading(false);

    }

  };

​

  useEffect(() => {

    fetchData();

  }, [search]);

​

  const handleDelete = async (itemId) => {

    try {

      await deleteAdvert(itemId); // Assuming deleteAdvert takes the item id as a parameter

      fetchData(); // Refresh the data after deletion

    } catch (error) {

      console.error("Error deleting data:", error);

    }

  };

​

  const getOperationButtons = (x) => {

    return (

      <>

        <Button

          className="btn-link icons"

          onClick={() => handleDelete(x.id)} // Assuming x has an id property

        >

          <AiOutlineDelete />

        </Button>

        <Button className="btn-link icons" onClick={() => props.edit(x)}>

          <FiEdit2 />

        </Button>

      </>

    );

  };

​

  return (

    <Container className="adTypePage">

      {/* Your existing JSX code */}

​

      {data.map((item) => (

        <div key={item.id} className="m-3  g-3  d-flex justify-content-between rounded row">

          <div className="w-25 text-left d-flex align-items-center">{item.title}</div>

          <div className="w-25 text-end me-4">{getOperationButtons(item)}</div>

        </div>

      ))}

​

      {/* Your existing JSX code */}

    </Container>

  );

};

​

export default AdminAdvertTypes;