initial implementation

ui/components-react/src/components-react/properties/renderers/value/Common.ts

@@ -0,0 +1,20 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import type { PrimitiveValue, PropertyRecord } from "@itwin/appui-abstract";
+import { TypeConverterManager } from "../../../converters/TypeConverterManager";
+
+/** @internal */
+export function convertRecordToString(
+  record: PropertyRecord
+): string | Promise<string> {
+  const primitive = record.value as PrimitiveValue;
+  return (
+    primitive.displayValue ||
+    TypeConverterManager.getConverter(
+      record.property.typename,
+      record.property.converter?.name
+    ).convertPropertyToString(record.property, primitive.value)
+  );
+}

ui/components-react/src/components-react/properties/renderers/value/DoublePropertyValueRenderer.tsx

@@ -7,14 +7,14 @@
  */
 
 import * as React from "react";
-import type { PrimitiveValue, PropertyRecord } from "@itwin/appui-abstract";
+import type { PropertyRecord } from "@itwin/appui-abstract";
 import { PropertyValueFormat, StandardTypeNames } from "@itwin/appui-abstract";
-import { TypeConverterManager } from "../../../converters/TypeConverterManager";
 import type {
   IPropertyValueRenderer,
   PropertyValueRendererContext,
 } from "../../ValueRendererManager";
 import { PrimitivePropertyValueRendererImpl } from "./PrimitivePropertyValueRenderer";
+import { convertRecordToString } from "./Common";
 
 /** Default Double Property Renderer
  * @public
@@ -42,14 +42,3 @@ export class DoublePropertyValueRenderer implements IPropertyValueRenderer {
     );
   }
 }
-
-function convertRecordToString(
-  record: PropertyRecord
-): string | Promise<string> {
-  const primitive = record.value as PrimitiveValue;
-  if (primitive.displayValue) return primitive.displayValue;
-  return TypeConverterManager.getConverter(
-    record.property.typename,
-    record.property.converter?.name
-  ).convertPropertyToString(record.property, primitive.value);
-}

ui/components-react/src/components-react/properties/renderers/value/MultilineTextPropertyValueRenderer.tsx

@@ -10,16 +10,16 @@
 import * as React from "react";
 import { useLayoutEffect, useRef, useState } from "react";
 import { assert } from "@itwin/core-bentley";
-import type { PrimitiveValue, PropertyRecord } from "@itwin/appui-abstract";
-import { PropertyValueFormat, StandardTypeNames } from "@itwin/appui-abstract";
-import { TypeConverterManager } from "../../../converters/TypeConverterManager";
+import type { PropertyRecord } from "@itwin/appui-abstract";
+import { PropertyValueFormat } from "@itwin/appui-abstract";
 import { UiComponents } from "../../../UiComponents";
 import type {
   IPropertyValueRenderer,
   PropertyValueRendererContext,
 } from "../../ValueRendererManager";
 import { useRenderedStringValue } from "./PrimitivePropertyValueRenderer";
 import classnames from "classnames";
+import { convertRecordToString } from "./Common";
 
 /** @internal */
 export class MultilineTextPropertyValueRenderer
@@ -134,14 +134,3 @@ export const MultilineTextRenderer: React.FC<MultilineTextRendererProps> = (
     </div>
   );
 };
-
-function convertRecordToString(
-  record: PropertyRecord
-): string | Promise<string> {
-  return TypeConverterManager.getConverter(
-    StandardTypeNames.Text
-  ).convertPropertyToString(
-    record.property,
-    (record.value as PrimitiveValue).value
-  );
-}

ui/components-react/src/components-react/properties/renderers/value/NavigationPropertyValueRenderer.tsx

@@ -7,14 +7,14 @@
  */
 
 import * as React from "react";
-import type { PrimitiveValue, PropertyRecord } from "@itwin/appui-abstract";
+import type { PropertyRecord } from "@itwin/appui-abstract";
 import { PropertyValueFormat, StandardTypeNames } from "@itwin/appui-abstract";
-import { TypeConverterManager } from "../../../converters/TypeConverterManager";
 import type {
   IPropertyValueRenderer,
   PropertyValueRendererContext,
 } from "../../ValueRendererManager";
 import { PrimitivePropertyValueRendererImpl } from "./PrimitivePropertyValueRenderer";
