import { DataTableUtils } from "../utilities/datatable/sprymedia-datatable-utils";
import formatterUtils from "../utilities/formatter-utils.js";
import { ntopng_url_manager } from "../services/context/ntopng_globals_services.js";
import NtopUtils from "../utilities/ntop-utils";

const bytesToSizeFormatter = formatterUtils.getFormatter(formatterUtils.types.bytes.id);
const handlerIdAddLink = "page-stats-action-link";
const handlerIdJumpHistorical = "page-stats-action-jump-historical";
const handlerIdJumpLive = "page-stats-action-jump-live";

const top_application = {
    table_value: "interface",
    title: i18n('page_stats.top.top_applications'),
    view: "top_protocols",
    default_sorting_columns: 1,
    default: true,
    columnDefs: [
        { type: "file-size", targets: 1 },
    ],
    columns: [{
        columnName: i18n("actions"), width: '5%', name: 'actions', className: 'text-center', orderable: false, responsivePriority: 0, handlerId: handlerIdJumpHistorical,
        render_if: function (context) { return context.is_history_enabled },
        render: function (data, type, service) {
            let context = this;
            const jump_to_historical = {
                handlerId: handlerIdJumpHistorical,
                onClick: function () {
                    const epoch_begin = ntopng_url_manager.get_url_entry("epoch_begin");
                    const epoch_end = ntopng_url_manager.get_url_entry("epoch_end");
                    let l7_proto = ntopng_url_manager.serialize_param("l7proto", `${service.protocol.id};eq`);
                    let historical_flows_url = `${http_prefix}/lua/pro/db_search.lua?epoch_begin=${epoch_begin}&epoch_end=${epoch_end}&${l7_proto}`;
                    let source_type = context.source_type;
                    let source_array = context.source_array;

                    let params = "";
                    let params_array = source_type.source_def_array.map((source_def, i) => {
                        let source = source_array[i];
                        if (source_def.value == "ifid") {
                            return ntopng_url_manager.serialize_param("ifid", source.value);
                        } else if (source_def.value == "host") {
                            return ntopng_url_manager.serialize_param("ip", `${source.value};eq`);
                        }
                    });
                    params = params_array.join("&");
                    historical_flows_url = `${historical_flows_url}&${params}`;
                    window.open(historical_flows_url);
                }
            };
            const jump_to_live = {
                handlerId: handlerIdJumpLive,
                onClick: function () {
                    let l7_proto = ntopng_url_manager.serialize_param("application", `${service.protocol.id}`);
                    let live_flows_url = `${http_prefix}/lua/flows_stats.lua?${l7_proto}`;
                    let source_type = context.source_type;
                    let source_array = context.source_array;

                    let params = "";
                    let params_array = source_type.source_def_array.map((source_def, i) => {
                        let source = source_array[i];
                        if (source_def.value == "ifid") {
                            return ntopng_url_manager.serialize_param("ifid", source.value);
                        } else if (source_def.value == "host") {
                            live_flows_url = `${http_prefix}/lua/host_details.lua?page=flows&${l7_proto}`
                            return ntopng_url_manager.serialize_param("host", `${source.value}`);
                        }
                    });
                    params = params_array.join("&");
                    live_flows_url = `${live_flows_url}&${params}`;
                    window.open(live_flows_url);
                }
            };
            return DataTableUtils.createActionButtons([
                { class: 'dropdown-item', icon: 'fas fa-search-plus', href: '#', title: i18n('db_explorer.historical_data'), handler: jump_to_historical },
                { class: 'dropdown-item', icon: 'fas fa-stream', href: '#', title: i18n('flows_page.live_flows'), handler: jump_to_live },
            ]);
        }
    }, {
        columnName: i18n("application"), name: 'application', data: 'protocol', handlerId: handlerIdAddLink,
        render: function (data, type, service) {
            let context = this;
            let handler = {
                handlerId: handlerIdAddLink,
                onClick: function () {
                    // console.log(data);
                    // console.log(service);
                    let schema = `top:${service.ts_schema}`;
                    context.add_metric_from_metric_schema(schema, service.ts_query)
                },
            };
            return DataTableUtils.createLinkCallback({ text: data.label, handler });
        },
    }, {
        columnName: i18n("traffic"), name: 'traffic', className: 'text-end', data: 'traffic', orderable: true,
        render: (data) => {
            if (!data)
                return '';
            //return bytesToSizeFormatter(data);
            return NtopUtils.bytesToSize(data)
        },
    }, {
        columnName: i18n("percentage"), name: 'traffic_perc', className: 'text-center', data: 'percentage', orderable: false,
        render: (data) => {
            if (!data)
                return '';

            const percentage = data.toFixed(1);
            return NtopUtils.createProgressBar(percentage)
        }
    }],
};

