How to add action buttons on each row like view/delete

[rohit-rai-0101rm]

i have a list of employees that is getting rendered with the table and there is a field called empCode in each row.
i want to add a view/delete button on each row and perform actions based on empCode like view employee profile or delete employee.
empCode is unique.

please help on this

[hozaifa4you]

Check it

export const columns: ColumnDef<Payment>[] = [
  {
    accessorKey: "status",
    header: "Status",
    cell: ({ row }) => (
      <div className="capitalize">{row.getValue("status")}</div>
    ),
  },
  {
    accessorKey: "email",
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
        >
          Email
          <CaretSortIcon className="ml-2 h-4 w-4" />
        </Button>
      );
    },
    cell: ({ row }) => <div className="lowercase">{row.getValue("email")}</div>,
  },
  {
    id: "actions",
    enableHiding: false,
    cell: ({ row }) => {
      const payment = row.original;

      return (
        <Button
          variant="destructive"
          /**
           * @description - I want to call this `handleDelete` function to the delete button press below
           */
          // onClick={() => handleDelete(payment.id)}
        >
          Delete
        </Button>
      );
    },
  },
];