import { useTranslation } from "react-i18next";
import { useDeleteOrder } from "../../api/order";
import Actions from "../../Components/Ui/tables/Actions";
import { useNavigate } from "react-router-dom";

const useTableColumns = () => {
  const [t] = useTranslation();
  const navigate = useNavigate()
  const deleteMutation = useDeleteOrder()
  const language = localStorage.getItem("language") ?? "en"

   
    let column =  [
      {
        name: t("order_code"),
        sortable: false,
        center:true,
        selector:(row:any) => row?.id,
      },    
      {
        name: t("name"),
        sortable: false,
        center:true,
        selector:(row:any) => row?.user?.name,

      },
      {
        name: t("email"),
        sortable: false,
        center:true,
        selector:(row:any) => row?.user?.email,

      },
      {
        name: t("status"),
        center: true,
        
        cell:(row:any)=>{

          return row?.state;
          // return <OrderStatus  order_status={row?.order_status}/>

        }
      },
  
      {
        name: t("total"),
        center: true,
        cell:(row:any)=>{
          
          return (row?.total)
        }
      },
      {
        name: "#",
        center: true,
        cell: (row:any) =>
            <span style={{display:"flex" , alignItems:"center" , justifyContent:"space-around" , width:"100px" }}   >
          
            <Actions
            showDelete={false}
            objectToEdit={row}
            onDelete={() => deleteMutation.mutate({order_id:row.id })}  
            showEdit={true}
            onView={()=>navigate(`/order/view/${row?.id}` , {replace:true})}
            onEdit={()=>navigate(`/order/${row?.id}` , {replace:true})}

            />
            
            </span>
          
          
      },

     
    
    
    ]


  
        
    
    return column 

};

export default useTableColumns;
