Polyfill Symbol.dispose and Symbol.asyncDispose (#828)

* Make sure `Symbol.dispose` and `Symbol.asyncDispose` are defined before usage

* Change

* Update comment

* Use example from typescript docs

.changeset/silver-ears-change.md

@@ -0,0 +1,8 @@
+---
+"@itwin/presentation-hierarchies-react": patch
+"@itwin/unified-selection": patch
+"@itwin/presentation-hierarchies": patch
+"@itwin/presentation-components": patch
+---
+
+Polyfill `Symbol.dispose` and `Symbol.asyncDispose` to make sure that code using the upcoming JS recource management API works in all environments.

packages/components/src/presentation-components/common/ContentDataProvider.ts

@@ -6,6 +6,7 @@
  * @module Core
  */
 
+import "./DisposePolyfill.js";
 import { PropertyDescription, PropertyRecord } from "@itwin/appui-abstract";
 import { Logger } from "@itwin/core-bentley";
 import { IModelApp, IModelConnection } from "@itwin/core-frontend";

packages/components/src/presentation-components/common/DisposePolyfill.ts

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Polyfill for upcoming resource management feature: https://github.com/tc39/proposal-explicit-resource-management
+ */
+(Symbol as any).dispose ??= Symbol("Symbol.dispose");
+(Symbol as any).asyncDispose ??= Symbol("Symbol.asyncDispose");

packages/components/src/presentation-components/common/IPresentationDataProvider.ts

@@ -6,6 +6,7 @@
  * @module Core
  */
 
+import "./DisposePolyfill.js";
 import { IModelConnection } from "@itwin/core-frontend";
 
 /**

packages/components/src/presentation-components/common/RulesetRegistrationHelper.ts

@@ -6,6 +6,7 @@
  * @module Core
  */
 
+import "./DisposePolyfill.js";
 import { RegisteredRuleset, Ruleset } from "@itwin/presentation-common";
 import { Presentation } from "@itwin/presentation-frontend";
 

packages/components/src/presentation-components/common/Utils.ts

@@ -6,6 +6,7 @@
  * @module Core
  */
 
+import "../common/DisposePolyfill.js";
 import * as mm from "micro-memoize";
 import { LegacyRef, MutableRefObject, RefCallback, useCallback, useEffect, useState } from "react";
 import { Primitives, PrimitiveValue, PropertyDescription, PropertyRecord, PropertyValueFormat } from "@itwin/appui-abstract";

packages/components/src/presentation-components/properties/inputs/ItemsLoader.tsx

@@ -3,6 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "../../common/DisposePolyfill.js";
+
 /** @internal */
 export const VALUE_BATCH_SIZE = 100;
 

packages/components/src/presentation-components/properties/inputs/UseNavigationPropertyTargetsLoader.ts

@@ -6,6 +6,7 @@
  * @module Internal
  */
 
+import "../../common/DisposePolyfill.js";
 import { useEffect, useMemo, useState } from "react";
 import { EMPTY, from, map, mergeMap, toArray } from "rxjs";
 import { PropertyDescription } from "@itwin/appui-abstract";

packages/components/src/presentation-components/properties/inputs/UseUniquePropertyValuesLoader.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "../../common/DisposePolyfill.js";
 import { useEffect, useMemo, useState } from "react";
 import { from, map, mergeMap, toArray } from "rxjs";
 import { IModelConnection } from "@itwin/core-frontend";

packages/components/src/presentation-components/propertygrid/DataProvider.ts

@@ -6,6 +6,7 @@
  * @module PropertyGrid
  */
 
+import "../common/DisposePolyfill.js";
 import { inPlaceSort } from "fast-sort";
 import { PropertyRecord, PropertyValueFormat as UiPropertyValueFormat } from "@itwin/appui-abstract";
 import { IPropertyDataProvider, PropertyCategory, PropertyData, PropertyDataChangeEvent } from "@itwin/components-react";

packages/components/src/presentation-components/tree/DataProvider.ts

@@ -7,6 +7,7 @@
  * @module Tree
  */
 
+import "../common/DisposePolyfill.js";
 import { DelayLoadedTreeNodeItem, PageOptions, PropertyFilterRuleGroupOperator, TreeNodeItem } from "@itwin/components-react";
 import { Logger } from "@itwin/core-bentley";
 import { IModelConnection } from "@itwin/core-frontend";

packages/components/src/presentation-components/tree/FilteredDataProvider.ts

@@ -4,6 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 /* eslint-disable @typescript-eslint/no-deprecated */
 
+import "../common/DisposePolyfill.js";
 import {
   ActiveMatchInfo,
   DelayLoadedTreeNodeItem,

packages/components/src/presentation-components/tree/controlled/TreeHooks.ts

@@ -7,6 +7,7 @@
  * @module Tree
  */
 
+import "../../common/DisposePolyfill.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Subscription } from "rxjs/internal/Subscription";
 import {

packages/components/src/presentation-components/tree/controlled/UsePresentationTreeState.ts

@@ -7,6 +7,7 @@
  * @module Tree
  */
 
+import "../../common/DisposePolyfill.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   AbstractTreeNodeLoaderWithProvider,

packages/components/src/presentation-components/tree/controlled/UseUnifiedSelection.ts

@@ -7,6 +7,7 @@
  * @module Tree
  */
 
+import "../../common/DisposePolyfill.js";
 import { useCallback } from "react";
 import { Subject, takeUntil, tap } from "rxjs";
 import {

packages/components/src/presentation-components/viewport/ViewportSelectionHandler.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "../common/DisposePolyfill.js";
 import { from, Subject, takeUntil } from "rxjs";
 import { using } from "@itwin/core-bentley";
 import { IModelConnection } from "@itwin/core-frontend";

packages/components/src/presentation-components/viewport/WithUnifiedSelection.tsx

@@ -6,6 +6,7 @@
  * @module Viewport
  */
 
+import "../common/DisposePolyfill.js";
 import { createContext, memo, PropsWithChildren, useContext, useEffect, useState } from "react";
 import { ViewportProps } from "@itwin/imodel-components-react";
 import { getDisplayName } from "../common/Utils.js";

packages/hierarchies-react/src/presentation-hierarchies-react/internal/DisposePolyfill.ts

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Polyfill for upcoming resource management feature: https://github.com/tc39/proposal-explicit-resource-management
+ */
+(Symbol as any).dispose ??= Symbol("Symbol.dispose");
+(Symbol as any).asyncDispose ??= Symbol("Symbol.asyncDispose");

packages/hierarchies-react/src/presentation-hierarchies-react/internal/TreeActions.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import { Draft, enableMapSet, produce } from "immer";
 import { EMPTY, Observable, reduce, Subject, takeUntil } from "rxjs";
 import { GenericInstanceFilter, HierarchyNode, HierarchyProvider } from "@itwin/presentation-hierarchies";

packages/hierarchies-react/src/presentation-hierarchies-react/internal/Utils.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import { HierarchyNode, HierarchyNodeKey } from "@itwin/presentation-hierarchies";
 
 /** @internal */

packages/hierarchies/src/hierarchies/HierarchyProvider.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./internal/DisposePolyfill.js";
 import { filter, first, from, map, mergeMap, of } from "rxjs";
 import { BeEvent } from "@itwin/core-bentley";
 import { GenericInstanceFilter } from "@itwin/core-common";

packages/hierarchies/src/hierarchies/imodel/IModelHierarchyProvider.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "../internal/DisposePolyfill.js";
 import {
   catchError,
   concat,

packages/hierarchies/src/hierarchies/internal/Common.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import naturalCompare from "natural-compare-lite";
 import { ConcatenatedValue } from "@itwin/presentation-shared";
 import { HierarchyNodeKey } from "../HierarchyNodeKey.js";

packages/hierarchies/src/hierarchies/internal/DisposePolyfill.ts

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Polyfill for upcoming resource management feature: https://github.com/tc39/proposal-explicit-resource-management
+ */
+(Symbol as any).dispose ??= Symbol("Symbol.dispose");
+(Symbol as any).asyncDispose ??= Symbol("Symbol.asyncDispose");

packages/unified-selection/src/unified-selection/CachingHiliteSetProvider.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import { from, Observable, shareReplay } from "rxjs";
 import { eachValueFrom } from "rxjs-for-await";
 import { ECClassHierarchyInspector, ECSqlQueryExecutor } from "@itwin/presentation-shared";

packages/unified-selection/src/unified-selection/DisposePolyfill.ts

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Polyfill for upcoming resource management feature: https://github.com/tc39/proposal-explicit-resource-management
+ */
+(Symbol as any).dispose ??= Symbol("Symbol.dispose");
+(Symbol as any).asyncDispose ??= Symbol("Symbol.asyncDispose");

packages/unified-selection/src/unified-selection/EnableUnifiedSelectionSyncWithIModel.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import { EMPTY, firstValueFrom, from, map, merge, Observable, Subject, takeUntil, toArray } from "rxjs";
 import { ECClassHierarchyInspector, ECSqlQueryExecutor } from "@itwin/presentation-shared";
 import { CachingHiliteSetProvider, createCachingHiliteSetProvider } from "./CachingHiliteSetProvider.js";

packages/unified-selection/src/unified-selection/Utils.ts

@@ -3,6 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+import "./DisposePolyfill.js";
 import { bufferCount, concatAll, concatMap, delay, Observable, of } from "rxjs";
 import { createMainThreadReleaseOnTimePassedHandler, ECSqlBinding, ECSqlQueryDef, ECSqlQueryExecutor, ECSqlQueryRow } from "@itwin/presentation-shared";