grafana/public/app/features/scenes/core/SceneTimeRange.tsx

108 lines
3.1 KiB
TypeScript
Raw Normal View History

import { dateMath, getTimeZone, TimeRange, TimeZone, toUtc } from '@grafana/data';
import { SceneObjectUrlSyncConfig } from '../services/SceneObjectUrlSyncConfig';
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
import { SceneObjectBase } from './SceneObjectBase';
import { SceneTimeRangeLike, SceneTimeRangeState, SceneObjectUrlValues, SceneObjectUrlValue } from './types';
export class SceneTimeRange extends SceneObjectBase<SceneTimeRangeState> implements SceneTimeRangeLike {
protected _urlSync = new SceneObjectUrlSyncConfig(this, { keys: ['from', 'to'] });
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
public constructor(state: Partial<SceneTimeRangeState> = {}) {
const from = state.from ?? 'now-6h';
const to = state.to ?? 'now';
const timeZone = state.timeZone ?? getTimeZone();
const value = evaluateTimeRange(from, to, timeZone);
super({ from, to, timeZone, value, ...state });
}
public onTimeRangeChange = (timeRange: TimeRange) => {
const update: Partial<SceneTimeRangeState> = {};
if (typeof timeRange.raw.from === 'string') {
update.from = timeRange.raw.from;
} else {
update.from = timeRange.raw.from.toISOString();
}
if (typeof timeRange.raw.to === 'string') {
update.to = timeRange.raw.to;
} else {
update.to = timeRange.raw.to.toISOString();
}
update.value = evaluateTimeRange(update.from, update.to, this.state.timeZone);
this.setState(update);
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
};
public onRefresh = () => {
this.setState({ value: evaluateTimeRange(this.state.from, this.state.to, this.state.timeZone) });
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
};
public onIntervalChanged = (_: string) => {};
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
public getUrlState(state: SceneTimeRangeState) {
return { from: state.from, to: state.to };
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
}
public updateFromUrl(values: SceneObjectUrlValues) {
const update: Partial<SceneTimeRangeState> = {};
const from = parseUrlParam(values.from);
if (from) {
update.from = from;
}
const to = parseUrlParam(values.to);
if (to) {
update.to = to;
}
update.value = evaluateTimeRange(update.from ?? this.state.from, update.to ?? this.state.to, this.state.timeZone);
this.setState(update);
}
}
function parseUrlParam(value: SceneObjectUrlValue): string | null {
if (typeof value !== 'string') {
return null;
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
}
if (value.indexOf('now') !== -1) {
return value;
}
if (value.length === 8) {
const utcValue = toUtc(value, 'YYYYMMDD');
if (utcValue.isValid()) {
return utcValue.toISOString();
}
} else if (value.length === 15) {
const utcValue = toUtc(value, 'YYYYMMDDTHHmmss');
if (utcValue.isValid()) {
return utcValue.toISOString();
}
} else if (value.length === 24) {
const utcValue = toUtc(value);
return utcValue.toISOString();
}
const epoch = parseInt(value, 10);
if (!isNaN(epoch)) {
return toUtc(epoch).toISOString();
}
return null;
}
function evaluateTimeRange(from: string, to: string, timeZone: TimeZone, fiscalYearStartMonth?: number): TimeRange {
return {
from: dateMath.parse(from, false, timeZone, fiscalYearStartMonth)!,
to: dateMath.parse(to, true, timeZone, fiscalYearStartMonth)!,
raw: {
from: from,
to: to,
},
};
Scene: POC for a future dashboard model and runtime (#50980) * Playing around * This is getting interesting * Updates * Updated * Observable experiments * This is tricky * VizPanel panel renderer * New model progress * Maybe this could be something * Updated * Rename * updates * Updated * Query runners? not sure * Updated * updates * flex box layout starting to work * Testing * Tested an action * Parent context sort of working * Progress * Progress * Updated * Starting to work * Things are working * Scene list, nested scene demo * Progress on repeats * Moving things * Pretty big progress * More things working * Great progress * Progress * Name changing * Minor tweaks * Simplified sizing * Move toggleDirection to SceneFlexLayout * add feature flag (#50990) * removed new useObservable hook * Rename folder and feature toggle to scenes * Caching scenes so you can go back to another scene without having to re-query data * Fix issue with subs on re-mount * Fixing test * Added SceneCanvasText to play around with layout elements with size based on content * Scene: Edit mode and component edit wrapper that handles selection (#51078) * First step for scene variables * Started playing around with a scene edit mode * Better way to set component * Progress on edit mode * Update * Progress on edit mode * Progress on editor * Progress on editor * Updates * More working * Progress * Minor update * removed unnessary file * Moving things around * Updated * Making time range separate from time picker * minor rename of methods * The most basic variable start * Minor renames * Fixed interpolate issue if not found at closest level * An embryo of event model and url sync handling * Update url sync types * Removed unnessary any type arg Co-authored-by: Ryan McKinley <ryantxu@gmail.com> Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
2022-07-07 01:53:02 -05:00
}