[components]: Remove content formatting in ContentDataProvider

.changeset/itchy-lemons-cough.md

@@ -0,0 +1,5 @@
+---
+"@itwin/presentation-components": major
+---
+
+Removed values formatting in `ContentDataProvider`. This leaves values formatting up to UI components presenting them.

apps/full-stack-tests/src/components/properties/PropertyEditors.test.tsx

@@ -9,7 +9,6 @@ import {
   insertSpatialCategory,
 } from "presentation-test-utilities";
 import { afterAll, afterEach, beforeAll, describe, expect, it, vi } from "vitest";
-import { PrimitiveValue } from "@itwin/appui-abstract";
 import { EditorContainer, UiComponents } from "@itwin/components-react";
 import { BeEvent } from "@itwin/core-bentley";
 import { IModelApp } from "@itwin/core-frontend";
@@ -102,9 +101,6 @@ describe("Property editors", () => {
     expect(propertyRecord).toBeDefined();
     expect(propertyRecord!.property.kindOfQuantityName).toBe(schema.items.TestKOQ.fullName.replaceAll(".", ":"));
 
-    // ensure the display value is formatted with the overridden format
-    expect((propertyRecord!.value as PrimitiveValue).displayValue).toBe("48.6 in");
-
     // render an editor for the property
     const commitSpy = vi.fn();
     const cancelSpy = vi.fn();

packages/components/api/presentation-components.api.md

@@ -99,7 +99,6 @@ export interface CacheInvalidationProps {
     content?: boolean;
     descriptor?: boolean;
     descriptorConfiguration?: boolean;
-    formatting?: boolean;
     size?: boolean;
 }
 

packages/components/package.json

@@ -65,18 +65,18 @@
     "rxjs": "catalog:rxjs"
   },
   "peerDependencies": {
-    "@itwin/appui-abstract": "^5.10.0",
-    "@itwin/components-react": "^5.32.0",
-    "@itwin/core-bentley": "^5.10.0",
-    "@itwin/core-common": "^5.10.0",
-    "@itwin/core-frontend": "^5.10.0",
-    "@itwin/core-quantity": "^5.10.0",
-    "@itwin/core-react": "^5.32.0",
-    "@itwin/ecschema-metadata": "^5.10.0",
-    "@itwin/imodel-components-react": "^5.32.0",
+    "@itwin/appui-abstract": "^5.11.2",
+    "@itwin/components-react": "^5.33.0",
+    "@itwin/core-bentley": "^5.11.2",
+    "@itwin/core-common": "^5.11.2",
+    "@itwin/core-frontend": "^5.11.2",
+    "@itwin/core-quantity": "^5.11.2",
+    "@itwin/core-react": "^5.33.0",
+    "@itwin/ecschema-metadata": "^5.11.2",
+    "@itwin/imodel-components-react": "^5.33.0",
     "@itwin/itwinui-react": "^3.21.0",
-    "@itwin/presentation-common": "^5.10.0",
-    "@itwin/presentation-frontend": "^5.10.0",
+    "@itwin/presentation-common": "^5.11.2",
+    "@itwin/presentation-frontend": "^5.11.2",
     "@itwin/unified-selection-react": "^1.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"

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

@@ -17,6 +17,7 @@ import {
   PropertyValueFormat as UiPropertyValueFormat,
 } from "@itwin/appui-abstract";
 import { assert } from "@itwin/core-bentley";
+import { KOQ_RENDERER_NAME } from "@itwin/imodel-components-react";
 import {
   combineFieldNames,
   EditorDescription,
@@ -39,6 +40,7 @@ import {
   StartItemProps,
   StartStructProps,
   TypeDescription,
+  Value,
 } from "@itwin/presentation-common";
 import { NavigationEditorName, NumericEditorName, QuantityEditorName } from "../properties/editors/EditorNames.js";
 import {
@@ -116,6 +118,7 @@ export function createPropertyDescriptionFromFieldInfo(info: FieldInfo) {
     // eslint-disable-next-line @typescript-eslint/no-deprecated
     description.quantityType = info.koqName;
     description.editor = { name: QuantityEditorName, ...description.editor };
+    description.renderer = { name: KOQ_RENDERER_NAME, ...description.renderer };
   }
 
   if (info.constraints) {
@@ -312,11 +315,7 @@ export class InternalPropertyRecordsBuilder implements IContentVisitor {
     const propertyField = props.requestedField;
     const rootAppender = this._appendersStack[0];
     assert(IPropertiesAppender.isRoot(rootAppender));
-    const displayValue = rootAppender.item.displayValues[props.mergedField.name] as string | undefined;
-    const value: PrimitiveValue = {
-      valueFormat: UiPropertyValueFormat.Primitive,
-      ...(displayValue?.startsWith("--") ? { displayValue } : {}),
-    };
+    const value: PrimitiveValue = { valueFormat: UiPropertyValueFormat.Primitive };
     const record = new PropertyRecord(
       value,
       createPropertyDescriptionFromFieldInfo(createFieldInfo(propertyField, props.parentFieldName)),
@@ -329,12 +328,15 @@ export class InternalPropertyRecordsBuilder implements IContentVisitor {
 
   public processPrimitiveValue(props: ProcessPrimitiveValueProps): void {
     const appender = this.currentPropertiesAppender;
-    const value: PrimitiveValue = {
-      valueFormat: UiPropertyValueFormat.Primitive,
-      value: props.rawValue,
-      // eslint-disable-next-line @typescript-eslint/no-base-to-string
-      displayValue: props.displayValue?.toString() ?? "",
-    };
+
+    const displayValue =
+      props.field.type.typeName === "navigation" && Value.isNavigationValue(props.rawValue)
+        ? props.rawValue.label.displayValue
+        : undefined;
+    const rawValue = Value.isNavigationValue(props.rawValue)
+      ? { id: props.rawValue.id, className: props.rawValue.className }
+      : props.rawValue;
+    const value: PrimitiveValue = { valueFormat: UiPropertyValueFormat.Primitive, value: rawValue, displayValue };
     const record = new PropertyRecord(
       value,
       createPropertyDescriptionFromFieldInfo({
@@ -345,8 +347,7 @@ export class InternalPropertyRecordsBuilder implements IContentVisitor {
     applyPropertyRecordAttributes(
       record,
       props.field,
-      // eslint-disable-next-line @typescript-eslint/no-base-to-string
-      props.displayValue?.toString(),
+      undefined,
       IPropertiesAppender.isRoot(appender) ? appender.item.extendedData : undefined,
       this._propertyRecordsProcessor,
     );

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

@@ -10,17 +10,15 @@ import "./DisposePolyfill.js";
 
 import { PropertyDescription } from "@itwin/appui-abstract";
 import { Logger } from "@itwin/core-bentley";
-import { IModelApp, IModelConnection } from "@itwin/core-frontend";
+import { IModelConnection } from "@itwin/core-frontend";
 import {
   ClientDiagnosticsOptions,
   Content,
-  createContentFormatter,
   DEFAULT_KEYS_BATCH_SIZE,
   Descriptor,
   DescriptorOverrides,
   Field,
   KeySet,
-  KoqPropertyValueFormatter,
   PageOptions,
   RegisteredRuleset,
   RequestOptionsWithRuleset,
@@ -69,12 +67,6 @@ export interface CacheInvalidationProps {
    * `sortDirection`, `filterExpression` and similar fields.
    */
   content?: boolean;
-
-  /**
-   * Invalidate content formatting. Should be set after changes to active formatting options:
-   * format specs, unit system, etc.
-   */
-  formatting?: boolean;
 }
 /** @public */
 export namespace CacheInvalidationProps {
@@ -170,7 +162,6 @@ export class ContentDataProvider implements IContentDataProvider {
   private _pagingSize?: number;
   private _diagnosticsOptions?: ClientDiagnosticsOptions;
   private _listeners: Array<() => void> = [];
-  private _isContentFormatted = false;
 
   /** Constructor. */
   constructor(props: ContentDataProviderProps) {
@@ -286,11 +277,6 @@ export class ContentDataProvider implements IContentDataProvider {
       this._getContentAndSize.cache.keys.length = 0;
       this._getContentAndSize.cache.values.length = 0;
     }
-    if ((props.formatting || props.content || props.size) && this._getFormattedContentAndSize) {
-      this._getFormattedContentAndSize.cache.keys.length = 0;
-      this._getFormattedContentAndSize.cache.values.length = 0;
-      this._isContentFormatted = false;
-    }
   }
 
   private createRequestOptions(): RequestOptionsWithRuleset<IModelConnection, RulesetVariable> {
@@ -313,11 +299,6 @@ export class ContentDataProvider implements IContentDataProvider {
         .vars(getRulesetId(this._ruleset))
         .onVariableChanged.addListener(this.onRulesetVariableChanged),
     );
-    this._listeners.push(
-      IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.addListener(this.onUnitSystemChanged),
-    );
-    IModelApp.formatsProvider &&
-      this._listeners.push(IModelApp.formatsProvider.onFormatsChanged.addListener(this.onFormatsChanged));
   }
 
   /**
@@ -394,7 +375,7 @@ export class ContentDataProvider implements IContentDataProvider {
         Make sure you set provider's pagingSize to avoid excessive backend requests.`;
       Logger.logWarning(PresentationComponentsLoggerCategory.Content, msg);
     }
-    const contentAndSize = await this._getFormattedContentAndSize(pageOptions);
+    const contentAndSize = await this._getContentAndSize(pageOptions);
     return contentAndSize?.content;
   }
 
@@ -425,15 +406,7 @@ export class ContentDataProvider implements IContentDataProvider {
         descriptor: descriptorOverrides,
         keys: this.keys,
         paging: pageOptions,
-      };
-
-      // we always get formatted content from presentation manager - ensure
-      // we set `_isContentFormatted = true` when we finish getting content, to
-      // avoid formatting it again unnecessarily
-      using _ = {
-        [Symbol.dispose]: () => {
-          this._isContentFormatted = true;
-        },
+        omitFormattedValues: true,
       };
 
       const result = await Presentation.presentation.getContentIterator(options);
@@ -456,24 +429,6 @@ export class ContentDataProvider implements IContentDataProvider {
     { isMatchingKey: areContentRequestsEqual as any },
   );
 
-  private _getFormattedContentAndSize = memoize(
-    async (pageOptions?: PageOptions): Promise<{ content: Content; size: number } | undefined> => {
-      const result = await this._getContentAndSize(pageOptions);
-      if (result && !this._isContentFormatted) {
-        const formatter = createContentFormatter({
-          propertyValueFormatter: new KoqPropertyValueFormatter({
-            schemaContext: this._imodel.schemaContext,
-            formatsProvider: IModelApp.formatsProvider,
-          }),
-        });
-        result.content = await formatter.formatContent(result.content);
-        this._isContentFormatted = true;
-      }
-      return result;
-    },
-    { isMatchingKey: areContentRequestsEqual as any },
-  );
-
   private onContentUpdate() {
     // note: subclasses are expected to override `invalidateCache` and notify components about
     // the changed content so components know to reload
@@ -495,14 +450,6 @@ export class ContentDataProvider implements IContentDataProvider {
   private onRulesetVariableChanged = () => {
     this.onContentUpdate();
   };
-
-  private onUnitSystemChanged = () => {
-    this.invalidateCache({ formatting: true });
-  };
-
-  private onFormatsChanged = () => {
-    this.invalidateCache({ formatting: true });
-  };
 }
 
 function areContentRequestsEqual(lhsArgs: [PageOptions?], rhsArgs: [PageOptions?]): boolean {

packages/components/src/test/common/ContentBuilder.test.ts

@@ -12,7 +12,12 @@ import {
   StructValue,
   PropertyValueFormat as UiPropertyValueFormat,
 } from "@itwin/appui-abstract";
-import { createContentTraverser, EnumerationInfo, PropertyValueFormat } from "@itwin/presentation-common";
+import {
+  createContentTraverser,
+  EnumerationInfo,
+  LabelDefinition,
+  PropertyValueFormat,
+} from "@itwin/presentation-common";
 import { PropertyValueConstraints, WithConstraints } from "../../presentation-components/common/ContentBuilder.js";
 import { PropertyRecordsBuilder } from "../../presentation-components/common/PropertyRecordsBuilder.js";
 import {
@@ -311,36 +316,33 @@ describe("PropertyRecordsBuilder", () => {
     expect(builder.entries[0].value).toEqual({ valueFormat: UiPropertyValueFormat.Primitive });
   });
 
-  it("creates merged property record with quantity editor when field has kind of quantity", () => {
-    const fieldName = "test-field";
+  it("set navigation property display value", () => {
+    const fieldName = "nav-field";
     const descriptor = createTestContentDescriptor({
       fields: [
-        createTestPropertiesContentField({
+        createTestSimpleContentField({
           name: fieldName,
-          properties: [
-            {
-              property: {
-                classInfo: createTestECClassInfo(),
-                name: "test-props",
-                type: "double",
-                kindOfQuantity: { label: "Length", name: "testKOQ", persistenceUnit: "m" },
-              },
-            },
-          ],
+          type: { valueFormat: PropertyValueFormat.Primitive, typeName: StandardTypeNames.Navigation },
         }),
       ],
     });
     const item = createTestContentItem({
-      values: {},
-      displayValues: { [fieldName]: "-- m" },
-      mergedFieldNames: [fieldName],
+      values: {
+        [fieldName]: {
+          id: "0x1",
+          className: "TestSchema:TestClass",
+          label: LabelDefinition.fromLabelString("Navigation Prop Label"),
+        },
+      },
+      displayValues: {},
     });
     createContentTraverser(builder)(descriptor, [item]);
     expect(builder.entries).toHaveLength(1);
-    expect(builder.entries[0].isMerged).toBe(true);
-    expect(builder.entries[0].property.editor?.name).toBe(QuantityEditorName);
-    expect(builder.entries[0].property.kindOfQuantityName).toBe("testKOQ");
-    expect(builder.entries[0].value).toEqual({ valueFormat: UiPropertyValueFormat.Primitive, displayValue: "-- m" });
+    expect(builder.entries[0].value).toEqual({
+      valueFormat: UiPropertyValueFormat.Primitive,
+      value: { id: "0x1", className: "TestSchema:TestClass" },
+      displayValue: "Navigation Prop Label",
+    });
   });
 
   it("sorts struct properties", () => {

packages/components/src/test/common/ContentDataProvider.test.ts

@@ -664,16 +664,6 @@ describe("ContentDataProvider", () => {
       onVariableChanged.raiseEvent("var_id", "prev", "curr");
       expect(invalidateCacheSpy).toHaveBeenCalledExactlyOnceWith(CacheInvalidationProps.full());
     });
-
-    it("invalidates cache when active unit system change", async () => {
-      onActiveFormattingUnitSystemChanged.raiseEvent({ system: "metric" });
-      expect(invalidateCacheSpy).toHaveBeenCalledExactlyOnceWith({ formatting: true });
-    });
-
-    it("invalidates cache when formatting settings change", async () => {
-      onFormatsChanged.raiseEvent({ formatsChanged: "all" });
-      expect(invalidateCacheSpy).toHaveBeenCalledExactlyOnceWith({ formatting: true });
-    });
   });
 
   describe("diagnostics", () => {

packages/components/src/test/instance-filter-builder/__snapshots__/Utils.test.ts.snap

@@ -158,6 +158,9 @@ Array [
       "kindOfQuantityName": "Test:KoQ",
       "name": "root#PropertiesField",
       "quantityType": "Test:KoQ",
+      "renderer": Object {
+        "name": "KoqPropertyValueRenderer",
+      },
       "typename": "string",
     },
     "sourceClassId": "0x1",