import React from 'react';
import axios from 'axios';
import {
    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
    
) => {
    async function callOptionsApi(entityName: string) {
        
        if (!hasPermission(user, 'READ_' + entityName.toUpperCase())) return [];
        
        try {
        const data = await axios(`/${entityName}/autocomplete?limit=100`);
        return data.data;
        } catch (error) {
         console.log(error);
         return [];
        }
    }
    
    const hasUpdatePermission = hasPermission(user, 'UPDATE_REVIEWS')
    const isBusinessOwner = user?.app_role?.name === 'Verified Business Owner';
    
    const columns: any[] = [
        {
            field: 'business',
            headerName: 'Business',
            flex: 1,
            minWidth: 120,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission && !isBusinessOwner,
            sortable: false,
            type: 'singleSelect',
            getOptionValue: (value: any) => value?.id,
            getOptionLabel: (value: any) => value?.label,
            valueOptions: await callOptionsApi('businesses'),
            valueGetter: (params: GridValueGetterParams) =>
                params?.value?.id ?? params?.value,
        },
        {
            field: 'user',
            headerName: 'User',
            flex: 1,
            minWidth: 120,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission && !isBusinessOwner,
            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: 'rating',
            headerName: 'Rating',
            flex: 0.5,
            minWidth: 80,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission && !isBusinessOwner,
            type: 'number',
        },
        {
            field: 'text',
            headerName: 'Review',
            flex: 2,
            minWidth: 200,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission && !isBusinessOwner,
        },
        {
            field: 'response',
            headerName: 'Your Response',
            flex: 2,
            minWidth: 200,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission,
        },
        {
            field: 'status',
            headerName: 'Status',
            flex: 1,
            minWidth: 100,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            editable: hasUpdatePermission && !isBusinessOwner,
        }
    ];

    if (!isBusinessOwner) {
        columns.push(
            {
                field: 'is_verified_job',
                headerName: 'Verified',
                flex: 0.5,
                minWidth: 80,
                filterable: false,
                headerClassName: 'datagrid--header',
                cellClassName: 'datagrid--cell',
                editable: hasUpdatePermission,
                type: 'boolean',
            },
            {
                field: 'moderation_notes',
                headerName: 'Moderation Notes',
                flex: 1,
                minWidth: 120,
                filterable: false,
                headerClassName: 'datagrid--header',
                cellClassName: 'datagrid--cell',
                editable: hasUpdatePermission,
            }
        );
    }

    columns.push(
        {
            field: 'createdAt',
            headerName: 'Date',
            flex: 1,
            minWidth: 150,
            filterable: false,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            type: 'dateTime',
            valueGetter: (params: GridValueGetterParams) =>
                new Date(params.row.createdAt),
        },
        {
            field: 'actions',
            type: 'actions',
            minWidth: 30,
            headerClassName: 'datagrid--header',
            cellClassName: 'datagrid--cell',
            getActions: (params: GridRowParams) => {
               return [
                   <div key={params?.row?.id}>
                      <ListActionsPopover
                      onDelete={onDelete}
                      itemId={params?.row?.id}
                      pathEdit={`/reviews/reviews-edit/?id=${params?.row?.id}`}
                      pathView={`/reviews/reviews-view/?id=${params?.row?.id}`}
                      hasUpdatePermission={hasUpdatePermission}
                    />
                   </div>,
                  ]
            },
        }
    );

    return columns;
};