CardView - fix memory leaks (#30061)

Author: pomahtri

packages/devextreme/js/__internal/grids/grid_core/pager/m_pager.ts

@@ -6,7 +6,7 @@ import Pagination from '@ts/pagination/wrappers/pagination';
 import modules from '../m_modules';
 
 const PAGER_CLASS = 'pager';
-const MAX_PAGES_COUNT = 10;
+export const MAX_PAGES_COUNT = 10;
 
 const getPageIndex = function (dataController) {
   // eslint-disable-next-line radix

packages/devextreme/js/__internal/grids/new/grid_core/core/view.tsx

@@ -7,6 +7,7 @@ import type { ReadonlySignal } from '@preact/signals-core';
 import { effect } from '@preact/signals-core';
 import { infernoRenderer } from '@ts/core/m_inferno_renderer';
 import { BaseInfernoComponent } from '@ts/core/r1/runtime/inferno/base_component';
+import { hasWindow } from '@ts/core/utils/m_window';
 import { type ComponentType } from 'inferno';
 
 export abstract class View<T extends {}> {
@@ -50,24 +51,28 @@ export abstract class View<T extends {}> {
     }
 
     return class InfernoView extends BaseInfernoComponent<{}, State> {
-      private readonly subscription: () => void;
+      private readonly unsubscribe: () => void;
 
       constructor() {
         super();
         const props = view.getProps();
-        this.subscription = effect(() => {
+        this.unsubscribe = effect(() => {
           view.props = props.value;
 
           this.state ??= {
             props: props.value,
           };
 
-          if (this.state.props !== props.value) {
+          if (this.state.props !== props.value && hasWindow()) {
             this.setState({ props: props.value });
           }
         });
       }
 
+      public componentWillUnmount(): void {
+        this.unsubscribe();
+      }
+
       public render(): JSX.Element | undefined {
         const ViewComponent = view.component;
         return <ViewComponent {...this.state!.props}/>;

packages/devextreme/js/__internal/grids/new/grid_core/inferno_wrappers/root_element_updater.tsx

@@ -15,9 +15,8 @@ export class RootElementUpdater extends Component<Properties> {
   private previousAttributes: Record<string, unknown> = {};
 
   public render(): JSX.Element {
-    return <>
-      {this.props.children}
-    </>;
+    // @ts-expect-error
+    return this.props.children;
   }
 
   private updateClasses(element: HTMLDivElement): void {

packages/devextreme/js/__internal/grids/new/grid_core/pager/view.tsx

@@ -1,5 +1,6 @@
 import type { ReadonlySignal, Signal } from '@preact/signals-core';
 import { computed, effect, signal } from '@preact/signals-core';
+import { MAX_PAGES_COUNT } from '@ts/grids/grid_core/pager/m_pager';
 
 import { View } from '../core/view';
 import { DataController } from '../data_controller/index';
@@ -55,13 +56,16 @@ export class PagerView extends View<PagerProps> {
       pageSizeChanged: (value): void => {
         this.dataController.pageSize.value = value;
       },
-      isGridCompatibility: false,
       pageCount: this.dataController.pageCount.value,
       showPageSizeSelector: this.options.oneWay('pager.showPageSizeSelector').value,
       _skipValidation: true,
       tabIndex: 0,
       showInfo: this.options.oneWay('pager.showInfo').value,
       showNavigationButtons: this.options.oneWay('pager.showNavigationButtons').value,
+      label: this.options.oneWay('pager.label').value,
+      pagesNavigatorVisible: this.options.oneWay('pager.visible').value,
+      displayMode: this.options.oneWay('pager.displayMode').value,
+      maxPagesCount: MAX_PAGES_COUNT,
     }));
   }
 }

packages/devextreme/js/__internal/ui/overlay/m_overlay.ts

@@ -777,10 +777,16 @@ class Overlay<
     if (_loopFocus || enabled) {
       eventsEngine.on(domAdapter.getDocument(), eventName, this._proxiedTabTerminatorHandler);
     } else {
-      eventsEngine.off(domAdapter.getDocument(), eventName, this._proxiedTabTerminatorHandler);
+      this._destroyTabTerminator();
     }
   }
 
+  _destroyTabTerminator(): void {
+    // @ts-expect-error ts-error
+    const eventName = addNamespace('keydown', this.NAME);
+    eventsEngine.off(domAdapter.getDocument(), eventName, this._proxiedTabTerminatorHandler);
+  }
+
   _findTabbableBounds(): { first: dxElementWrapper | null; last: dxElementWrapper | null } {
     const $elements = this._$wrapper.find('*');
     const elementsCount = $elements.length - 1;
@@ -1248,7 +1254,6 @@ class Overlay<
     this._toggleViewPortSubscription(false);
     this._toggleSubscriptions(false);
     this._updateZIndexStackPosition(false);
-    this._toggleTabTerminator(false);
 
     this._actions = null;
     this._parentsScrollSubscriptionInfo = null;
@@ -1259,6 +1264,7 @@ class Overlay<
     this.option('visible') && zIndexPool.remove(this._zIndex);
     this._$wrapper.remove();
     this._$content.remove();
+    this._destroyTabTerminator();
   }
 
   _toggleRTLDirection(rtl) {