Scheme

The scheme defines the whole structure of the rebase-ui user interface. Here you describe all the available views, server-side actions and queries, components and assets.

Setup

A scheme can either be a json file or a javascript file returning an object. You have to reference this file in the rebase-manifest.json file like this:

{
  "type": "rebase-worker",
  ...,
  "extensions": {
    "myAdminPanel": {
      "packageName": "rebase:backend-ui",
      "arguments": {
        "baseUrl": "...",
        "systemAdminName": "...",
        "systemAdminPass": "...",
        "systemUsersDatabase": "...",
        "systemSessionsDatabase": "...",
        "uiScheme": "path/to/my-scheme.json"
      }
    }
  }
}

The given uiScheme file path is relative to the rebase-manifest.json file.

When you want to use a javascript file for more flexibility, you have to export a default function from your script. Let's assume uiScheme is set to path/to/my-scheme.mjs (or .js), you would export like this:

export default () => {
  // do custom logic here
  return {
    branding: {...},
    extensions: {...},
    sections: {...},
    ... // (see the structure section for more information)
  }
}

Structure

Wether you go the json route or javascript route; the scheme has to result in an object containing the following properties:

{
  "branding": {...},
  "extensions": {...},
  "sections": {...},
  "views": {...},
  "actions": {...},
  "queries": {...},
  "components": {...},
  "assets": {...},
  "translations": {...}
}

Branding

The branding section only contains three properties:

{
  ...,
  "branding": {
    "brandTitle": "My Admin Panel",
    "brandLogo": "brand-logo",
    "brandStylesheet": "brand-stylesheet"
  },
  "assets": {
    "brand-stylesheet": "path/to/login-logo.png",
    "brand-stylesheet": "path/to/login-stylesheet.css"
  }
}

The brandTitle property will be used for the browser's window/tab title text.

The brandLogo refers to the name of an asset that will be used for the browser's window/tab favicon as well as the logo displayed above the login inputs.

The brandStylesheet refers to the name of an css asset that will be used to style the login screen itself.

Sections

Views

Actions and Queries

Components

Assets

Extensions

Translations

Security

User Roles

When assigning roles to views, components, actions and queries only assign the minimum amount of roles required. This way there are less user roles you will have to support in server-side actions and hence have an easier time managing your server-side code.

Two-Factor-Authentication (2FA)

As of now, 2FA via Key-Sticks and OTP-Authenticators are planned for a future release.

Root Admin User

The root admin is a static user that will always exist in the system. This user can use the normal login page and is only able to manage system users. This can help you when you are first spinning up your project and have to create the very first normal user for your login protected admin panel.

As with all kind of static user accounts, it's pure existence is a rather strong security concern. It is recommended to use the root admin to login the system for creating the first couple of administrative system users and then to DISABLE the root admin account by changing the systemAdminPass hash to a non 64-characters long string, so the user can never be successfully authenticated again.

The easiest approach is to load the systemAdminPass from an environment variable, then just change the environment variable before moving your project to production.