import React, { useMemo } from "react";
import { useTranslation } from "react-i18next";
import Actions from "../../../../Components/Ui/tables/Actions";
import { useNavigate } from "react-router-dom";
import { useDeleteProjectImage } from "../../../../api/Project";
import ColumnsImage from "../../../../Components/Columns/ColumnsImage";


const useTableColumns :any = () => {
  const [t] = useTranslation();
  const deleteMutation = useDeleteProjectImage()
  const navigate = useNavigate()
    return useMemo(
    () => [
 
      {
        name: t("id"),
        sortable: true,
        center: true,
        selector: (row: any) => row.id, 
      }, 
      {
        name: t("image"),
        sortable: false,
        center: "true",
        cell: (row:any) =>  {
          let src = row?.image;
          return <ColumnsImage src={src} />
        }
        
      },
    

      {
        name: t("is_active"),
        sortable: false,
        center: "true",
        cell: (row:any) => row?.is_active === 1  ?   "true"   :  "false"
      },
      {
        name: "#",
        sortable: false,
        center: true,
        cell: (row:any) => (
          <Actions
            objectToEdit={row}
            showEdit={false}
            showView={false}
            onDelete={() => deleteMutation.mutate({ id: row.id })}
          >  
          </Actions>
        ),
      },

    ],
    [deleteMutation, t]
  );
};

export default useTableColumns;