kontenhumas-fe/app/[locale]/(admin)/admin/settings/tenant/component/columns.tsx

301 lines
10 KiB
TypeScript

"use client";
import * as React from "react";
import { ColumnDef } from "@tanstack/react-table";
import { Eye, MoreVertical, SquarePen, Trash2 } from "lucide-react";
import { cn, getCookiesDecrypt } from "@/lib/utils";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuTrigger,
DropdownMenuItem,
} from "@/components/ui/dropdown-menu";
import { Button } from "@/components/ui/button";
import { Badge } from "@/components/ui/badge";
import { format } from "date-fns";
import { useRouter } from "next/navigation";
import { deleteMedia } from "@/service/content/content";
import { error } from "@/lib/swal";
import Swal from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
import Link from "next/link";
import { deleteUserLevel } from "@/service/tenant";
const useTableColumns = () => {
const MySwal = withReactContent(Swal);
const userLevelId = getCookiesDecrypt("ulie");
const columns: ColumnDef<any>[] = [
{
accessorKey: "no",
header: "No",
cell: ({ row }) => (
<div className="flex items-center gap-5">
<div className="flex-1 text-start">
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
{row.getValue("no")}
</h4>
</div>
</div>
),
},
{
accessorKey: "aliasName",
header: "Name",
cell: ({ row }) => (
<div className="flex items-center gap-5">
<div className="flex-1 text-start">
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
{row.getValue("aliasName")}
</h4>
</div>
</div>
),
},
{
accessorKey: "group",
header: "Group",
cell: ({ row }) => (
<div className="flex items-center gap-5">
<div className="flex-1 text-start">
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
{row.getValue("group")}
</h4>
</div>
</div>
),
},
{
accessorKey: "parentLevelName",
header: "Parent Level",
cell: ({ row }) => (
<div className="flex items-center gap-5">
<div className="flex-1 text-start">
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
{row.getValue("parentLevelName")}
</h4>
</div>
</div>
),
},
// {
// accessorKey: "createdAt",
// header: "Upload Date",
// cell: ({ row }) => {
// const createdAt = row.getValue("createdAt") as string | number | undefined;
// const formattedDate =
// createdAt && !isNaN(new Date(createdAt).getTime())
// ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss")
// : "-";
// return <span className="whitespace-nowrap">{formattedDate}</span>;
// },
// },
// {
// accessorKey: "creatorName",
// header: "Creator Group",
// cell: ({ row }) => (
// <span className="whitespace-nowrap">
// {row.original.creatorName || row.original.createdByName || "-"}
// </span>
// ),
// },
// {
// accessorKey: "creatorGroupLevelName",
// header: "Source",
// cell: ({ row }) => (
// <span className="whitespace-nowrap">
// {row.getValue("creatorGroupLevelName") || "-"}
// </span>
// ),
// },
// {
// accessorKey: "publishedOn",
// header: "Published",
// cell: ({ row }) => {
// const isPublish = row.original.isPublish;
// const isPublishOnPolda = row.original.isPublishOnPolda;
// const creatorGroupParentLevelId = row.original.creatorGroupParentLevelId;
// let displayText = "-";
// if (isPublish && !isPublishOnPolda) {
// displayText = "Mabes";
// } else if (isPublish && isPublishOnPolda) {
// if (Number(creatorGroupParentLevelId) === 761) {
// displayText = "Mabes & Satker";
// } else {
// displayText = "Mabes & Polda";
// }
// } else if (!isPublish && isPublishOnPolda) {
// if (Number(creatorGroupParentLevelId) === 761) {
// displayText = "Satker";
// } else {
// displayText = "Polda";
// }
// }
// return (
// <div className="text-center whitespace-nowrap" title={displayText}>
// {displayText}
// </div>
// );
// },
// },
// {
// accessorKey: "statusName",
// header: "Status",
// cell: ({ row }) => {
// const statusId = Number(row.original?.statusId);
// const reviewedAtLevel = row.original?.reviewedAtLevel || "";
// const creatorGroupLevelId = Number(row.original?.creatorGroupLevelId);
// const needApprovalFromLevel = Number(row.original?.needApprovalFromLevel);
// const userHasReviewed = reviewedAtLevel.includes(`:${userLevelId}:`);
// const isCreator = creatorGroupLevelId === Number(userLevelId);
// const isWaitingForReview = statusId === 2 && !userHasReviewed && !isCreator;
// const isApprovalNeeded = statusId === 1 && needApprovalFromLevel === Number(userLevelId);
// const label =
// isWaitingForReview || isApprovalNeeded
// ? "Menunggu Review"
// : statusId === 2
// ? "Diterima"
// : row.original?.statusName;
// const colors: Record<string, string> = {
// "Menunggu Review": "bg-orange-100 text-orange-600",
// Diterima: "bg-green-100 text-green-600",
// default: "bg-red-200 text-red-600",
// };
// const statusStyles = colors[label] || colors.default;
// return (
// <Badge className={cn("rounded-full px-5 w-full whitespace-nowrap", statusStyles)}>
// {label}
// </Badge>
// );
// },
// },
{
id: "actions",
accessorKey: "action",
header: "Action",
enableHiding: false,
cell: ({ row }) => {
const router = useRouter();
const MySwal = withReactContent(Swal);
async function doDelete(id: number) {
const response = await deleteUserLevel(id);
if (response?.error) {
error(response.message || "Gagal menghapus data");
return;
}
MySwal.fire({
title: "Sukses",
text: "User Level berhasil dihapus.",
icon: "success",
confirmButtonColor: "#3085d6",
confirmButtonText: "OK",
}).then((result) => {
if (result.isConfirmed) {
window.location.reload();
}
});
}
const handleDelete = (id: number) => {
MySwal.fire({
title: "Yakin ingin menghapus?",
text: "Data ini tidak dapat dikembalikan!",
icon: "warning",
showCancelButton: true,
confirmButtonText: "Ya, hapus",
cancelButtonText: "Batal",
confirmButtonColor: "#d33",
cancelButtonColor: "#3085d6",
}).then((result) => {
if (result.isConfirmed) {
doDelete(id);
}
});
};
const handleDeleteMedia = (id: any) => {
MySwal.fire({
title: "Hapus Data",
icon: "warning",
showCancelButton: true,
cancelButtonColor: "#3085d6",
confirmButtonColor: "#d33",
confirmButtonText: "Hapus",
}).then((result) => {
if (result.isConfirmed) {
doDelete(id);
}
});
};
const [isMabesApprover, setIsMabesApprover] = React.useState(false);
const userId = getCookiesDecrypt("uie");
const userLevelId = getCookiesDecrypt("ulie");
const roleId = getCookiesDecrypt("urie");
React.useEffect(() => {
if (userLevelId !== undefined && roleId !== undefined) {
setIsMabesApprover(
Number(userLevelId) === 216 && Number(roleId) === 3
);
}
}, [userLevelId, roleId]);
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
size="icon"
className="bg-transparent ring-offset-transparent hover:bg-transparent hover:ring-0 hover:ring-transparent"
>
<span className="sr-only">Open menu</span>
<MoreVertical className="h-4 w-4 text-default-800" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="p-0 hover:text-black" align="end">
{/* <Link
href={`/admin/settings/tenant/detail/${row.original.id}`}
className="hover:text-black"
>
<DropdownMenuItem className="p-2 border-b text-default-700 rounded-none">
<Eye className="w-4 h-4 me-1.5" />
View
</DropdownMenuItem>
</Link> */}
{/* {(Number(row.original.uploadedById) === Number(userId) || isMabesApprover) && ( */}
<Link href={`/admin/settings/tenant/update/${row.original.id}`}>
<DropdownMenuItem className="p-2 border-b text-default-700 rounded-none">
<SquarePen className="w-4 h-4 me-1.5" />
Edit
</DropdownMenuItem>
</Link>
{/* )} */}
<DropdownMenuItem
onClick={() => handleDeleteMedia(row.original.id)}
className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-white rounded-none"
>
<Trash2 className="w-4 h-4 me-1.5" />
Delete
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
);
},
},
];
return columns;
};
export default useTableColumns;