@adaptabletools/adaptable
Version:
Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
82 lines (81 loc) • 4.83 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { EnumExtensions } from '../../Utilities/Extensions/EnumExtensions';
import { SummaryOperation } from '../../AdaptableState/Common/Enums';
import ArrayExtensions from '../../Utilities/Extensions/ArrayExtensions';
import { cn } from '../../lib/utils';
import { CellSummaryPopover } from './CellSummaryPopover';
import * as GeneralConstants from '../../Utilities/Constants/GeneralConstants';
import { AdaptablePopover } from '../AdaptablePopover';
import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
import { connect } from 'react-redux';
import { Flex } from '../../components/Flex';
import { SingleSelect } from '../../components/NewSelect';
class CellSummaryViewPanelComponent extends React.Component {
cleanupEvent;
constructor(props) {
super(props);
}
componentDidMount() {
let adaptable = this.props.api.internalApi.getAdaptableInstance();
if (adaptable) {
this.cleanupEvent = adaptable._on('CellsSelected', () => {
this.checkSelectedCells();
});
}
this.checkSelectedCells();
}
componentWillUnmount() {
this.cleanupEvent?.();
}
render() {
let operationMenuItems = EnumExtensions.getNames(SummaryOperation).map((summaryOperation, index) => {
return {
label: summaryOperation,
value: summaryOperation,
};
});
const cellSummaryOperationDefinitions = this.props.api.cellSummaryApi.getCustomCellSummaryOperations();
const operationDefinitions = ArrayExtensions.IsNullOrEmpty(cellSummaryOperationDefinitions)
? []
: cellSummaryOperationDefinitions.map((operationDefinition) => {
return {
value: operationDefinition.operationName,
label: operationDefinition.operationName,
};
});
let cellSummaryPopover = _jsx(CellSummaryPopover, { CellSummary: this.props.CellSummary });
let shouldDisable = this.props.accessLevel == GeneralConstants.ACCESS_LEVEL_READ_ONLY ||
this.props.CellSummary == null;
const isToolbar = this.props.viewType === 'Toolbar';
const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
const operationValue = this.getOperationValue() ?? 'N/A';
return (_jsxs(Flex, { className: cn(shouldDisable ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__CellSummary__wrap twa:gap-2 twa:flex-row`, {
'twa:min-w-[215px] twa:max-w-[215px] twa:w-[215px] twa:flex-nowrap': isToolbar,
'twa:flex-1 twa:flex-wrap': !isToolbar,
}), children: [_jsx(Flex, { className: "twa:flex-1", children: _jsx(SingleSelect, { ariaLabel: "Cell Summary Operation Selector", className: `ab-${elementType}__CellSummary__select twa:w-full`, disabled: shouldDisable, items: [...operationMenuItems, ...operationDefinitions], onValueChange: (x) => this.props.onCellSummaryOperationChange(x), value: this.props.CellSummaryOperation }) }), _jsx(Flex, { className: "twa:items-center twa:gap-1", children: _jsxs(_Fragment, { children: [_jsx(Flex, { className: cn(`ab-${elementType}__CellSummary__value twa:min-w-[50px]`, {
'twa:rounded-standard twa:text-info-foreground twa:bg-info twa:text-2': !isToolbar,
'twa:flex-1 twa:text-primary-foreground twa:justify-center': isToolbar,
}), children: operationValue }), _jsx(AdaptablePopover, { popoverMaxWidth: 360, className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur", tooltipText: 'Show Cell Summaries', disabled: !this.props.CellSummary?.Count })] }) })] }));
}
checkSelectedCells() {
this.props.onCreateCellSummary();
}
getOperationValue() {
return this.props.api.cellSummaryApi.getCellSummaryOperationValue(this.props.CellSummaryOperation);
}
}
function mapStateToProps(state, ownProps) {
return {
SelectedCellInfo: state.Internal.SelectedCellInfo,
CellSummaryOperation: state.Internal.CellSummary.CellSummaryOperation,
CellSummary: state.Internal.CellSummary.CellSummaryInfo,
};
}
function mapDispatchToProps(dispatch) {
return {
onCellSummaryOperationChange: (summaryOperation) => dispatch(InternalRedux.CellSummaryChangeOperation(summaryOperation)),
onCreateCellSummary: () => dispatch(InternalRedux.CreateCellSummaryInfo()),
};
}
export let CellSummaryViewPanelControl = connect(mapStateToProps, mapDispatchToProps)(CellSummaryViewPanelComponent);