const top_categories = {
    table_value: "interface",
    title: i18n('page_stats.top.top_categories'),
    view: "top_categories",
    default_sorting_columns: 2,
    columnDefs: [
        { type: "file-size", targets: 1 },
    ],
    columns: [{
        columnName: i18n("actions"), width: '5%', name: 'actions', className: 'text-center', orderable: false, responsivePriority: 0, handlerId: handlerIdJumpHistorical,
        render_if: function (context) { return context.is_history_enabled },
        render: function (data, type, service) {
            let context = this;
            const jump_to_historical = {
                handlerId: handlerIdJumpHistorical,
                onClick: function () {
                    const epoch_begin = ntopng_url_manager.get_url_entry("epoch_begin");
                    const epoch_end = ntopng_url_manager.get_url_entry("epoch_end");
                    let category = ntopng_url_manager.serialize_param("l7cat", `${service.category.id};eq`);
                    let historical_flows_url = `${http_prefix}/lua/pro/db_search.lua?epoch_begin=${epoch_begin}&epoch_end=${epoch_end}&${category}`;
                    let source_type = context.source_type;
                    let source_array = context.source_array;

                    let params = "";
                    let params_array = source_type.source_def_array.map((source_def, i) => {
                        let source = source_array[i];
                        if (source_def.value == "ifid") {
                            return ntopng_url_manager.serialize_param("ifid", source.value);
                        } else if (source_def.value == "host") {
                            return ntopng_url_manager.serialize_param("ip", `${source.value};eq`);
                        }
                    });
                    params = params_array.join("&");
                    historical_flows_url = `${historical_flows_url}&${params}`;
                    // console.log(historical_flows_url);
                    window.open(historical_flows_url);
                }
            };
            const jump_to_live = {
                handlerId: handlerIdJumpLive,
                onClick: function () {
                    let l7_category = ntopng_url_manager.serialize_param("application", `cat_${service.category.id}`);
                    let live_flows_url = `${http_prefix}/lua/flows_stats.lua?${l7_category}`;
                    let source_type = context.source_type;
                    let source_array = context.source_array;

                    let params = "";
                    let params_array = source_type.source_def_array.map((source_def, i) => {
                        let source = source_array[i];
                        if (source_def.value == "ifid") {
                            return ntopng_url_manager.serialize_param("ifid", source.value);
                        } else if (source_def.value == "host") {
                            live_flows_url = `${http_prefix}/lua/host_details.lua?page=flows&${l7_category}`
                            return ntopng_url_manager.serialize_param("host", `${source.value}`);
                        }
                    });
                    params = params_array.join("&");
                    live_flows_url = `${live_flows_url}&${params}`;
                    window.open(live_flows_url);
                }
            };
            return DataTableUtils.createActionButtons([
                { class: 'dropdown-item', icon: 'fas fa-search-plus', href: '#', title: i18n('db_explorer.historical_data'), handler: jump_to_historical },
                { class: 'dropdown-item', icon: 'fas fa-stream', href: '#', title: i18n('flows_page.live_flows'), handler: jump_to_live },
            ]);
        }
    }, {
        columnName: i18n("category"), name: 'category', data: 'category', handlerId: handlerIdAddLink,
        render: function (data, type, service) {
            let context = this;
            let handler = {
                handlerId: handlerIdAddLink,
                onClick: function () {
                    // console.log(data);
                    // console.log(service);
                    let schema = `top:${service.ts_schema}`;
                    context.add_metric_from_metric_schema(schema, service.ts_query)
                },
            };
            return DataTableUtils.createLinkCallback({ text: data.label, handler });
        },
    }, {
        columnName: i18n("traffic"), name: 'traffic', className: 'text-end', data: 'traffic', orderable: true,
        render: (data) => {
            return bytesToSizeFormatter(data);
            //return NtopUtils.bytesToSize(data)
        },
    }, {
        columnName: i18n("percentage"), name: 'traffic_perc', className: 'text-center', data: 'percentage',
        render: (data) => {
            const percentage = data.toFixed(1);
            return NtopUtils.createProgressBar(percentage)
        }
    }],
};

