import React from 'react';

import {useHistory} from 'react-router-dom';

import {getNodeHostLabel, getNodeHostPath} from '../../components/NodeHostWrapper/NodeHostWrapper';
import type {PaginatedTableData} from '../../components/PaginatedTable';
import {PAGINATED_TABLE_IDS, ResizeablePaginatedTable} from '../../components/PaginatedTable';
import {
    NODES_COLUMNS_IDS,
    NODES_COLUMNS_WIDTH_LS_KEY,
} from '../../components/nodesColumns/constants';
import type {NodesColumn} from '../../components/nodesColumns/types';
import {useClusterWithProxy} from '../../store/reducers/cluster/cluster';
import type {NodesFilters} from '../../store/reducers/nodes/types';
import type {PreparedStorageNode} from '../../store/reducers/storage/types';
import type {NodesGroupByField, NodesPeerRole} from '../../types/api/nodes';
import {useHideUnavailableNodes} from '../../utils/hooks/useHideUnavailableNodes';
import {getIllustration} from '../../utils/illustrations';
import {NodesUptimeFilterValues} from '../../utils/nodes';
import {renderPaginatedTableErrorMessage} from '../../utils/renderPaginatedTableErrorMessage';

import {getNodes} from './getNodes';
import i18n from './i18n';
import {getRowClassName} from './shared';

const ROW_HEIGHT_WITH_PDISKS = 51;

interface NodesTableProps {
    path?: string;
    database?: string;
    databaseFullPath?: string;

    searchValue: string;
    withProblems: boolean;
    uptimeFilter: NodesUptimeFilterValues;
    peerRoleFilter?: NodesPeerRole;

    filterGroup?: string;
    filterGroupBy?: NodesGroupByField;

    columns: NodesColumn[];
    scrollContainerRef: React.RefObject<HTMLElement>;

    initialEntitiesCount?: number;

    onDataFetched?: (data: PaginatedTableData<PreparedStorageNode>) => void;
}

export function NodesTable({
    path,
    database,
    databaseFullPath,
    searchValue,
    withProblems,
    uptimeFilter,
    peerRoleFilter,
    filterGroup,
    filterGroupBy,
    columns,
    scrollContainerRef,
    initialEntitiesCount,
    onDataFetched,
}: NodesTableProps) {
    const history = useHistory();
    const {hideUnavailable} = useHideUnavailableNodes();
    const SuccessImage = getIllustration('SuccessOperation');

    const useMetaProxy = useClusterWithProxy();
    const tableFilters: NodesFilters = React.useMemo(() => {
        return {
            path,
            databaseFullPath,
            useMetaProxy,
            database,
            searchValue,
            hideUnavailable,
            withProblems,
            uptimeFilter,
            peerRoleFilter,
            filterGroup,
            filterGroupBy,
        };
    }, [
        hideUnavailable,
        path,
        databaseFullPath,
        useMetaProxy,
        database,
        searchValue,
        withProblems,
        uptimeFilter,
        peerRoleFilter,
        filterGroup,
        filterGroupBy,
    ]);

    const renderEmptyDataMessage = () => {
        if (withProblems || uptimeFilter !== NodesUptimeFilterValues.All) {
            return <SuccessImage width={200} height={200} />;
        }

        return i18n('empty.default');
    };

    return (
        <ResizeablePaginatedTable
            getKeyboardRowKey={(node) => node.NodeId}
            getKeyboardRowLabel={getNodeHostLabel}
            onKeyboardActivate={(node) => {
                const nodePath = getNodeHostPath(node, database);
                if (nodePath) {
                    history.push(nodePath);
                }
            }}
            columnsWidthLSKey={NODES_COLUMNS_WIDTH_LS_KEY}
            scrollContainerRef={scrollContainerRef}
            columns={columns}
            rowHeight={
                columns.some(({name}) => name === NODES_COLUMNS_IDS.PDisks)
                    ? ROW_HEIGHT_WITH_PDISKS
                    : undefined
            }
            fetchData={getNodes}
            initialEntitiesCount={initialEntitiesCount}
            renderErrorMessage={renderPaginatedTableErrorMessage}
            renderEmptyDataMessage={renderEmptyDataMessage}
            getRowClassName={getRowClassName}
            filters={tableFilters}
            tableName={PAGINATED_TABLE_IDS.NODES}
            onDataFetched={onDataFetched}
        />
    );
}