scenes
Build Grafana dashboards directly in your Grafana app plugins.
APACHE-2.0 License
Bot releases are visible (Hide)
Published by grafanabot over 1 year ago
Release Notes
Add support for timezones (#167)
You can now use multiple time zones in Scene. SceneTimeRange and SceneTimePicker respect time zone settings. Additionally, a new object was added, SceneTimeZoneOverride. It can be used to override the time zone provided by a time range object higher in the scene hierarchy. Objects within SceneTimeZoneOverride scope will use the closest SceneTimeRange range, but a locally specified time zone.
Example:
const scene = new EmbeddedScene({
$timeRange: new SceneTimeRange({ from: 'now-6h', to: 'now', timeZone: 'browser'}),
children: [
// Will use global time range and time zone
new VizPanel({
$data: new SceneQueryRunner({ ... }),
...
}),
// Will use global time range and locally specified time zone
new VizPanel({
$timeRange: new SceneTimeZoneOverride({ timeZone: 'America/New_York' }),
$data: new SceneQueryRunner({ ... }),
...
}),
],
...
})
🚀 Enhancement
-
@grafana/scenes
🐛 Bug Fix
Authors: 2
Published by grafanabot over 1 year ago
🚀 Enhancement
-
@grafana/scenes
🐛 Bug Fix
Authors: 3
- Dominik Prokop (@dprokop)
- juanicabanas (@juanicabanas)
- Torkel Ödegaard (@torkelo)
Published by grafanabot over 1 year ago
Release Notes
Behaviors: Add state and runtime behavior to any scene object (#119)
You can now augment any scene object with runtime state & behavior using the new $behaviors state key. Behaviors are implemented as SceneObjects that are activated when their parent is activated or as pure functions that get called when the SceneObject they are attached to get's activated.
With behaviors you can easily implement conditional display of panels using the new isHidden property on SceneFlexItem. and other dynamic layout behaviors. View the behaviors demo for some examples.
🚀 Enhancement
-
@grafana/scenes
🐛 Bug Fix
- Docs: Getting started and core concepts #136 (@dprokop)
- SceneApp: Share defaults between demos #132 (@torkelo)
- PackageJson: Simple scripts to run app dev from root #133 (@torkelo)
-
@grafana/scenes- SceneQueryRunner: Return after setting empty state #145 (@torkelo)
- SceneGridLayout: Support lazy rendering of items out of view #129 (@kaydelaney @torkelo)
- UrlSync: Makes url sync work on SceneAppPage level #143 (@torkelo)
- SceneAppPage: Refactorings and adding default fallback routes #142 (@torkelo)
- Flex layout item parent direction #141 (@dprokop @torkelo)
- SceneApp: Correctly build demo pages with getParentPage #137 (@torkelo)
- Templating: Add macros for __data, __field and __series #131 (@torkelo)
- FlexLayout: Allow SceneFlexLayout to be child of another flex layout #135 (@dprokop)
- FindObject: Fixes search logic so that it does not get stuck in infine loops #140 (@torkelo)
- sceneGraph: findObject #127 (@torkelo)
- SceneAppPage: Support dynamic pages (changing tabs, title, controls) #71 (@torkelo)
- scene-app: Refactor to use SceneAppPage for demos #125 (@torkelo @dprokop)
- Packages: Update grafana/* to latest #130 (@torkelo)
- QueryEditor: Adds inline query editor scene object #43 (@kaydelaney @dprokop)
- SceneVariableSet: Refresh variables that depend on time range #124 (@dprokop)
- ValueMacro: Fixes so __value works for rowIndex 0 #123 (@torkelo)
Authors: 3
- Dominik Prokop (@dprokop)
- kay delaney (@kaydelaney)
- Torkel Ödegaard (@torkelo)
Published by grafanabot over 1 year ago
Release Notes
SceneObject: Rename SceneObjectStatePlain to SceneObjectState (#122)
SceneObjectStatePlain is now named SceneObjectState. So if you have custom scene objects that extends SceneObjectStatePlain just do a search and replace for SceneObjectStatePlain and replace withSceneObjectState.
🚀 Enhancement
-
@grafana/scenes- SceneObject: Rename SceneObjectStatePlain to SceneObjectState #122 (@torkelo)
- VizPanel: Updates to support panel context #113 (@torkelo @dprokop)
- SceneObject: Add forEachChild to SceneObject interface and SceneObjectBase #118 (@torkelo)
- SceneObject: Change how activate works and remove deactivate #114 (@torkelo)
🐛 Bug Fix
-
@grafana/scenes
⚠️ Pushed to main
-
@grafana/scenes
Authors: 2
Published by grafanabot over 1 year ago
Release Notes
Layout: Create atomic, layout specific objects (#97)
The interface of SceneFlexLayout and SceneGridLayout has changed. These scene objects now accept only dedicated layout item objects as children:
-
SceneFlexItemforSceneFlexLayout -
SceneGridItemandSceneGridRowforSceneGridLayout
placement property has been replaced by those layout-specific objects.
Example
// BEFORE
const layout = new SceneFlexLayout({
direction: 'column',
children: [
new VizPanel({
placement: {
width: '50%',
height: '400',
},
...
})
],
...
})
// AFTER
const layout = new SceneFlexLayout({
direction: 'column',
children: [
new SceneFlexItem({
width: '50%',
height: '400',
body: new VizPanel({ ... }),
}),
],
...
})
🚀 Enhancement
-
@grafana/scenes
Authors: 3
Published by grafanabot over 1 year ago
Release Notes
UrlSync: Simplify url sync interface (#100)
The SceneObjectUrlSyncHandler interface has changed. The function getUrlState no longer takes state as parameter. The implementation needs to use the current scene object state instead.
🚀 Enhancement
🐛 Bug Fix
Authors: 1
- Torkel Ödegaard (@torkelo)
Published by grafanabot over 1 year ago
🐛 Bug Fix
- ScenesApp: Change to workspace dependency #99 (@torkelo)
- Yarn: Caching should work #93 (@torkelo)
-
@grafana/scenes- Enable auto #107 (@torkelo)
- Fix type import #104 (@torkelo)
- Macros: Share SkipFormattingValue value between AllUrlVariablesMacro and UrlTimeRangeMacro #101 (@torkelo)
- Scene: Support for new types of "macro" variables starting with __all_variables #98 (@domasx2 @torkelo)
- UrlSyncManager: Improvements and fixes #96 (@torkelo)
- Changelog: Clean up auto crap #94 (@torkelo)
Authors: 2
Published by torkelo over 1 year ago
SceneObject subscribeToState parameter change
Signature change. Now the parameter to this function expects a simple function that takes two args (newState, prevState).
Before:
this._subs.add(
sourceData.subscribeToState({
next: (state) => this.transform(state.data),
})
);
Becomes:
this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));
addActivationHandler
SceneObject now has a new function called addActivationHandler that makes it much easier to add external behaviors to core scene componenents. The
activation handler (callback) can return a deactivation handler. This works very similar to useEffect.
For custom components that used to override activate and then call super.activate() we now recommend that you instead use addActivationHandler from
the constructor. See https://github.com/grafana/scenes/pull/77 for some examples.
VizPanelMenu
A new scene object to enable panel menu for VizPanel.
Example usage:
const menu = new VizPanelMenu({});
// Configure menu items
menu.addActivationHandler(() => {
menu.setItems(menuItems);
});
// Attach menu to VizPanel
const panelWithMenu = new VizPanel({
title: 'Panel with menu',
menu,
// ... VizPanel configuration
});