const top_senders = {
    table_value: "interface",
    title: i18n('page_stats.top.top_senders'),
    view: "top_senders",
    default_sorting_columns: 1,
    columnDefs: [
        { type: "file-size", targets: 1 },
    ],
    columns: [
        {
            columnName: i18n("actions"), width: '5%', name: 'actions', className: 'text-center', orderable: false, responsivePriority: 0, handlerId: handlerIdJumpHistorical,
            render_if: function (context) { return context.is_history_enabled },
            render: function (data, type, service) {
                let context = this;
                const host = service.host.id;
                const host_ts_available = service.host.is_local;
                const jump_to_historical = {
                    handlerId: handlerIdJumpHistorical,
                    onClick: function () {
                        const epoch_begin = ntopng_url_manager.get_url_entry("epoch_begin");
                        const epoch_end = ntopng_url_manager.get_url_entry("epoch_end");
                        let historical_flows_url = `${http_prefix}/lua/pro/db_search.lua?epoch_begin=${epoch_begin}&epoch_end=${epoch_end}`;

                        let params = "";
                        let params_array = [];
                        for (let key in service.tags) {
                            let value = service.tags[key];
                            let p_url = "";
                            if (key == "ifid") {
                                p_url = ntopng_url_manager.serialize_param(key, value);
                            } else if (key == "host") {
                                p_url = ntopng_url_manager.serialize_param("ip", `${value};eq`);
                            }
                            params_array.push(p_url);
                        }
                        params = params_array.join("&");
                        historical_flows_url = `${historical_flows_url}&${params}`;
                        window.open(historical_flows_url);
                    }
                };
                const jump_to_live = {
                    handlerId: handlerIdJumpLive,
                    onClick: function () {
                        let live_flows_url = `${http_prefix}/lua/host_details.lua?page=flows`
                        let params = "";
                        let params_array = [];
                        for (let key in service.tags) {
                            let value = service.tags[key];
                            let p_url = "";
                            if (key == "ifid") {
                                p_url = ntopng_url_manager.serialize_param(key, value);
                            } else if (key == "host") {
                                p_url = ntopng_url_manager.serialize_param("host", `${value}`);
                            }
                            params_array.push(p_url);
                        }
                        params = params_array.join("&");
                        live_flows_url = `${live_flows_url}&${params}`;
                        window.open(live_flows_url);
                    }
                };

                const jump_to_host = {
                    handlerId: handlerIdJumpHistorical,
                    onClick: function () {
                        const ifid = ntopng_url_manager.get_url_entry('ifid');
                        const host_url = `${http_prefix}/lua/host_details.lua?host=${host}&page=historical&ts_query=ifid:${ifid},host:${host}&ts_schema=host:details&epoch_begin=${context.status.epoch_begin}&epoch_end=${context.status.epoch_end}`;

                        window.open(host_url);
                    }
                };
                const is_host_available = (service && service.host) ? service.host.is_available : false;
                const dropdown = [
                    { class: 'dropdown-item', icon: 'fas fa-search-plus', href: '#', title: i18n('db_explorer.historical_data'), handler: jump_to_historical },
                    { class: is_host_available ? 'dropdown-item' : 'dropdown-item disabled', icon: 'fas fa-stream', href: '#', title: i18n('flows_page.live_flows'), handler: jump_to_live },
                ]
                if (context.sources_types_enabled["host"] && host_ts_available) {
                    dropdown.push({ class: 'dropdown-item', icon: 'fas fa-laptop', href: '#', title: i18n('db_explorer.host_data'), handler: jump_to_host })
                }

                return DataTableUtils.createActionButtons(dropdown);
            }
        }, {
            columnName: i18n("page_stats.top.host_name"), name: 'host_name', data: 'host', handlerId: handlerIdAddLink,
            render: function (data, type, service) {
                let context = this;
                let label = data.label;
                let host_ref = '';
                let handler = {
                    handlerId: handlerIdAddLink,
                    onClick: async function () {
                        let schema = `host:traffic`;
                        context.add_ts_group_from_source_value_dict("host", service.tags, schema);
                    },
                };
                if (context.sources_types_enabled["host"] && data.is_local) {
                    label = DataTableUtils.createLinkCallback({ text: data.label, handler });
                }
                if (data.is_available) {
                    host_ref = ` <a href="/lua/host_details.lua?host=${data.id}" data-bs-toggle="tooltip" title=""><i class="fas fa-laptop"></i></a>`
                }

                return `${label}${host_ref}`;
            },
        }, {
            columnName: i18n("page_stats.top.sent"), name: 'sent', className: 'text-end', data: 'traffic', orderable: true,
            render: (data, type) => {
                if (type === 'sort' || type === 'type') {
                    return data
                }
                return bytesToSizeFormatter(data);
            },
        }],
};

