Update feature-flags.md
Some minor updates to punctuation, code examples, and language Signed-off-by: Joshua Jung <joshua.p.jung@gmail.com>
This commit is contained in:
@@ -6,39 +6,39 @@ description: Details the process of defining setting and reading a feature flag.
|
||||
|
||||
Backstage offers the ability to define feature flags inside a plugin or during application creation. This allows you to restrict parts of your plugin to those individual users who have toggled the feature flag to on.
|
||||
|
||||
This page describes the process of defining setting and reading a feature flag. If you are looking for using feature flags with software templates that can be found under [Writing Templates](https://backstage.io/docs/features/software-templates/writing-templates#remove-sections-or-fields-based-on-feature-flags).
|
||||
This page describes the process of defining, setting and reading a feature flag. If you are looking for using feature flags specifically with software templates please see [Writing Templates](https://backstage.io/docs/features/software-templates/writing-templates#remove-sections-or-fields-based-on-feature-flags).
|
||||
|
||||
## Defining a Feature Flag
|
||||
|
||||
### In a plugin
|
||||
|
||||
Defining feature flag in a plugin is done by passing the name of the feature flag into the `featureFlags` array:
|
||||
Defining a feature flag in a plugin is done by passing the name of the feature flag into the `featureFlags` array:
|
||||
|
||||
```ts
|
||||
/* src/plugin.ts */
|
||||
import { createPlugin, createRouteRef } from '@backstage/core-plugin-api';
|
||||
import ExampleComponent from './components/ExampleComponent';
|
||||
```ts title="src/plugin.ts"
|
||||
import { createPlugin } from '@backstage/core-plugin-api';
|
||||
|
||||
export const examplePlugin = createPlugin({
|
||||
id: 'example',
|
||||
routes: {
|
||||
root: rootRouteRef,
|
||||
},
|
||||
// ...
|
||||
featureFlags: [{ name: 'show-example-feature' }],
|
||||
// ...
|
||||
});
|
||||
```
|
||||
|
||||
### In the application
|
||||
|
||||
Defining feature flag in the application is done by adding feature flags in`featureFlags` array in
|
||||
Defining a feature flag in the application is done by adding feature flags in `featureFlags` array in the
|
||||
`createApp()` function call:
|
||||
|
||||
```ts
|
||||
```ts title="packages/app/src/App.tsx"
|
||||
import { createApp } from '@backstage/app-defaults';
|
||||
|
||||
const app = createApp({
|
||||
// ...
|
||||
featureFlags: [
|
||||
{
|
||||
pluginId: '', // pluginId is required for feature flags in plugins. It can be left blank for a feature flag leveraged in the application.
|
||||
// pluginId is required for feature flags used in plugins.
|
||||
// pluginId can be left blank for a feature flag used in the application and not in plugins.
|
||||
pluginId: '',
|
||||
name: 'tech-radar',
|
||||
description: 'Enables the tech radar plugin',
|
||||
},
|
||||
@@ -49,11 +49,9 @@ const app = createApp({
|
||||
|
||||
## Enabling Feature Flags
|
||||
|
||||
Feature flags are defaulted to off and can be updated by individual users in the backstage interface.
|
||||
Feature flags are defaulted to off and can be updated by individual users in the backstage interface. These are set by navigating to the page under `Settings` > `Feature Flags`.
|
||||
|
||||
These are set by navigating to the page under `Settings` > `Feature Flags`.
|
||||
|
||||
The users selection is saved in the users browsers local storage. Once toggled it may be required for a user to refresh the page to see any new changes.
|
||||
The user's selection is saved in the user's browser local storage. Once a feature flag is toggled it may be required for a user to refresh the page to see the change.
|
||||
|
||||
## FeatureFlagged Component
|
||||
|
||||
@@ -75,7 +73,7 @@ import { FeatureFlagged } from '@backstage/core-app-api';
|
||||
|
||||
## Evaluating Feature Flag State
|
||||
|
||||
It is also possible to test the feature flag state using the [FeatureFlags Api](https://backstage.io/docs/reference/core-plugin-api.featureflagsapi).
|
||||
It is also possible to query a feature flag using the [FeatureFlags Api](https://backstage.io/docs/reference/core-plugin-api.featureflagsapi).
|
||||
|
||||
```ts
|
||||
import { useApi, featureFlagsApiRef } from '@backstage/core-plugin-api';
|
||||
|
||||
Reference in New Issue
Block a user