"use client"; import React from "react"; import { set, z } from "zod"; import { useForm } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, } from "@/components/ui/form"; import { LucideRemoveFormatting, RemoveFormattingIcon, SidebarClose, } from "lucide-react"; import Landing from "../ContextComponents/Commons/Landing"; const formSchema = z.object({ searchText: z.string().default(""), }); const packageData = [ { name: "Free package", price: 0.0, invoiceDate: `Jan 13,2023`, status: true, selected: false, }, { name: "Standard Package", price: 59.0, invoiceDate: `Jan 13,2023`, status: true, selected: false, }, { name: "Business Package", price: 99.0, invoiceDate: `Jan 13,2023`, status: false, selected: false, }, { name: "Standard Package", price: 59.0, invoiceDate: `Jan 13,2023`, status: false, selected: false, }, ]; const headers = [ "Package", "Package1", "Package2", "Package3", "Invoice date", "Onaylandı", ]; const TableThree = () => { const [packageList, setPackageList] = React.useState(Array.from(packageData)); const [tableShow, settableShow] = React.useState(true); const form = useForm>({ resolver: zodResolver(formSchema), }); function selectItem({ key }: { key: number }) { packageList.map((item, index) => { if (index === key) { item.selected = !item.selected; } }); setPackageList([...packageList] as any); } function cleanSelection() { packageList.map((item) => { item.selected = false; }); setPackageList([...packageList] as any); } function cleanSearch() { form.setValue("searchText", ""); setPackageList(Array.from(packageData)); } function search(values: z.infer) { const searchText = values.searchText; if (searchText === "") { setPackageList(Array.from(packageData)); } else { const filteredList = Array.from(packageData).filter((item) => { return item.name.toLowerCase().includes(searchText.toLowerCase()); }); setPackageList(filteredList); } } React.useEffect(() => {}, [packageList]); if (tableShow) { return ( <>
cleanSelection()} > Seçimleri Temizle
Seçili Olanları Sil
Kayıdı Güncelle
Kayıt ekle
( )} />
{headers.map((header, key) => ( ))} {packageList.map((packageItem, key) => ( selectItem({ key })} > ))}
{header}
{packageItem.name}
{packageItem.name}
{packageItem.name}
{packageItem.name}

{packageItem.invoiceDate}

{packageItem.status ? "Evet" : "Hayır"}

); } else { return ; } }; export default TableThree;