"use client";
import { useLang } from "@/lib/lang";
import { useConfig } from "@/lib/config";
import { Grid, Frame,useData} from "@/Theme/Midone/Utils";
import { FeatherIcon} from "@/Theme/Midone/Utils/FeatherIcon";
import { useAccess } from "@/lib/access";

export default function List(){
    const {Lang,local} = useLang();
    const {laraAdmin ,nextAdmin } = useConfig();
    const formUrl = "/packageLevel";
    const laraUrl = "/package-levels";
    const {destroy} = useData();
    const { componentPermission,checkPermission } = useAccess();
    componentPermission("packageLevel.index");

    let info = {
        insertLink: checkPermission("packageLevel.store")&& nextAdmin+formUrl + "/new",
        url: laraAdmin+laraUrl,
        columns: [
            {label: "title", field: "title_"+local},
            {label: "status",  jsx: (item)=><span className={item.active_status?.color}>{item.active_status?.["title_"+local]}</span>},
            {label: "", sort:false, width:"110px", 
                jsx:(item)=><>
                    <div className='flex justify-center '>
                        <FeatherIcon permission="packageLevel.update" name="Edit" url={nextAdmin+formUrl+"/"+item.id+"/edit"} tooltip={Lang('public.edit')} />
                        <FeatherIcon permission="packageLevel.destroy" name="XOctagon" tooltip={Lang('public.delete')} color="darkred" onClick={()=>destroy(laraAdmin+laraUrl+"/"+item.id)} />
                    </div>
                </>
            },
        ],
    }

    return(
        <Frame title={Lang(["public.packageLevel"])}>
            <div className="intro-y col-span-12">
                <Grid {...info} key={"table key"} />
            </div>
        </Frame>
    );
}