PropertyGrid: Cannot get persisted user preference showNullValues because 'IModelApp.userPreferences' not defined.

[jutian88]

Describe the bug

hi here! I added PropertyGrid components and initialized the Presentation, but error were reported in the image.

To Reproduce

No response

Expected Behavior

No response

Screenshots

No response

Desktop (please complete the applicable information)

No response

Additional context

No response

### Tasks

[GerardasB]

@grigasp seems like this is logged by @itwin/property-grid-react

[grigasp]

@jutian88,

The property widget, by default, uses IModelAppUserPreferencesStorage, which relies on IModelApp.userPreferences for settings persistence. The latter has to be set when initializing IModelApp, if it's not - IModelAppUserPreferencesStorage emits an error to console whenever you try to save/load a preference.

If you don't care about settings' persistence, you can just supply a no-op implementation of PreferencesStorage when creating the PropertyGridComponent.

If you want settings persistence, you have two options:

1. Supply PreferencesStorage implementation that handles the persistence. You choose where/how the settings are persisted. This would be specific to the property grid component.

2. Leave preferencesStorage option empty (or supply IModelAppUserPreferencesStorage) and supply UserPreferencesAccess as a userPreferences setting when initializing IModelApp. In this case provided UserPreferencesAccess could be shared across multiple iTwin.js components.

[jutian88]

@grigasp Thank you for your reply. I introduced them in order without considering persistence, but prooertyGrid reported the above error and the prooertyGrid component could not be displayed. I hope the component can be displayed. How to implement it in the code? https://www.npmjs.com/package/@itwin/property-grid-react

[grigasp]

... and the prooertyGrid component could not be displayed. I hope the component can be displayed. How to implement it in the code? https://www.npmjs.com/package/@itwin/property-grid-react

Sorry, from your initial comment I didn't realize the component wasn't working. Generally, the component is added to iTwin.js apps using UiItemsProvider - you can see how that's done here.

Please also note that the property grid only shows up when you select some element.

[jutian88]

In fact, I've done this but PropertyGrid doesn't work

[jutian88]

I have also selected some element.

[grigasp]

What you have looks okay. Could you push your code to some public repo where I could have a look at it?

[jutian88]

@grigasp thanks~

https://github.com/jutian88/appui

[grigasp]

Thanks. I didn't realize you were using appui-test-app. The problem is that selection change doesn't get to the property widget.

The property widget uses unified selection system to find out about what's selected. The system comes with @itwin/presentation-frontend package and the components that interact with selection need to hook into it. The property widget uses Presentation library by default and hooks into unified selection automatically. However, none of the appui packages know about Presentation library or unified selection, so the graphics view component doesn't work with the system. To achieve that, you need do use a viewport component like this.

I suggest looking at @itwin/cra-template-web-viewer as a starter app. Adding @aruniverse who, I believe, can consult if needed.

[jutian88]

I will take your suggestion and try to do. @grigasp Best wishes to you

[jutian88]

it works!!

I show the changes in the picture: