Add settings page to set UI Settings (#984)

* UI Settings Pages sets colorTheme, autoHideUi, useProximityOpacity, snapWidgetOpacity, dragInteraction, frameworkVersion, widgetOpacity.

* Renamed IModelAppUiSettings to UserSettingStorage

* Added LocalSettingsStorage and deprecated LocalUiSettings

* Added SessionSettingsStorage and deprecate SessionUiSettings

* Added UiSettingsStorage interface and aliased UiSettings to it to maintain compatibility

* Renamed SettingsProvider to SettingsTabsProvider

* Added support for registering classes that implement UserSettingsProvider so they are called when UiSettingStorage is set so they can load their default from the storage location.

* Move AppUiSettings from ui-test-app to ui-framework 

* Renamed QuantityFormatSettingsPanel to QuantityFormatSettingsPage

* updated index.html in ui-test-app to add overflow: hidden to avoid scroll bars during login processing.

* Updated SignIn component to avoid button moving during sign-in processing.

* clean-up Electron sign-in and update index.html to prevent scrollbar during log-in

common/api/summary/ui-core.exports.csv

@@ -155,6 +155,7 @@ public;LoadingSpinner
 public;LoadingSpinnerProps 
 public;LoadingStatus 
 public;LoadingStatusProps 
+public;LocalSettingsStorage 
 beta;LocalUiSettings 
 public;MainTabsProps 
 internal;mergeRefs
@@ -225,14 +226,15 @@ public;SearchBoxProps
 public;Select: (props: SelectProps) => JSX.Element | null
 public;SelectOption
 public;SelectProps 
+public;SessionSettingsStorage 
 beta;SessionUiSettings 
 beta;SettingsContainer: ({ tabs, onSettingsTabSelected, currentSettingsTab, settingsManager, showHeader }: SettingsContainerProps) => JSX.Element
 beta;SettingsContainerProps
 beta;SettingsManager
-beta;SettingsProvider
 beta;SettingsProvidersChangedEvent 
 beta;SettingsProvidersChangedEventArgs
 beta;SettingsTabEntry
+beta;SettingsTabsProvider
 internal;shallowDiffers: (a:
 internal;Size 
 public;SizeProps
@@ -289,10 +291,11 @@ public;TreeNodeProps
 public;TreeProps 
 public;UiCore
 public;UiEvent
-beta;UiSetting
-public;UiSettings
+public;UiSetting
+public;UiSettings = UiSettingsStorage
 public;UiSettingsResult
 public;UiSettingsStatus
+public;UiSettingsStorage
 public;UnderlinedButton(props: UnderlinedButtonProps): JSX.Element
 public;UnderlinedButtonProps
 public;useDisposable

common/api/summary/ui-framework.exports.csv

@@ -37,6 +37,7 @@ public;AnyItemDef = GroupItemDef | CommandItemDef | ToolItemDef | ActionButtonIt
 public;AnyWidgetProps = WidgetProps | ToolWidgetProps | NavigationWidgetProps
 internal;appendWidgets(state: NineZoneState, widgetDefs: ReadonlyArray
 public;AppNotificationManager 
+beta;AppUiSettings 
 beta;areNoFeatureOverridesActive(): boolean
 public;Backstage 
 beta;BackstageActionItem 
@@ -110,7 +111,7 @@ public;ConfigurableUiControlConstructor = new (info: ConfigurableCreateInfo, opt
 public;ConfigurableUiControlType
 public;ConfigurableUiElement
 public;ConfigurableUiManager
-public;ConfigurableUiReducer(state: ConfigurableUiState | undefined, _action: ConfigurableUiActionsUnion): ConfigurableUiState
+public;ConfigurableUiReducer(state: ConfigurableUiState | undefined, action: ConfigurableUiActionsUnion): ConfigurableUiState
 public;ConfigurableUiState
 beta;connectIModelConnection: (mapStateToProps?: any, mapDispatchToProps?: any) => import("react-redux").InferableComponentEnhancerWithProps
 beta;connectIModelConnectionAndViewState: (mapStateToProps?: any, mapDispatchToProps?: any) => import("react-redux").InferableComponentEnhancerWithProps
@@ -245,6 +246,7 @@ beta;getQuantityFormatsSettingsManagerEntry(itemPriority: number, opts?: Partial
 beta;getSelectionContextSyncEventIds(): string[]
 internal;getStableWidgetProps(widgetProps: WidgetProps, stableId: string): WidgetProps
 internal;getStagePanelType: (location: StagePanelLocation_2) => StagePanelType
+beta;getUiSettingsManagerEntry(itemPriority: number, allowSettingUiFrameworkVersion?: boolean): SettingsTabEntry
 internal;getWidgetId(side: PanelSide, key: StagePanelZoneDefKeys): WidgetIdTypes
 public;GroupButton(props: GroupButtonProps): JSX.Element
 internal;GroupButtonItem(props: GroupButtonProps_2): JSX.Element
@@ -274,6 +276,7 @@ beta;IModelViewportControl
 beta;IModelViewportControlOptions
 internal;INACTIVITY_TIME_DEFAULT = 3500
 beta;Indicator 
+beta;InitialAppUiSettings
 internal;initializeNineZoneState(frontstageDef: FrontstageDef): NineZoneState
 internal;initializePanel(nineZone: NineZoneState, frontstageDef: FrontstageDef, panelSide: PanelSide): NineZoneState
 alpha;InputEditorCommitHandler
@@ -416,7 +419,7 @@ internal;ProjectScope
 internal;ProjectServices
 public;PromptField: import("react-redux").ConnectedComponent
 public;PropsHelper
-beta;QuantityFormatSettingsPanel({ initialQuantityType, availableUnitSystems }: QuantityFormatterSettingsOptions): JSX.Element
+beta;QuantityFormatSettingsPage({ initialQuantityType, availableUnitSystems }: QuantityFormatterSettingsOptions): JSX.Element
 beta;QuantityFormatterSettingsOptions
 alpha;ReactContent
 public;ReactMessage = ReactMessage_2
@@ -600,9 +603,11 @@ public;UiFramework
 internal;UiIntervalEvent 
 internal;UiIntervalEventArgs
 internal;UiSettingsContext: React.Context
-alpha;UiSettingsProvider(props: UiSettingsProviderProps): JSX.Element
-alpha;UiSettingsProviderProps
+beta;UiSettingsPage({ allowSettingUiFrameworkVersion }:
+beta;UiSettingsProvider(props: UiSettingsProviderProps): JSX.Element
+beta;UiSettingsProviderProps
 public;UiShowHideManager
+internal;UiShowHideSettingsProvider 
 public;UiVisibilityChangedEvent 
 public;UiVisibilityEventArgs
 internal;useActiveFrontstageDef(): FrontstageDef | undefined
@@ -626,14 +631,16 @@ internal;useNineZoneDispatch(frontstageDef: FrontstageDef): NineZoneDispatch
 internal;useNineZoneState(frontstageDef: FrontstageDef): NineZoneState | undefined
 public;UserProfileBackstageItem 
 public;UserProfileBackstageItemProps 
+beta;UserSettingsProvider
+public;UserSettingsStorage 
 internal;useSavedFrontstageState(frontstageDef: FrontstageDef): void
 internal;useSaveFrontstageSettings(frontstageDef: FrontstageDef): void
 internal;useStatusBarEntry(): DockedStatusBarEntryContextArg
 internal;useSyncDefinitions(frontstageDef: FrontstageDef): void
 internal;useToolSettingsNode(): React.ReactNode
 beta;useUiItemsProviderStatusBarItems: (manager: StatusBarItemsManager_2) => readonly CommonStatusBarItem[]
 beta;useUiItemsProviderToolbarItems: (manager: ToolbarItemsManager, toolbarUsage: ToolbarUsage, toolbarOrientation: ToolbarOrientation) => readonly CommonToolbarItem[]
-internal;useUiSettingsContext(): UiSettings
+beta;useUiSettingsStorageContext(): UiSettingsStorage
 internal;useUiVisibility(): boolean
 internal;useUpdateNineZoneSize(frontstageDef: FrontstageDef): void
 alpha;useVisibilityTreeFiltering: (nodeLoader: AbstractTreeNodeLoaderWithProvider

common/api/ui-components.api.md

@@ -73,6 +73,7 @@ import { TimeDisplay } from '@bentley/ui-abstract';
 import { TimeFormat } from '@bentley/ui-core';
 import { UiEvent } from '@bentley/ui-core';
 import { UiSettings } from '@bentley/ui-core';
+import { UiSettingsStorage } from '@bentley/ui-core';
 import { UnitProps } from '@bentley/imodeljs-quantity';
 import { UnitsProvider } from '@bentley/imodeljs-quantity';
 import { Vector3d } from '@bentley/geometry-core';
@@ -4527,9 +4528,11 @@ export interface TableProps extends CommonProps {
     scrollToRow?: number;
     selectionMode?: SelectionMode;
     settingsIdentifier?: string;
+    settingsStorage?: UiSettingsStorage;
     showHideColumns?: boolean;
     stripedRows?: boolean;
     tableSelectionTarget?: TableSelectionTarget;
+    // @deprecated
     uiSettings?: UiSettings;
 }
 

common/api/ui-core.api.md

@@ -1247,8 +1247,8 @@ export interface LoadingStatusProps extends CommonProps {
     percent: number;
 }
 
-// @beta
-export class LocalUiSettings implements UiSettings {
+// @public
+export class LocalSettingsStorage implements UiSettingsStorage {
     constructor(w?: Window);
     // (undocumented)
     deleteSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
@@ -1260,6 +1260,11 @@ export class LocalUiSettings implements UiSettings {
     w: Window;
 }
 
+// @beta @deprecated
+export class LocalUiSettings extends LocalSettingsStorage {
+    constructor(w?: Window);
+}
+
 // @public
 export interface MainTabsProps extends TabsProps {
     mainClassName: string;
@@ -1886,8 +1891,8 @@ export interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElemen
     setFocus?: boolean;
 }
 
-// @beta
-export class SessionUiSettings implements UiSettings {
+// @public
+export class SessionSettingsStorage implements UiSettingsStorage {
     constructor(w?: Window);
     // (undocumented)
     deleteSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
@@ -1899,6 +1904,11 @@ export class SessionUiSettings implements UiSettings {
     w: Window;
 }
 
+// @beta @deprecated
+export class SessionUiSettings extends SessionSettingsStorage {
+    constructor(w?: Window);
+}
+
 // @beta
 export const SettingsContainer: ({ tabs, onSettingsTabSelected, currentSettingsTab, settingsManager, showHeader }: SettingsContainerProps) => JSX.Element;
 
@@ -1920,7 +1930,7 @@ export interface SettingsContainerProps {
 export class SettingsManager {
     activateSettingsTab(settingsTabId: string): void;
     // (undocumented)
-    addSettingsProvider(settingsProvider: SettingsProvider): void;
+    addSettingsProvider(settingsProvider: SettingsTabsProvider): void;
     closeSettingsContainer(closeFunc: (args: any) => void, closeFuncArgs?: any): void;
     getSettingEntries(stageId: string, stageUsage: string): Array<SettingsTabEntry>;
     // @internal
@@ -1931,27 +1941,20 @@ export class SettingsManager {
     readonly onProcessSettingsTabActivation: ProcessSettingsTabActivationEvent;
     readonly onSettingsProvidersChanged: SettingsProvidersChangedEvent;
     // (undocumented)
-    get providers(): ReadonlyArray<SettingsProvider>;
-    set providers(p: ReadonlyArray<SettingsProvider>);
+    get providers(): ReadonlyArray<SettingsTabsProvider>;
+    set providers(p: ReadonlyArray<SettingsTabsProvider>);
     // (undocumented)
     removeSettingsProvider(providerId: string): boolean;
 }
 
-// @beta
-export interface SettingsProvider {
-    // (undocumented)
-    getSettingEntries(stageId: string, stageUsage: string): ReadonlyArray<SettingsTabEntry> | undefined;
-    readonly id: string;
-}
-
 // @beta
 export class SettingsProvidersChangedEvent extends BeUiEvent<SettingsProvidersChangedEventArgs> {
 }
 
 // @beta
 export interface SettingsProvidersChangedEventArgs {
     // (undocumented)
-    readonly providers: ReadonlyArray<SettingsProvider>;
+    readonly providers: ReadonlyArray<SettingsTabsProvider>;
 }
 
 // @beta
@@ -1967,6 +1970,13 @@ export interface SettingsTabEntry {
     readonly tooltip?: string | JSX.Element;
 }
 
+// @beta
+export interface SettingsTabsProvider {
+    // (undocumented)
+    getSettingEntries(stageId: string, stageUsage: string): ReadonlyArray<SettingsTabEntry> | undefined;
+    readonly id: string;
+}
+
 // @internal
 export const shallowDiffers: (a: {
     [key: string]: any;
@@ -2477,32 +2487,27 @@ export class UiCore {
 export class UiEvent<TEventArgs> extends BeUiEvent<TEventArgs> {
 }
 
-// @beta
+// @public
 export class UiSetting<T> {
-    constructor(settingNamespace: string, settingName: string, getValue: () => T, applyValue?: ((v: T) => void) | undefined);
+    constructor(settingNamespace: string, settingName: string, getValue: () => T, applyValue?: ((v: T) => void) | undefined, defaultValue?: T | undefined);
     // (undocumented)
     applyValue?: ((v: T) => void) | undefined;
-    deleteSetting(uiSettings: UiSettings): Promise<UiSettingsResult>;
-    getSetting(uiSettings: UiSettings): Promise<UiSettingsResult>;
-    getSettingAndApplyValue(uiSettings: UiSettings): Promise<UiSettingsResult>;
+    // (undocumented)
+    defaultValue?: T | undefined;
+    deleteSetting(storage: UiSettingsStorage): Promise<UiSettingsResult>;
+    getSetting(storage: UiSettingsStorage): Promise<UiSettingsResult>;
+    getSettingAndApplyValue(storage: UiSettingsStorage): Promise<UiSettingsResult>;
     // (undocumented)
     getValue: () => T;
-    saveSetting(uiSettings: UiSettings): Promise<UiSettingsResult>;
+    saveSetting(storage: UiSettingsStorage): Promise<UiSettingsResult>;
     // (undocumented)
     settingName: string;
     // (undocumented)
     settingNamespace: string;
 }
 
 // @public
-export interface UiSettings {
-    // (undocumented)
-    deleteSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
-    // (undocumented)
-    getSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
-    // (undocumented)
-    saveSetting(settingNamespace: string, settingName: string, setting: any): Promise<UiSettingsResult>;
-}
+export type UiSettings = UiSettingsStorage;
 
 // @public
 export interface UiSettingsResult {
@@ -2526,6 +2531,16 @@ export enum UiSettingsStatus {
     UnknownError = 2
 }
 
+// @public
+export interface UiSettingsStorage {
+    // (undocumented)
+    deleteSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
+    // (undocumented)
+    getSetting(settingNamespace: string, settingName: string): Promise<UiSettingsResult>;
+    // (undocumented)
+    saveSetting(settingNamespace: string, settingName: string, setting: any): Promise<UiSettingsResult>;
+}
+
 // @public
 export function UnderlinedButton(props: UnderlinedButtonProps): JSX.Element;