@adaptabletools/adaptable 23.0.4-canary.0 → 23.0.5-canary.0

package/src/View/Components/ColumnFilter/components/FloatingFilterValues.js

@@ -31,7 +31,6 @@ export function useDistinctFilterColumnValues(options) {
     const [isDistinctColumnValuesLoading, setIsDistinctColumnValuesLoading] = React.useState(false);
     useEffect(() => {
         if (valuesLoadTrigger === 0) {
-            // skip the first render
             return;
         }
         let ignore = false;
@@ -81,15 +80,8 @@ export function useDistinctFilterColumnValues(options) {
         triggerValuesLoad,
     };
 }
-/**
- * This component was ported and modified to not know about colum  filter and predicates.
- * It should be further refactored to be easily ported;
- */
 export const FloatingFilterValues = (props) => {
     const { api } = useAdaptable();
-    // const evaluateInPredicateUsingTime = useAdaptableOptions(
-    //   (options) => options.predicateOptions.evaluateInPredicateUsingTime
-    // );
     const currentColumn = api.columnApi.getColumnWithColumnId(props.columnId);
     const searchValueRef = React.useRef('');
     const { isDistinctColumnValuesLoading, quickFilterValues, triggerValuesLoad } = useDistinctFilterColumnValues({
@@ -98,20 +90,14 @@ export const FloatingFilterValues = (props) => {
     });
     const valueRef = React.useRef(props.value);
     useEffect(() => {
-        // we used to load values initially on mount, without any condition
         const value = valueRef.current;
-        // but we now optimize it - if there are no values to show (for which we would need a label)
-        // then we skip it altogether, so we'll only load onMenuOpen
         if (!value || !Array.isArray(value) || value.length === 0) {
             return;
         }
-        // see 😅 usePreviousValuesProbablyBecauseOfAGGridUnnecessaryFilterRemountRef 😅
         const filterHandler = api.filterApi.columnFilterApi.internalApi.getAdaptableFilterHandler(props.columnId);
         const usePrevious = filterHandler && typeof filterHandler.getLastCachedFilterDisplayValues === 'function'
             ? !!filterHandler.getLastCachedFilterDisplayValues()
             : false;
-        // however, if the `value` prop is a non-empty array, we need to load the values
-        // so we know which labels to show
         triggerValuesLoad({
             usePrevious,
         });
@@ -119,14 +105,8 @@ export const FloatingFilterValues = (props) => {
     const quickFilterValuesRef = React.useRef(quickFilterValues);
     quickFilterValuesRef.current = quickFilterValues;
     useEffect(() => {
-        // since we did the optimization above,
-        // we now hit a scenario where the value is set via an API method
-        // so we also need to account for that - so whenever props.value changes, we need to check
-        // and if we previously didn't have a valid array
-        // and now we do, we need to load the values - if they are not already loaded
         if (quickFilterValuesRef.current.values.length > 0 ||
             quickFilterValuesRef.current.dataLoadIsComplete) {
-            // values have already been loaded, so we can skip
             return;
         }
         const currentValue = props.value;

package/src/View/Components/ColumnFilter/useAdaptableFilterWrapper.js

@@ -14,7 +14,6 @@ export const useAdaptableFilterWrapper = (columnId, filterComponent, handleOnCha
     const column = api.columnApi.getColumnWithColumnId(columnId);
     const columnFilterOptions = api.optionsApi.getFilterOptions().columnFilterOptions;
     const qlPredicateDefs = React.useMemo(() => {
-        // this is NOT the ideal place to do this, but it is what it is: autoGroupCol should NOT have the 'Blanks'/'NonBlanks' predicates
         const predicateDefs = api.filterApi.columnFilterApi
             .getFilterPredicateDefsForColumn(column)
             .filter((predDef) => {
@@ -34,7 +33,6 @@ export const useAdaptableFilterWrapper = (columnId, filterComponent, handleOnCha
         ? mapColumnFilterToQlPredicate(columnFilter, column, qlPredicateDefs, columnFilterOptions, filterComponent, api)
         : null;
     const handleOnChange = (adaptablePredicate, logic = 'AND') => {
-        // make sure we always have the latest columnFiler
         const columnFilter = adaptable.api.filterApi.columnFilterApi.getColumnFilterForColumn(columnId);
         const newFilter = {
             ...columnFilter,
@@ -52,9 +50,6 @@ export const useAdaptableFilterWrapper = (columnId, filterComponent, handleOnCha
         }
     };
     const handleClear = React.useCallback(() => dispatch(LayoutRedux.LayoutColumnFilterClear(columnId)), [columnId]);
-    /**
-     * Converts a QlPredicate to an AdaptablePredicate and dispatches the change.
-     */
     const handlePredicateChange = React.useCallback((newPredicate) => {
         if (!newPredicate) {
             handleClear();

package/src/View/Components/ColumnFilter/utils.js

@@ -1,9 +1,7 @@
 import React from 'react';
 import { isAdaptableIcon } from '../../../components/Icon';
 import { AdaptableIconComponent } from '../AdaptableIconComponent';
-export const mapAdaptablePredicateDefToQlPredicateDef = (adaptablePredicateDef, 
-// used to determine values type
-dataType) => {
+export const mapAdaptablePredicateDefToQlPredicateDef = (adaptablePredicateDef, dataType) => {
     let icon = null;
     if (isAdaptableIcon(adaptablePredicateDef.icon)) {
         icon = React.createElement(AdaptableIconComponent, { icon: adaptablePredicateDef.icon });
@@ -16,11 +14,9 @@ dataType) => {
     });
     if (adaptablePredicateDef.id === 'In' || adaptablePredicateDef.id === 'NotIn') {
         if (['text', 'number', 'date'].includes(dataType)) {
-            // add array type
             inputs.push(`${dataType}[]`);
         }
         if (['text[]', 'number[]'].includes(dataType)) {
-            // add array type
             inputs.push(dataType);
         }
     }
@@ -38,7 +34,7 @@ dataType) => {
 };
 export const mapAdaptablePredicateToQlPredicate = (adaptablePredicate) => {
     return {
-        operator: adaptablePredicate.PredicateId, // make sure all predicates are in qal
+        operator: adaptablePredicate.PredicateId,
         args: adaptablePredicate.Inputs,
     };
 };
@@ -52,7 +48,6 @@ export const qlPredicateToString = (qlPredicate, predicateDefs) => {
     if (typeof qlPredicate === 'object' &&
         'operator' in qlPredicate &&
         (qlPredicate.operator === 'AND' || qlPredicate.operator === 'OR')) {
-        // save to join args because there is no extra nesting
         return qlPredicate.args
             .filter((str) => str)
             .map((arg) => qlPredicateToString(arg, predicateDefs))
@@ -89,7 +84,6 @@ export const mapColumnFilterToQlPredicate = (columnFilter, abColumn, qlPredicate
         args: (columnFilter?.Predicates ?? []).map?.(mapAdaptablePredicateToQlPredicate),
     };
     if (qlPredicate.args.length === 0) {
-        // used when none is defined
         let defaultQlPredicate = null;
         switch (abColumn.dataType) {
             case 'number':
@@ -178,7 +172,6 @@ export const mapColumnFilterToQlPredicate = (columnFilter, abColumn, qlPredicate
                 break;
         }
         if (defaultQlPredicate === null) {
-            // take the firstavailable one
             if (qlPredicateDefs.length > 0) {
                 defaultQlPredicate = { operator: qlPredicateDefs[0].operator, args: [] };
             }

package/src/View/Components/EntityRulesEditor/EntityRulePredicatesEditor/EntityRulePredicateEditor.js

@@ -35,7 +35,6 @@ export const EntityRulePredicateEditor = (props) => {
             });
         }
         else {
-            // no previous predicate, e.g. it was cleared
             newPredicates = [newPredicateDef];
         }
         props.onChange({
@@ -61,7 +60,6 @@ export const EntityRulePredicateEditor = (props) => {
         label: col.label,
         value: col.value,
     }));
-    // use global scope or custom scope
     let predicateColumnId = null;
     if (predicate?.ColumnId && predicate.ColumnId !== '') {
         predicateColumnId = predicate.ColumnId;

package/src/View/Components/EntityRulesEditor/EntityRulePredicatesEditor/EntityRulePredicatesEditor.js

@@ -14,7 +14,6 @@ export const EntityRulePredicatesEditor = (props) => {
     const { api } = useAdaptable();
     const showDocumentationLinks = api.internalApi.isDocumentationLinksDisplayed();
     const columnPredicateEnabled = props.data.Rule.Predicates.some((predicate) => predicate.ColumnId !== undefined);
-    // filter out predicates that are already in use
     const defaultPredicateDefs = props.predicateDefs.filter((predicateDef) => {
         return props.data.Rule?.Predicates?.every((rulePrediate) => rulePrediate.PredicateId !== predicateDef.id);
     });

package/src/View/Components/EntityRulesEditor/index.js

@@ -14,7 +14,6 @@ const QueryTab = (props) => {
     const text = (_jsxs(Flex, { flexDirection: "column", children: [label, " ", _jsx(Box, { className: "twa:text-2", children: "query" })] }));
     return (_jsx(Tabs.Tab, { style: { flex: 1 }, ...tabProps, children: !disabled && props.showRadio ? (_jsx(Radio, { tabIndex: -1, className: "twa:m-0 twa:align-baseline", checked: type === props.value, children: text })) : (text) }));
 };
-// needed here to be considered a child Tab component, inside the Tabs component
 SupportedTabMenuComps.add(QueryTab);
 export const EntityRulesSummary = (props) => {
     const { data } = props;
@@ -25,16 +24,7 @@ export const EntityRulesSummary = (props) => {
         !data?.Rule?.AggregatedBooleanExpression) {
         return _jsx(Box, { className: "twa:text-2", children: "No Rule defined" });
     }
-    return (_jsx(
-        Box,
-        { className: "twa:text-2", children: data.Rule.Predicates ? (_jsx(_Fragment, { children: data.Rule?.Predicates?.map?.((predicate, index) => (
-                // predicate id is not unique
-                (_jsx(
-                    React.Fragment,
-                    { children: props.renderPredicate(predicateApi.predicateToString(predicate)) },
-                    index
-                )))) })) : (_jsx(_Fragment, { children: props.renderQueryExpression(internalApi.getAdaptableQueryExpressionText(data.Rule)) })) }
-    ));
+    return (_jsx(Box, { className: "twa:text-2", children: data.Rule.Predicates ? (_jsx(_Fragment, { children: data.Rule?.Predicates?.map?.((predicate, index) => (_jsx(React.Fragment, { children: props.renderPredicate(predicateApi.predicateToString(predicate)) }, index))) })) : (_jsx(_Fragment, { children: props.renderQueryExpression(internalApi.getAdaptableQueryExpressionText(data.Rule)) })) }));
 };
 const RuleTabTitle = (props) => {
     return props.showRadio ? (_jsx(Radio, { className: "twa:m-0", tabIndex: -1, checked: props.checked, children: props.children })) : (_jsx(_Fragment, { children: "props.children" }));

package/src/View/Components/ExternalRenderer.js

@@ -29,9 +29,7 @@ export const ExternalRenderer = ({ render, frameworkComponent, componentName = '
             }
             else if (frameworkComponent) {
                 onDestroy?.();
-                adaptableApi.internalApi.destroyFrameworkComponent(element, frameworkComponent, 
-                // @ts-ignore
-                componentName);
+                adaptableApi.internalApi.destroyFrameworkComponent(element, frameworkComponent, componentName);
             }
         };
     }, []);

package/src/View/Components/FilterForm/ListBoxFilterForm.js

@@ -12,7 +12,6 @@ import { isEmbeddedColumnFilterLocation } from '../ColumnFilter/columnFilterLoca
 import { useColumnFilterLocation } from '../ColumnFilter/AdaptableColumnFilter';
 import { GridFilterTreeDropdown } from '../../../components/Tree/TreeDropdown';
 const baseClassName = 'ab-ListBoxFilterForm';
-// used for displaying the date values in the input
 function toDateDisplayValue(values) {
     values = values.map((v) => {
         if (!Array.isArray(v)) {
@@ -23,20 +22,6 @@ function toDateDisplayValue(values) {
     return toDisplayValueDefault(values);
 }
 const dateOnChangeParser = (value) => {
-    /**
-     * the value looks like this:
-     * [
-     *  ["2021","2021-01","2021-01-01"],
-     *  ["2024","2024-02","2024-02-15T12:34:00"],
-     * ]
-     */
-    // so first need to transfor the above to this:
-    /**
-     * [
-     *  [2023, 12, 1, 1640668800000],
-     *  [2023, 12, 3, 1738377600000]
-     * ]
-     */
     return value.map((v) => {
         return v[v.length - 1];
     });
@@ -47,7 +32,6 @@ export const ColumnValuesSelect = (props) => {
     const column = props.column;
     let selectedColumnValues = props.value || EMPTY_ARRAY;
     const rawOptionsFromProps = Array.isArray(props.options) ? props.options : EMPTY_ARRAY;
-    // Drop empty entries for all column types; Memoise them because Date cols can leak them when using `customInFilterValues` + `orderedValues`
     const optionsFromProps = useMemo(() => {
         if (rawOptionsFromProps === EMPTY_ARRAY) {
             return rawOptionsFromProps;
@@ -65,20 +49,6 @@ export const ColumnValuesSelect = (props) => {
         return rawOptionsFromProps.filter((option) => !StringExtensions.IsNullOrEmpty(option?.value));
     }, [rawOptionsFromProps]);
     const value = [];
-    // For `customInFilterValues` + `orderedValues` on a date column, the
-    // options arrive with raw `Date` objects as `value`. `GridFilterTreeDropdown`
-    // round-trips path keys via `JSON.stringify`/`JSON.parse`, which converts
-    // `Date` -> ISO string. The stored selection paths therefore become
-    // strings while the option/treePath values are still `Date` references —
-    // and `TreeSelectionState`'s internal DeepMap uses strict reference
-    // equality, so a clicked item never matches its tree path on the next
-    // render (no checkbox, click looks like a no-op).
-    //
-    // Normalise `Date` option values to ISO strings up front so every layer
-    // (treePaths, items, selectionMap, value, onChange output) speaks the
-    // same primitive. Tree-shaped date options (the default-values flow) use
-    // string values like "2024" / "2024-01" / "2024-01-01" already and pass
-    // through unchanged.
     const dateOptions = useMemo(() => {
         if (column.dataType !== 'date') {
             return optionsFromProps;
@@ -97,14 +67,6 @@ export const ColumnValuesSelect = (props) => {
         return optionsFromProps.map(convert);
     }, [column.dataType, optionsFromProps]);
     if (column.dataType === 'date') {
-        // we might have a use-case where users might want to get rid of a tree level
-        // because it may contain only one child. currently,
-        // the value is an array of strings that have this form (ISOish)
-        // ["2021-01-01", "2021-10-02", "2021-01-03T12:00:00"]
-        // but we want the full path to each value
-        // but we can't compute that by simply splitting the strings by '-' or 'T',
-        // as if we do that, then we won't support removing a tree level
-        // so we have to compute the paths based on the options
         const valueToPath = useMemo(() => {
             const valueToPath = new Map();
             const withOption = (option, parentPath = []) => {
@@ -119,9 +81,6 @@ export const ColumnValuesSelect = (props) => {
         }, [dateOptions]);
         selectedColumnValues = selectedColumnValues
             .map((v) => {
-            // Saved selections may be raw `Date` objects from older
-            // `orderedValues` snapshots; coerce to the same ISO string we use
-            // for option keys so the lookup still hits.
             const key = v instanceof Date ? v.toISOString() : v;
             return valueToPath.get(key);
         })
@@ -131,7 +90,6 @@ export const ColumnValuesSelect = (props) => {
         ? dateOptions
         : optionsFromProps.filter((distinctValue) => {
             let isActive = selectedColumnValues.indexOf(distinctValue.value) >= 0;
-            // special case for date objects, need to check against string values
             if (!isActive && distinctValue.value && distinctValue.value instanceof Date) {
                 isActive = selectedColumnValues.some((dateStr) => isEqual(parseDateValue(dateStr), parseDateValue(distinctValue.value)));
             }
@@ -159,23 +117,14 @@ export const ColumnValuesSelect = (props) => {
         : undefined;
     const component = column.dataType === 'date' || column.columnId === AG_GRID_GROUPED_COLUMN ? (_jsx(GridFilterTreeDropdown, { toDisplayValue: treeDropdownToDisplayValue, resizable: true, onValueChange: column.dataType === 'date'
             ? (value) => props.onChange(dateOnChangeParser(value))
-            : props.onChange, items: options, 
-        // for dates, the treeDateOptions have ids that are numbers
-        // so we have to add the `toDateValue` function to convert the values to the correct format
-        value: selectedColumnValues, "data-name": "Select Values", primaryKey: 'value', isLoading: props.isLoading, onOpenChange: onOpenChange, showClear: isEmbeddedColumnFilterLocation(location) })) : (_jsx(GridFilterCombobox, { disabled: props.disabled, ...selectProps, onOpenChange: onOpenChange, items: options, value: value, isLoading: props.isLoading, onValueChange: props.onChange, showClear: isEmbeddedColumnFilterLocation(location) }, "select"));
+            : props.onChange, items: options, value: selectedColumnValues, "data-name": "Select Values", primaryKey: 'value', isLoading: props.isLoading, onOpenChange: onOpenChange, showClear: isEmbeddedColumnFilterLocation(location) })) : (_jsx(GridFilterCombobox, { disabled: props.disabled, ...selectProps, onOpenChange: onOpenChange, items: options, value: value, isLoading: props.isLoading, onValueChange: props.onChange, showClear: isEmbeddedColumnFilterLocation(location) }, "select"));
     return (_jsx("div", { className: join(baseClassName, 'twa:relative', props.isLoading && `${baseClassName}--loading`, !value.length && `${baseClassName}--empty`), onKeyDownCapture: (e) => {
             if (e.key === 'Tab') {
-                // Prevent AG Grid from hijacking Tab; keep browser default focus navigation.
                 e.stopPropagation();
                 return;
             }
             const event = e.nativeEvent || e;
             event.stopPropagation = () => {
-                // see #ensure-keyboard-navigation-works-in-column-values-filter
-                // we want to prevent ag grid from stopping the propagation of the event
-                // so that the event can be handled by the select component and thus makes keyboard navigation work
-                //
-                // the solution is to reassign the stopPropagation method to a function that does nothing
             };
         }, children: component }));
 };

package/src/View/Components/ModuleValueSelector/index.js

@@ -28,8 +28,6 @@ export const ModuleValueSelector = (props) => {
         return ArrayExtensions.sortArrayWithOrder(options, value, { sortUnorderedItems: true });
     }, [allowReorder, options, value]);
     const moduleFilter = useCallback((module, searchText) => {
-        // the module name is camelCased so I want to split it
-        // so we can also use spaces in the search text
         const parts = module.split(/(?=[A-Z])/);
         const withSpaces = parts.join(' ');
         return (module.toLowerCase().includes(searchText.toLowerCase()) ||

package/src/View/Components/Panels/PanelWithImage.js

@@ -5,9 +5,6 @@ import { allIcons } from '../../../components/icons';
 import { ButtonInfo } from '../Buttons/ButtonInfo';
 import { twMerge } from '../../../twMerge';
 import { Box, Flex } from '../../../components/Flex';
-//We cannot destructure this.props using the react way in typescript which is a real pain as you
-//need to transfer props individually as a consequence
-//let { buttonContent, ...other } = this.props
 class PanelWithImageCmp extends React.Component {
     render() {
         const IconCmp = allIcons[(this.props.icon || this.props.glyphicon)];
@@ -16,8 +13,7 @@ class PanelWithImageCmp extends React.Component {
             headerStyle.color = this.props.headerColor;
             headerStyle.fill = this.props.headerColor;
         }
-        let headerRow = (_jsx(Flex, { className: "twa:flex-1", children: _jsxs(Flex, { alignItems: "center", children: [_jsxs(Flex, { className: "twa:min-h-[15px]", alignItems: "center", style: headerStyle, children: [IconCmp ? _jsx(IconCmp, {}) : null, _jsx(Box, { className: "twa:mr-2" }), this.props.header ?? '', _jsx(Box, { className: "twa:mr-2", "data-name": "space-after" }), this.props.infoLink != null && !this.props.infoLinkDisabled && (_jsx(ButtonInfo, { onClick: () => window.open(this.props.infoLink, '_blank' // <- opens the link in a new tab or window.
-                                ) }))] }), _jsx(Flex, { className: "twa:flex-1" }), this.props.button && React.cloneElement(this.props.button)] }) }));
+        let headerRow = (_jsx(Flex, { className: "twa:flex-1", children: _jsxs(Flex, { alignItems: "center", children: [_jsxs(Flex, { className: "twa:min-h-[15px]", alignItems: "center", style: headerStyle, children: [IconCmp ? _jsx(IconCmp, {}) : null, _jsx(Box, { className: "twa:mr-2" }), this.props.header ?? '', _jsx(Box, { className: "twa:mr-2", "data-name": "space-after" }), this.props.infoLink != null && !this.props.infoLinkDisabled && (_jsx(ButtonInfo, { onClick: () => window.open(this.props.infoLink, '_blank') }))] }), _jsx(Flex, { className: "twa:flex-1" }), this.props.button && React.cloneElement(this.props.button)] }) }));
         return (_jsx(NewPanel, { header: headerRow, variant: this.props.variant, style: this.props.style, bodyScroll: this.props.bodyScroll !== undefined ? this.props.bodyScroll : true, className: twMerge('twa:rounded-none twa:border-none', this.props.className), bodyProps: {
                 ...this.props.bodyProps,
                 className: twMerge('twa:p-0', this.props.bodyProps?.className),

package/src/View/Components/Panels/PanelWithRow.js

@@ -2,9 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import Panel from '../../../components/Panel';
 import { Flex, Box } from '../../../components/Flex';
-// We cannot destructure this.props using the react way in typescript which is a real pain as you
-// need to transfer props individually as a consequence
-// let { buttonContent, ...other } = this.props
 export class PanelWithRow extends React.Component {
     render() {
         const headerItems = this.props.colItems.map((colItem, index) => (_jsx(Box, { className: "twa:font-bold twa:text-3 twa:px-1", style: {

package/src/View/Components/Popups/AdaptablePopup/AdaptablePopup.js

@@ -21,11 +21,6 @@ export const AdaptablePopup = (props) => {
     const isWindowModal = settingsPanelOptions.popupType === 'window';
     const modalContainer = resolveContainerElement(adaptable.adaptableOptions?.containerOptions?.modalContainer, props.api.internalApi.buildBaseContext());
     let friendlyName = null;
-    /**
-     * This means that it is not rendered in the context of Settings Panel
-     * - no topbar
-     * - no navigation
-     */
     let isStandalone = false;
     let moduleViewContent = null;
     let activeItem = null;
@@ -34,7 +29,6 @@ export const AdaptablePopup = (props) => {
     const firstMenuModule = firstMenuItem?.category;
     let componentModule = props.componentModule;
     let componentName = props.componentName;
-    // ts forces to check for General, there is no menu item General
     const useFirstItem = !props.componentName;
     if (useFirstItem &&
         firstMenuModule !== 'General' &&

package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupBody.js

@@ -15,7 +15,6 @@ export const AdaptablePopupBody = (props) => {
                 props.onHide();
             }
         },
-        // show share button if TeamSharing is active & user has edit rights
         teamSharingActivated: props.api.teamSharingApi.isTeamSharingAvailable() &&
             props.api.teamSharingApi.hasTeamSharingFullRights(),
         modalContainer: modalContainer,
@@ -24,7 +23,5 @@ export const AdaptablePopupBody = (props) => {
         moduleInfo,
     };
     const BodyComponent = AdaptableViewFactory?.[props?.componentName ?? moduleInfo.Popup] || AdaptablePopupModuleView;
-    // key is to make sure state is reset between views
-    // most of the views use the `AdaptablePopupModuleView` component
     return _jsx(BodyComponent, { module: props.module, ...moduleProps }, props?.componentName);
 };

package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupModuleView.js

@@ -18,10 +18,6 @@ import Panel from '../../../../components/Panel';
 import { Tabs } from '../../../../components/Tabs';
 import { NewDropdownButton } from '../../../../components/DropdownButton';
 export const AdaptablePopupModuleView = (props) => {
-    /**
-     * This triggers a render for each state change.
-     * NOT sure this is still needed... It is here for historical reasons.
-     */
     const adaptable = useAdaptable();
     const rerender = useRerender();
     useEffect(() => {
@@ -66,8 +62,6 @@ export const AdaptablePopupModuleView = (props) => {
         emptyContent = emptyView;
     }
     const toolTipText = moduleViewProperties.newTooltipText ?? `Create ${moduleInfo.FriendlyName}`;
-    // Some modules do not have new button
-    // e.g. filter
     let newButton = null;
     if (moduleViewProperties?.abObjectTypes?.length) {
         const items = moduleViewProperties?.abObjectTypes.map((abObjectType) => {

package/src/View/Components/Popups/AdaptablePopup/PopupPanel.js

@@ -4,6 +4,5 @@ import { Box, Flex } from '../../../../components/Flex';
 import { cn } from '../../../../lib/utils';
 export const PopupPanel = (props) => {
     const baseClassName = 'ab-Adaptable-Popup__Panel';
-    return (_jsxs(Box, { className: cn('twa:flex-1 twa:flex twa:flex-col twa:gap-3 twa:p-1', props.className, baseClassName, props.scrollable === false ? 'twa:overflow-hidden' : 'twa:overflow-auto'), children: [_jsxs("div", { className: `${baseClassName}__Header twa:flex`, children: [_jsxs(Flex, { alignItems: "center", children: [_jsx(Box, { className: "twa:mr-0", "data-name": "space-before" }), _jsx("div", { className: `${baseClassName}__Header__Title`, children: props.headerText }), _jsx(Box, { className: "twa:mr-2", "data-name": "space-after" }), props.infoLink != null && !props.infoLinkDisabled && (_jsx(ButtonInfo, { tone: "none", variant: "text", iconSize: 24, onClick: () => window.open(props.infoLink, '_blank' // <- opens the link in a new tab or window.
-                                ) }))] }), _jsx(Box, { className: "twa:flex-1" }), props.button] }), _jsx(Box, { className: cn('twa:w-full twa:flex twa:flex-col twa:flex-1 twa:min-h-0', `${baseClassName}__Body`, props.bodyClassName), children: props.children })] }));
+    return (_jsxs(Box, { className: cn('twa:flex-1 twa:flex twa:flex-col twa:gap-3 twa:p-1', props.className, baseClassName, props.scrollable === false ? 'twa:overflow-hidden' : 'twa:overflow-auto'), children: [_jsxs("div", { className: `${baseClassName}__Header twa:flex`, children: [_jsxs(Flex, { alignItems: "center", children: [_jsx(Box, { className: "twa:mr-0", "data-name": "space-before" }), _jsx("div", { className: `${baseClassName}__Header__Title`, children: props.headerText }), _jsx(Box, { className: "twa:mr-2", "data-name": "space-after" }), props.infoLink != null && !props.infoLinkDisabled && (_jsx(ButtonInfo, { tone: "none", variant: "text", iconSize: 24, onClick: () => window.open(props.infoLink, '_blank') }))] }), _jsx(Box, { className: "twa:flex-1" }), props.button] }), _jsx(Box, { className: cn('twa:w-full twa:flex twa:flex-col twa:flex-1 twa:min-h-0', `${baseClassName}__Body`, props.bodyClassName), children: props.children })] }));
 };

package/src/View/Components/Popups/AdaptablePopup/useMenuItems.js

@@ -19,7 +19,6 @@ export const useMenuItems = () => {
         const resolveNavigationItem = (moduleName) => {
             const customSettingsPanel = settingsPanelOptions?.customSettingsPanels?.find?.((panel) => panel.name === moduleName);
             if (customSettingsPanel) {
-                // @ts-ignore custom settings panel menu items are not part of the standard menu name union
                 return {
                     category: 'CustomSettingsPanel',
                     label: customSettingsPanel.name,

package/src/View/Components/Popups/AdaptablePopupAlert.js

@@ -19,7 +19,6 @@ export const AdaptablePopupAlert = (props) => {
         header = `${header}: ${props.adaptableAlert.header}`;
     }
     let glyph = UIHelper.getGlyphByMessageType(messageType);
-    // we still need the defauld
     const defaultForm = React.useMemo(() => {
         return api.alertApi.internalApi.getDefaultAlertNotificationForm();
     }, []);
@@ -51,8 +50,6 @@ export const AdaptablePopupAlert = (props) => {
                             })
                             : msg] }), _jsx(Box, { className: "twa:m-2", children: adaptableForm ? (_jsx(AdaptableFormComponent, { focusFirstButton: props.focusFirstButton, data: formData, formDef: adaptableForm, displayTitle: true, onChange: setFormData, api: api, context: context, onButtonClick: (button) => {
                             props.onClose();
-                            // we want to give the current popup time to close
-                            // and we reopen with a delay in case this button action causes another popup
                             setTimeout(() => {
                                 button.onClick?.(button, context);
                             }, 20);

package/src/View/Components/Popups/AdaptableToaster.js

@@ -3,8 +3,6 @@ import ObjectFactory from '../../../Utilities/ObjectFactory';
 import { AdaptablePopupAlert } from './AdaptablePopupAlert';
 import { toast } from '../../../components/Toastify';
 export const showToast = (props) => {
-    // we're doing this hack and not simply using props.api in order not to have a memory
-    // leak where the api is still kept around in memory by the toaster
     let api = props.api;
     const off = api.eventApi.on('AdaptableDestroy', () => {
         toast.dismiss();

package/src/View/Components/Popups/WindowPopups/WindowPopups.js

@@ -14,14 +14,8 @@ const NoopComponent = () => {
     return _jsx(_Fragment, {});
 };
 export const CUSTOM_WINDOW_FACTORY_ID = 'CUSTOM_WINDOW_FACTORY_ID';
-/**
- * Portals children into a target container element.
- * Monitors the container with a MutationObserver — if the container is removed
- * from the DOM, `onContainerRemoved` is called so callers can clean up React/Redux state.
- */
 const ContainerPortal = ({ container, onContainerRemoved, children }) => {
     React.useEffect(() => {
-        // If the container is already detached, clean up immediately
         if (!document.contains(container)) {
             onContainerRemoved();
             return;
@@ -32,7 +26,6 @@ const ContainerPortal = ({ container, onContainerRemoved, children }) => {
                 observer.disconnect();
             }
         });
-        // Observe the entire document body for subtree removals
         observer.observe(document.body, { childList: true, subtree: true });
         return () => {
             observer.disconnect();
@@ -66,7 +59,6 @@ export const WindowPopups = () => {
                 Component = Component ?? NoopComponent;
                 componentNode = (_jsx(Component, { api: adaptable.api, onDismiss: handleDismiss, popupProps: restPopupProps }));
             }
-            // Transposed View: portal into custom container if configured
             if (windowItem.FactoryId === WINDOW_SHOW_TRANSPOSED_VIEW) {
                 const transposedContainer = resolveContainerElement(adaptable.adaptableOptions?.containerOptions?.transposedViewContainer, adaptable.api.internalApi.buildBaseContext());
                 if (transposedContainer) {