import React from "react";
import Column from "../../../../components/common/columns";
import Table from "../../../../components/common/Table";
import { Paginated } from "../../../../services/Paginated";
import { Glossary } from "../services/glossaryService";
import equal from 'fast-deep-equal';
import authentication from "../../../frame/services/authenticationService";

export interface GlossaryParams{
    id : number
}

interface GlossariesTableProps{
    data? : Glossary,
    onDelete?: ( keyValue : any ) => void;
    params : GlossaryParams;
}

interface CustomColumn extends Column<customField>{
    isCustom : boolean;
}

interface customField {
    [key: string]: any
}

class GlossariesTable extends React.Component<GlossariesTableProps> {
    findValueById = (data: Glossary, key: string) => {
        if (data.customFieldValues){
            for( const value of data.customFieldValues ){
                if (String(value.id.id) === key)
                {
                    const displayValue : string = value.values[0].displayValue ?? "";

                    return displayValue;
                }
            }
        }

        return undefined;
    }

    state = { columnsList: ([] as CustomColumn[]) }

    columns : CustomColumn[] = [
        { key: "name", label: "Name", order: "asc", link:"/glossaries/{0}", isCustom: false }
    ];

    PaginatedData = () => {
        const { data } = this.props;
        const { columnsList } = this.state;

        const pagedData = data!.children.map( (x) => {
            let dataItem : customField = {
                id: x.id,
                name : x.name }

            for( const column of columnsList) {
                if (column.isCustom){
                    dataItem[column.key] = this.findValueById(x, column.key);
                }
            }

            return dataItem;
        } )

        let paginated : Paginated<customField> = {
            count : 1,
            page: 1,
            pageSize: 1,
            totalPages: 1,
            data : pagedData
        }
        
        return paginated;
    }

    componentDidMount = () => {
        this.CompileColumns();
    }

    componentDidUpdate(prevProps: Readonly<GlossariesTableProps>, prevState: Readonly<{}>, snapshot?: any): void {
        if(!equal(this.props.data, prevProps.data))
            this.CompileColumns();
    }

    CompileColumns = () => {
        const { data } = this.props;

        let columnsList = [...this.columns];

        if (data?.childCustomFieldDefinition)
        {
            for( const customfield of data?.childCustomFieldDefinition)
            {
                columnsList.push({
                    key: String(customfield.id), 
                    label: customfield.name, 
                    order: "asc", 
                    isCustom: true
                })
            }
        }

        this.setState({columnsList});
    }

    handleAuditParams = (item: any) => {
        return {
            entityName : "e_suite.Database.Core.Tables.Glossaries.Glossary",
            primaryKey : "{\"Id\":"+item.id+"}"
            }
    }

    render() { 
        const { onDelete } = this.props;
        const { columnsList } = this.state;
        const editPath = authentication.hasAccess("EditGlossary") ? "/glossaries/edit/{0}" : undefined;
        const doDelete = authentication.hasAccess("DeleteGlossary") ? onDelete : undefined;
        const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;

        const paginated = this.PaginatedData();
        return <Table data={paginated} keyName="id" columns={columnsList} editPath={editPath} onDelete={doDelete} onAuditParams={showAudit}/>;
    }
}
 
export default GlossariesTable;