'use client';

import { columns } from "@/components/admin/DiscountCupons/discountsColumn";
import { DataTable } from "./DataTable";
import Loader from "@/components/admin/custom ui/Loader";
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";



const DiscountCuponsClient = () => {

  const [coupons, setCoupons] = useState<CouponsType[]>([])
  const [total, setTotal] = useState(0)
  const [page, setPage] = useState(1)
  const [loading, setLoading] = useState(true)

  const fetchCoupons = async () => {
    const res = await fetch("/api/admin/coupons", { cache: "no-store" });
    
    const data = await res.json();
    
    console.log(data)
    setCoupons(data.coupons)

    setTotal(data.totalCoupons)
    setLoading(false)


  }

  useEffect(() => {
    fetchCoupons()
  }, [])

  const router = useRouter();

  return !coupons ? (
    <Loader />
  ) : (
    <div className="space-y-6 pt-5 px-2">
      <div className="flex items-center justify-between">
        <h1 className="text-3xl font-bold tracking-tight">Discounts/Coupons</h1>
      </div>
      <DataTable
        columns={columns}
        data={coupons}
        searchKey="coupon_name"
        showingRow={7}
        pagination={10}
      />
    </div>
  );
};

export default DiscountCuponsClient;