import * as React from 'react';
import { useDispatch } from 'react-redux';
import { useAdaptable } from '../AdaptableContext';
import { StatusBarPanel } from '../StatusBar/StatusBarPanel';
import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
import { CellSummaryStatusBarSubPanelPopover } from './CellSummaryStatusBarSubPanelPopover';
export const CellSummaryStatusPanel = () => {
    const adaptable = useAdaptable();
    const dispatch = useDispatch();
    const cellSummaryApi = adaptable.api.cellSummaryApi;
    const module = adaptable.ModuleService.getModuleById(ModuleConstants.CellSummaryModuleId);
    const text = `${cellSummaryApi.getCurrentCellSummaryOperation()}: ${cellSummaryApi.getCurrentCellSummaryOperationValue() ?? 'N/A'}`;
    const onAction = () => {
        adaptable.api.cellSummaryApi.openCellSummaryPopupSettingsPanel();
    };
    React.useEffect(() => {
        let cleanupEvent = () => null;
        const checkSelectedCells = () => {
            dispatch(InternalRedux.CreateCellSummaryInfo());
        };
        if (adaptable) {
            cleanupEvent = adaptable._on('CellsSelected', () => {
                checkSelectedCells();
            });
        }
        checkSelectedCells();
        return () => cleanupEvent?.();
    }, []);
    return (React.createElement(StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, icon: module.moduleInfo.Glyph, onAction: onAction, content: text, popover: CellSummaryStatusBarSubPanelPopover, popoverMinWidth: 360 }));
};
