nerdlet

Usage

import { nerdlet } from 'nr1'

API methods

nerdlet.getSetUrlStateLocation

function (
urlState: Object

New nerdlet URL state.

) => Location

Example 1

1
nerdlet.getSetUrlStateLocation({
2
  foo: 'bar',
3
});

nerdlet.setConfig

function (
config: NerdletConfig

New nerdlet config

) => undefined

Enable account picker without cross-account support

1
nerdlet.setConfig({
2
  accountPicker: true,
3
});

Enable account picker with cross-account support

1
nerdlet.setConfig({
2
  accountPicker: true,
3
  accountPickerValues: [
4
    nerdlet.ACCOUNT_PICKER_VALUE.CROSS_ACCOUNT,
5
    ...nerdlet.ACCOUNT_PICKER_DEFAULT_VALUES,
6
  ],
7
});

Enable action controls

1
nerdlet.setConfig({
2
  actionControls: true,
3
  actionControlButtons: [
4
    {
5
      label: 'Favorite',
6
      type: nerdlet.ACTION_CONTROL_BUTTON_TYPES.SECONDARY,
7
      hint: 'Add entity to my favorites',
8
      iconType: Icon.TYPE.PROFILES__EVENTS__FAVORITE,
9
      onClick: () => this.onFavoriteEntity(),
10
    },
11
  ],
12
});

Enable filter bar

1
nerdlet.setConfig({
2
  filterBar: true,
3
});

Enable time picker with default values

1
nerdlet.setConfig({
2
  timePicker: true,
3
  timePickerRanges: nerdlet.TIME_PICKER_DEFAULT_RANGES,
4
});

Enable time picker with custom values

1
nerdlet.setConfig({
2
  timePicker: true,
3
  timePickerRanges: [
4
    nerdlet.TIME_PICKER_RANGE.NONE,
5
    {
6
      label: 'Last 15 days',
7
      offset: 1000 * 60 * 60 * 24 * 15,
8
    },
9
    nerdlet.TIME_PICKER_RANGE.CUSTOM,
10
  ],
11
});

Disable nerdlet header

1
nerdlet.setConfig({
2
  header: false,
3
});

Set custom header title and metadata

1
nerdlet.setConfig({
2
  headerType: nerdlet.HEADER_TYPE.CUSTOM,
3
  headerTitle: 'My custom header title',
4
  headerTitleMetadata: 'My custom header title metadata',
5
});

Set custom header title with parent

1
nerdlet.setConfig({
2
  headerType: nerdlet.HEADER_TYPE.CUSTOM,
3
  headerTitle: 'My custom header title',
4
  headerParentTitle: 'Parent nerdlet I want to redirect to',
5
  headerParentLocation: navigation.openNerdlet({
6
    id: 'my-nerdlet-to-redirect-to',
7
  }),
8
});

nerdlet.setUrlState

function (
urlState: Object,

New nerdlet URL state.

urlStateOptions: UrlStateOptions

Options for the URL state.

) => void

Example 1

1
nerdlet.setUrlState({
2
  foo: 'bar',
3
});

Type definitions

Location

{
pathname: string,

String representing the path to link to.

search: string,

String representing query parameters.

hash: string,

String to put in the URL as hash, e.g. #entities.

}

NerdletConfig

{
accountPicker: boolean,

Enable or disable the nerdlet's account picker.

accountPickerValues: any[],

Config the available accounts for the account picker. There are only two options: all authorized accounts (default) or all authorized accounts plus the 'All accounts' option (cross-account support). See examples for more details.

actionControls: boolean,

Enable or disable the nerdlet's action controls.

actionControlButtons: ActionControlButton[],

Config of your own custom action controls for the nerldet.

filterBar: boolean,

Enable or disable the nerdlet's filter bar.

header: boolean,

Enable or disable the nerdlet's header.

headerTitle: string,

Set the title of the nerdlet's header.

headerTitleMetadata: string,

Set the title metadata of the nerdlet's header.

headerType: string,

Set the header type of the nerdlet's header. Possible values are from nerdlet.HEADER_TYPE.

headerParentTitle: string,

Set the parent title of the nerdlet's header.

headerParentLocation: Location,

Set the parent location of the nerdlet's header.

timePicker: boolean,

Enable or disable the nerdlet's time picker.

timePickerRanges: TimePickerRange[],

Set of time ranges to display for this nerdlet.

timePickerDefaultOffset: number,

Time range offset to select by default.

}

ActionControlButton

{
label: string,

Label of the action control button.

type: Button.TYPE.PRIMARY | Button.TYPE.PLAIN,

Type of the action control button.

iconType: string,

Name of the icon to display.

hint: string,

Text used for the action control button's tooltip.

onClick: () => void,

Callback fired any time the user clicks on the action control button.

}

TimePickerRange

{
label: string,

Label for this time range.

offset: number,

Offset in ms.

}

UrlStateOptions

{
replaceHistory: boolean,

If true, the current entry in the browser history will be replaced with the new one.

}

Constants

nerdlet.ACCOUNT_PICKER_DEFAULT_VALUES

[
{ id: "authorized-accounts" }
]

nerdlet.ACCOUNT_PICKER_VALUE

{
CROSS_ACCOUNT: { id: "cross-account" }
}

nerdlet.ACTION_CONTROL_BUTTON_TYPES

{
PRIMARY: "primary",
SECONDARY: "secondary",
TERTIARY: "tertiary"
}

nerdlet.HEADER_TYPE

{
CUSTOM: "custom",
ENTITY: "entity"
}

nerdlet.TIME_PICKER_DEFAULT_RANGES

[
{ label: "30 minutes", offset: 1800000 },
{ label: "60 minutes", offset: 3600000 },
{ label: "3 hours", offset: 10800000 },
{ label: "6 hours", offset: 21600000 },
{ label: "12 hours", offset: 43200000 },
{ label: "24 hours", offset: 86400000 },
{ label: "3 days", offset: 259200000 },
{ label: "7 days", offset: 604800000 },
{ label: "Set custom", offset: "Custom" }
]

nerdlet.TIME_PICKER_RANGE

{
CUSTOM: { label: "Set custom", offset: "Custom" },
NONE: { label: "Default", offset: null }
}