revenue-fe/src/pages/members/manage-members/Columns.tsx

import { KeenIcon } from '@/components';
import { Button } from '@/components/ui/button';
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuTrigger
} from '@/components/ui/dropdown-menu';
import { ColumnDef } from '@tanstack/react-table';
import { ArrowUpDown, MoreHorizontal } from 'lucide-react';

export type Members = {
  // id: number;
  username: number;
  fullname: string;
  group: string;
  email: string;
  created_at: Date;
};

export const getColumns = (handleUpdate: (data: any) => void): ColumnDef<Members>[] => [
  {
    accessorKey: 'no',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          No
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'username',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Username
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'name',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Fullname
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'msisdn',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Phone Number
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'group_name',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Group
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'email',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Email
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    }
  },
  {
    accessorKey: 'created_at',
    header: ({ column }) => {
      return (
        <Button
          variant="ghost"
          onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
        >
          Created Date
          <ArrowUpDown className="ml-2 h-4 w-4" />
        </Button>
      );
    },
    cell: ({ row }) => new Date(row.original.created_at).toLocaleDateString()
  },
  {
    id: 'actions',
    cell: ({ row }) => {
      const dataMembers = row.original;

      return (
        <button
          className="btn btn-sm btn-icon btn-clear btn-light"
          onClick={() => handleUpdate(dataMembers)}
        >
          <KeenIcon icon="notepad-edit" />
        </button>
      );
    }
  }
];

export const initialMember = {
  id: '',
  fullname: '',
  email: '',
  username: '',
  msisdn: '',
  password: '',
  pin: '',
  try_pin: '',
  mother_fullname: '',
  agent_name: '',
  bank_name: '',
  bank_account: '',
  ibank_number: '',
  address: '',
  longitude: '',
  latitude: '',
  nationality: '',
  photouser: '',
  photomerchant: '',
  file_selfie: '',
  file_document_id: '',
  file_document_id_selfie: '',
  file_commercial_license: '',
  identity_type: '',
  identity_number: '',
  license_number: '',
  date_birth: '',
  gender: '',
  status: 'N',
  isneedapproval: '',
  isapproved: '',
  approveddate: '',
  approvedby: '',
  created_by: '',
  created_at: '',
  updated_by: '',
  updated_at: '',
  deleted_by: '',
  deleted_at: '',
  group: '',
  point_tier: '',
  language: '',
  municipio: '',
  posto_adms: '',
  suco: '',
  aldeia: '',
  profession: '',
  approval_description_premium: '',
  approval_description_agent: '',
  group_id: ''
};