BlueRain Settings App

A settings app for the BlueRain OS.

————— TODO: Add Screenshot here —————

Compatibility

| 🌏 Web | 🖥 Electron | 📱 React Native | | :---: | :--------: | :------------: | | ✅ | ✅ | ✅ |

Installation

Run the following command in the plugin directoy:

yarn add @blueeast/bluerain-app-settings

Then in your boot function, pass the plugin like this:

import BR from '@blueeast/bluerain-os';
import AppSettings from '@blueeast/bluerain-app-settings';

BR.boot({
	apps: [AppSettings]
})

Info

| Property | Value | | -------- | -------- | | appName | Settings | | slug | settings |

Hooks

This app provide the following hooks to dynamically modify it's behavior:

app.settings.items

The items schema that generates the layout and it's routes can be modified before exection.

Parameters

| Name | Type | Description | | ----- | ----------------------------- | ------------------------------------------------------------ | | items | Array<SettingsLayoutItem | string> | This is the main schema that is used to generate the layout. |

Returns

| Name | Type | Description | | ----- | ----------------------------- | ------------------------------------------------------------ | | items | Array<SettingsLayoutItem | string> | This is the main schema that is used to generate the layout. |

Components

In addition to hooks, the app also registers various components that work as building blocks to generate the layout.

SettingsLayout

This is the main layout component and is the top level visible view of the app. This layout can also be reused to create setting sections in other apps and plugins.

Props

• path

  | Label | Value | | ----------- | ------------------------------------------------------------ | | Type | String | | Required | ✅ | | Description | This is the path of the page where this layout is used. It is used to build sub pages/routes for each settings item. |

• items

  | Label | Value | | ----------- | ------------------------------------------------------------ | | Type | Array<SettingsLayoutItem | string> | | Required | ❌ | | Default | [] (Empty Array) | | Description | This is the main schema that is used to generate the settings layout.Defaults to an empty array. |

• componentNamePrefix

  | Label | Value | | ----------- | ------------------------------------------------------------ | | Type | String | | Required | ❌ | | Default | SettingsLayout | | Description | This string is used to build component names which are used as building blocks of the layout.So for example if the layout wants to fetch Menu component, SettingsLayout will look for SettingsLayoutMenu component in the BlueRain registry. |

• appBar

  | Label | Value | | ----------- | ------------------------------------------------------------ | | Type | string | React.ComponentType | | Required | ❌ | | Default | BR.Components.SettingsLayoutMainHeader | | Description | This is the main App Bar of the layout. If a string is given, the layout will try to use it as a component name to look into the BlueRain component registry.On desktop it is used persistently on every route. On mobile, it is only used on the settings index route. |