const top_receivers = {
    table_value: "interface",
    title: i18n('page_stats.top.top_receivers'),
    view: "top_receivers",
    default_sorting_columns: 1,
    columnDefs: [
        { type: "file-size", targets: 1 },
    ],
    columns: [
        {
            columnName: i18n("actions"), width: '5%', name: 'actions', className: 'text-center', orderable: false, responsivePriority: 0, handlerId: handlerIdJumpHistorical,
            render_if: function (context) { return context.is_history_enabled },
            render: function (data, type, service) {
                let context = this;
                const host = service.host.id;
                const host_ts_available = service.host.is_local;
                const jump_to_historical = {
                    handlerId: handlerIdJumpHistorical,
                    onClick: function () {
                        const epoch_begin = ntopng_url_manager.get_url_entry("epoch_begin");
                        const epoch_end = ntopng_url_manager.get_url_entry("epoch_end");
                        let historical_flows_url = `${http_prefix}/lua/pro/db_search.lua?epoch_begin=${epoch_begin}&epoch_end=${epoch_end}`;

                        let params = "";
                        let params_array = [];
                        for (let key in service.tags) {
                            let value = service.tags[key];
                            let p_url = "";
                            if (key == "ifid") {
                                p_url = ntopng_url_manager.serialize_param(key, value);
                            } else if (key == "host") {
                                p_url = ntopng_url_manager.serialize_param("ip", `${value};eq`);
                            }
                            params_array.push(p_url);
                        }
                        params = params_array.join("&");
                        historical_flows_url = `${historical_flows_url}&${params}`;
                        window.open(historical_flows_url);
                    }
                };
                const jump_to_live = {
                    handlerId: handlerIdJumpLive,
                    onClick: function () {
                        let live_flows_url = `${http_prefix}/lua/host_details.lua?page=flows`
                        let params = "";
                        let params_array = [];
                        for (let key in service.tags) {
                            let value = service.tags[key];
                            let p_url = "";
                            if (key == "ifid") {
                                p_url = ntopng_url_manager.serialize_param(key, value);
                            } else if (key == "host") {
                                p_url = ntopng_url_manager.serialize_param("host", `${value}`);
                            }
                            params_array.push(p_url);
                        }
                        params = params_array.join("&");
                        live_flows_url = `${live_flows_url}&${params}`;
                        window.open(live_flows_url);
                    }
                };

                const jump_to_host = {
                    handlerId: handlerIdJumpHistorical,
                    onClick: function () {
                        const ifid = ntopng_url_manager.get_url_entry('ifid');
                        const host_url = `${http_prefix}/lua/host_details.lua?host=${host}&page=historical&ts_query=ifid:${ifid},host:${host}&ts_schema=host:details&epoch_begin=${context.status.epoch_begin}&epoch_end=${context.status.epoch_end}`;

                        window.open(host_url);
                    }
                };

                const is_host_available = (service && service.host) ? service.host.is_available : false;
                const dropdown = [
                    { class: 'dropdown-item', icon: 'fas fa-search-plus', href: '#', title: i18n('db_explorer.historical_data'), handler: jump_to_historical },
                    { class: is_host_available ? 'dropdown-item' : 'dropdown-item disabled', icon: 'fas fa-stream', href: '#', title: i18n('flows_page.live_flows'), handler: jump_to_live },
                ]
                if (context.sources_types_enabled["host"] && host_ts_available) {
                    dropdown.push({ class: 'dropdown-item', icon: 'fas fa-laptop', href: '#', title: i18n('db_explorer.host_data'), handler: jump_to_host })
                }

                return DataTableUtils.createActionButtons(dropdown);
            },
        }, {
            columnName: i18n("page_stats.top.host_name"), name: 'host_name', data: 'host', handlerId: handlerIdAddLink,
            render: function (data, type, service) {
                let context = this;
                let label = data.label;
                let host_ref = '';
                let handler = {
                    handlerId: handlerIdAddLink,
                    onClick: async function () {
                        let schema = `host:traffic`;
                        context.add_ts_group_from_source_value_dict("host", service.tags, schema);
                    },
                };
                if (context.sources_types_enabled["host"] && data.is_local) {
                    label = DataTableUtils.createLinkCallback({ text: data.label, handler });
                }
                if (data.is_available) {
                    host_ref = ` <a href="/lua/host_details.lua?host=${data.id}" data-bs-toggle="tooltip" title=""><i class="fas fa-laptop"></i></a>`
                }

                return `${label}${host_ref}`;
            },
        }, {
            columnName: i18n("page_stats.top.received"), name: 'received', className: 'text-end', data: 'traffic', orderable: true,
            render: (data, type) => {
                if (type === 'sort' || type === 'type') {
                    return data
                }
                return bytesToSizeFormatter(data);
            },
        }],
};

const interface_top_tables = [top_application, top_categories, top_senders, top_receivers];

export default interface_top_tables;