+import { convertRecordToString } from "./Common";
 
 /** Default Navigation Property Renderer
  * @public
@@ -42,14 +42,3 @@ export class NavigationPropertyValueRenderer implements IPropertyValueRenderer {
     );
   }
 }
-
-function convertRecordToString(
-  record: PropertyRecord
-): string | Promise<string> {
-  const primitive = record.value as PrimitiveValue;
-  if (primitive.displayValue) return primitive.displayValue;
-  return TypeConverterManager.getConverter(
-    record.property.typename,
-    record.property.converter?.name
-  ).convertPropertyToString(record.property, primitive.value);
-}

ui/components-react/src/test/TestUtils.ts

@@ -158,10 +158,11 @@ export class TestUtils {
     return property;
   }
 
-  public static createMultilineTextPropertyRecord(name: string, value: string) {
-    const record = TestUtils.createPrimitiveStringProperty(name, value);
-    record.property.renderer = { name: "multiline" };
-    return record;
+  public static createMultilineTextPropertyRecord(
+    propertyRecord: PropertyRecord
+  ) {
+    propertyRecord.property.renderer = { name: "multiline" };
+    return propertyRecord;
   }
 
   public static createArrayProperty(

ui/components-react/src/test/properties/renderers/MultilineTextPropertyValueRenderer.test.tsx

@@ -11,15 +11,15 @@ import {
   MultilineTextRenderer,
 } from "../../../components-react/properties/renderers/value/MultilineTextPropertyValueRenderer";
 import TestUtils, { styleMatch } from "../../TestUtils";
+import { Id64 } from "@itwin/core-bentley";
 
 describe("MultilineTextPropertyValueRenderer", () => {
   const renderer = new MultilineTextPropertyValueRenderer();
 
   describe("canRender", () => {
     it("can render when record is value primitive and renderer name is multiline", () => {
       const record = TestUtils.createMultilineTextPropertyRecord(
-        "test",
-        "test"
+        TestUtils.createPrimitiveStringProperty("test", "test")
       );
       expect(renderer.canRender(record)).to.be.true;
     });
@@ -31,14 +31,40 @@ describe("MultilineTextPropertyValueRenderer", () => {
   });
 
   describe("render", () => {
-    const record = TestUtils.createMultilineTextPropertyRecord("test", "test");
-
-    it("renders property record", () => {
-      const { getByText } = render(<>{renderer.render(record)}</>);
-      expect(getByText("test")).to.be.not.null;
+    [
+      {
+        propertyRecord: TestUtils.createNavigationProperty(
+          "test",
+          {
+            className: "",
+            id: Id64.fromUint32Pair(1, 0),
+          },
+          "test"
+        ),
+        expectedValue: "test",
+      },
+      {
+        propertyRecord: TestUtils.createPrimitiveDoubleProperty("test", 0),
+        expectedValue: "0",
+      },
+      {
+        propertyRecord: TestUtils.createPrimitiveStringProperty("test", "test"),
+        expectedValue: "test",
+      },
+    ].forEach(({ propertyRecord, expectedValue }) => {
+      const record =
+        TestUtils.createMultilineTextPropertyRecord(propertyRecord);
+
+      it("renders property records", () => {
+        const { getByText } = render(<>{renderer.render(record)}</>);
+        expect(getByText(expectedValue)).to.be.not.null;
+      });
     });
 
     it("forwards context to props", () => {
+      const record = TestUtils.createMultilineTextPropertyRecord(
+        TestUtils.createPrimitiveStringProperty("test", "test")
+      );
       render(<>{renderer.render(record, { style: { color: "red" } })}</>);
       expect(screen.getByTitle("test")).to.satisfy(
         styleMatch({ color: "red" })

ui/components-react/src/test/propertygrid/component/VirtualizedPropertyGridWithDataProvider.test.tsx

@@ -748,8 +748,7 @@ describe("VirtualizedPropertyGridWithDataProvider", () => {
           records: {
             [rootCategory.name]: [
               TestUtils.createMultilineTextPropertyRecord(
-                "testProperty",
-                "Test"
+                TestUtils.createPrimitiveStringProperty("testProperty", "test")
               ),
             ],
           },