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

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

    let info = {
        insertLink: checkPermission("siteText.store")&& nextAdmin+formUrl+"/new",
        url: laraAdmin+laraUrl,
        columns: [
            { label: "", minWidth:"70px", jsx:(item)=><Pic src={`${mediaPath}/siteText/${item?.image}`} defaultImg={`${mediaPath}/public/default/course.jpg`} classImg="user-avatar" key={"img"+item?.thumbnail} />},
            {label: "title", field: "title_"+local},
            {label: "link", field: "link"},
            {label: "status",  jsx: (item)=><span className={"text-"+item?.active_status?.color}>{item?.active_status?.["title_"+local]}</span>},
            {label: "",
                sort:false, 
                width:"110px", 
                jsx:(item)=><>
                    <div className='flex justify-center '>
                        <FeatherIcon name="Edit" permission="siteText.update" url={nextAdmin+formUrl+"/"+item?.id+"/edit"} tooltip={Lang('public.edit')} />
                        <FeatherIcon name="XOctagon" permission="siteText.destroy" tooltip={Lang('public.delete')} color="darkred" onClick={()=>destroy(laraAdmin+laraUrl+"/"+item?.id)} />
                    </div>
                </>
            },
        ],
    }

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