import React from 'react'
import axios from 'axios'
import { GridColDef, GridRowParams, GridValueGetterParams } from '@mui/x-data-grid'
import ListActionsPopover from '../ListActionsPopover'
import { hasPermission } from '../../helpers/userPermissions'

type Params = (id: string) => void

export const loadColumns = async (
  onDelete: Params,
  entityName: string,
  user,
): Promise<GridColDef[]> => {
  async function callOptionsApi(entityName: string) {
    if (!hasPermission(user, 'READ_' + entityName.toUpperCase())) {
      return []
    }

    const { data } = await axios(`/${entityName}/autocomplete?limit=100`)
    return data
  }

  const hasUpdatePermission = hasPermission(user, 'UPDATE_ACCOUNTS')

  return [
    {
      field: 'account_name',
      headerName: 'Buyer account',
      flex: 1.3,
      minWidth: 220,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'account_type',
      headerName: 'Segment',
      flex: 0.8,
      minWidth: 140,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'account_number',
      headerName: 'Account no.',
      flex: 0.9,
      minWidth: 150,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'tax_exempt_number',
      headerName: 'Tax exempt no.',
      flex: 1,
      minWidth: 180,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'is_tax_exempt',
      headerName: 'Tax exempt',
      flex: 0.8,
      minWidth: 140,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
      type: 'boolean',
    },
    {
      field: 'credit_status',
      headerName: 'Credit status',
      flex: 0.9,
      minWidth: 160,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'credit_limit',
      headerName: 'Credit limit',
      flex: 0.9,
      minWidth: 160,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
      type: 'number',
    },
    {
      field: 'default_price_list',
      headerName: 'Default price list',
      flex: 1.2,
      minWidth: 220,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
      sortable: false,
      type: 'singleSelect',
      getOptionValue: (value: any) => value?.id,
      getOptionLabel: (value: any) => value?.label,
      valueOptions: await callOptionsApi('price_lists'),
      valueGetter: (params: GridValueGetterParams) => params?.value?.id ?? params?.value,
    },
    {
      field: 'assigned_sales_rep',
      headerName: 'Sales rep',
      flex: 1,
      minWidth: 190,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
      sortable: false,
      type: 'singleSelect',
      getOptionValue: (value: any) => value?.id,
      getOptionLabel: (value: any) => value?.label,
      valueOptions: await callOptionsApi('users'),
      valueGetter: (params: GridValueGetterParams) => params?.value?.id ?? params?.value,
    },
    {
      field: 'notes',
      headerName: 'Internal notes',
      flex: 1.2,
      minWidth: 220,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
    },
    {
      field: 'is_active',
      headerName: 'Active',
      flex: 0.7,
      minWidth: 110,
      filterable: false,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      editable: hasUpdatePermission,
      type: 'boolean',
    },
    {
      field: 'actions',
      type: 'actions',
      minWidth: 56,
      headerClassName: 'datagrid--header',
      cellClassName: 'datagrid--cell',
      getActions: (params: GridRowParams) => {
        return [
          <div key={params?.row?.id}>
            <ListActionsPopover
              onDelete={onDelete}
              itemId={params?.row?.id}
              pathEdit={`/accounts/accounts-edit/?id=${params?.row?.id}`}
              pathView={`/accounts/accounts-view/?id=${params?.row?.id}`}
              hasUpdatePermission={hasUpdatePermission}
            />
          </div>,
        ]
      },
    },
  ]
}
