Skip to main content

Using builder tiers

Builder tiers allow disabling, hiding, or highlighting blocks for specific users or situations. For example, you could define a tier for blocks only available in a paid version of your product.

A tier is defined by the tier property. This property of type IBuilderTier is part of the IBuilderProperties interface used when constructing a new builder instance.

Defining a tier

You define a tier by specifying the names of the blocks that are part of the tier. The optional mode property specifies what the effect of the tier is. Also, an optional message can be defined. This message is shown in the block editor panel for blocks that are part of the tier.

Example

This example defines a math tier that includes the calculator stock block and disables it for the current user. The defined message is presented to the user when the editor panel of the calculator block opens.

import { Builder } from "@tripetto/builder";

const builder = new Builder({
tier: {
name: "math",
blocks: [
"@tripetto/block-calculator"
],
mode: "disabled", // For users who should have access to this tier, supply `enabled`
message: (orchestrator) => {
orchestrator.form({
title: "Calculator is not available in this tier!",
controls: [
new Forms.Static("You need a math license to unlock the calculator."),
],
});
}
}

});