IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into bar-gauge-poc

Browse Source
This commit is contained in:
Peter Holmberg 2019-02-21 10:38:26 +01:00
commit 58f194b483
100 changed files with 820 additions and 501 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/sources/auth/generic-oauth.md
View File

@ -113,7 +113,7 @@ allowed_organizations =
allowed_organizations =
```
### Set up OAuth2 with Auth0
## Set up OAuth2 with Auth0
1. Create a new Client in Auth0
- Name: Grafana
@ -139,7 +139,7 @@ allowed_organizations =
api_url = https://<domain>/userinfo
```
### Set up OAuth2 with Azure Active Directory
## Set up OAuth2 with Azure Active Directory
1. Log in to portal.azure.com and click "Azure Active Directory" in the side menu, then click the "Properties" sub-menu item.

21
package.json
View File

@ -83,7 +83,7 @@
"postcss-browser-reporter": "^0.5.0",
"postcss-loader": "^2.0.6",
"postcss-reporter": "^5.0.0",
"prettier": "1.9.2",
"prettier": "1.16.4",
"react-hot-loader": "^4.3.6",
"react-test-renderer": "^16.5.0",
"redux-mock-store": "^1.5.3",
@ -129,8 +129,14 @@
}
},
"lint-staged": {
"*.{ts,tsx,json,scss}": ["prettier --write", "git add"],
"*pkg/**/*.go": ["gofmt -w -s", "git add"]
"*.{ts,tsx,json,scss}": [
"prettier --write",
"git add"
],
"*pkg/**/*.go": [
"gofmt -w -s",
"git add"
]
},
"prettier": {
"trailingComma": "es5",
@ -196,7 +202,12 @@
"**/@types/react": "16.7.6"
},
"workspaces": {
"packages": ["packages/*"],
"nohoist": ["**/@types/*", "**/@types/*/**"]
"packages": [
"packages/*"
],
"nohoist": [
"**/@types/*",
"**/@types/*/**"
]
}
}

4
packages/grafana-ui/src/components/ColorPicker/ColorPicker.tsx
View File

@ -1,6 +1,6 @@
import React, { Component, createRef } from 'react';
import PopperController from '../Tooltip/PopperController';
import Popper from '../Tooltip/Popper';
import { PopperController } from '../Tooltip/PopperController';
import { Popper } from '../Tooltip/Popper';
import { ColorPickerPopover } from './ColorPickerPopover';
import { Themeable } from '../../types';
import { getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';

2
packages/grafana-ui/src/components/ColorPicker/ColorPickerPopover.tsx
View File

@ -4,7 +4,7 @@ import { getColorName, getColorFromHexRgbOrName } from '../../utils/namedColorsP
import { ColorPickerProps, warnAboutColorPickerPropsDeprecation } from './ColorPicker';
import { PopperContentProps } from '../Tooltip/PopperController';
import SpectrumPalette from './SpectrumPalette';
import { GrafanaThemeType } from '@grafana/ui';
import { GrafanaThemeType } from '../../types/theme';
export interface Props<T> extends ColorPickerProps, PopperContentProps {
customPickers?: T;

2
packages/grafana-ui/src/components/DeleteButton/DeleteButton.story.tsx
View File

@ -1,6 +1,6 @@
import React, { FunctionComponent } from 'react';
import { storiesOf } from '@storybook/react';
import { DeleteButton } from '@grafana/ui';
import { DeleteButton } from './DeleteButton';
const CenteredStory: FunctionComponent<{}> = ({ children }) => {
return (

2
packages/grafana-ui/src/components/EmptySearchResult/_EmptySearchResult.scss
View File

@ -4,5 +4,5 @@
padding: $spacer;
min-width: 350px;
border-radius: $border-radius;
margin-bottom: $spacer*2;
margin-bottom: $spacer * 2;
}

4
packages/grafana-ui/src/components/Gauge/Gauge.tsx
View File

@ -104,9 +104,9 @@ export class Gauge extends PureComponent<Props> {
getFontScale(length: number): number {
if (length > 12) {
return FONT_SCALE - length * 5 / 120;
return FONT_SCALE - (length * 5) / 120;
}
return FONT_SCALE - length * 5 / 105;
return FONT_SCALE - (length * 5) / 105;
}
draw() {

3
packages/grafana-ui/src/components/ThresholdsEditor/ThresholdsEditor.tsx
View File

@ -3,7 +3,8 @@ import { Threshold } from '../../types';
import { ColorPicker } from '..';
import { PanelOptionsGroup } from '..';
import { colors } from '../../utils';
import { getColorFromHexRgbOrName, ThemeContext } from '@grafana/ui';
import { ThemeContext } from '../../themes/ThemeContext';
import { getColorFromHexRgbOrName } from '../../utils/namedColorsPalette';
export interface Props {
thresholds: Threshold[];

20
packages/grafana-ui/src/components/Tooltip/Popper.tsx
View File

@ -1,7 +1,7 @@
import React, { PureComponent } from 'react';
import * as PopperJS from 'popper.js';
import { Manager, Popper as ReactPopper, PopperArrowProps } from 'react-popper';
import { Portal } from '@grafana/ui';
import { Portal } from '../Portal/Portal';
import Transition from 'react-transition-group/Transition';
import { PopperContent } from './PopperController';
@ -17,12 +17,7 @@ const transitionStyles: { [key: string]: object } = {
exiting: { opacity: 0, transitionDelay: '500ms' },
};
export type RenderPopperArrowFn = (
props: {
arrowProps: PopperArrowProps;
placement: string;
}
) => JSX.Element;
export type RenderPopperArrowFn = (props: { arrowProps: PopperArrowProps; placement: string }) => JSX.Element;
interface Props extends React.HTMLAttributes<HTMLDivElement> {
show: boolean;
@ -58,7 +53,7 @@ class Popper extends PureComponent<Props> {
// TODO: move modifiers config to popper controller
modifiers={{ preventOverflow: { enabled: true, boundariesElement: 'window' } }}
>
{({ ref, style, placement, arrowProps }) => {
{({ ref, style, placement, arrowProps, scheduleUpdate }) => {
return (
<div
onMouseEnter={onMouseEnter}
@ -73,7 +68,12 @@ class Popper extends PureComponent<Props> {
className={`${wrapperClassName}`}
>
<div className={className}>
{typeof content === 'string' ? content : React.cloneElement(content)}
{typeof content === 'string' && content}
{React.isValidElement(content) && React.cloneElement(content)}
{typeof content === 'function' &&
content({
updatePopperPosition: scheduleUpdate,
})}
{renderArrow &&
renderArrow({
arrowProps,
@ -93,4 +93,4 @@ class Popper extends PureComponent<Props> {
}
}
export default Popper;
export { Popper };

4
packages/grafana-ui/src/components/Tooltip/PopperController.tsx
View File

@ -7,7 +7,7 @@ export interface PopperContentProps {
updatePopperPosition?: () => void;
}
export type PopperContent<T extends PopperContentProps> = string | React.ReactElement<T>;
export type PopperContent<T extends PopperContentProps> = string | React.ReactElement<T> | ((props: T) => JSX.Element);
export interface UsingPopperProps {
show?: boolean;
@ -101,4 +101,4 @@ class PopperController extends React.Component<Props, State> {
}
}
export default PopperController;
export { PopperController };

4
packages/grafana-ui/src/components/Tooltip/Tooltip.tsx
View File

@ -1,7 +1,7 @@
import React, { createRef } from 'react';
import * as PopperJS from 'popper.js';
import Popper from './Popper';
import PopperController, { UsingPopperProps } from './PopperController';
import { Popper } from './Popper';
import { PopperController, UsingPopperProps } from './PopperController';
interface TooltipProps extends UsingPopperProps {
theme?: 'info' | 'error';

2
packages/grafana-ui/src/components/index.ts
View File

@ -1,5 +1,7 @@
export { DeleteButton } from './DeleteButton/DeleteButton';
export { Tooltip } from './Tooltip/Tooltip';
export { PopperController } from './Tooltip/PopperController';
export { Popper } from './Tooltip/Popper';
export { Portal } from './Portal/Portal';
export { CustomScrollbar } from './CustomScrollbar/CustomScrollbar';

2
public/app/core/angular_wrappers.ts
View File

@ -10,10 +10,12 @@ import { SideMenu } from './components/sidemenu/SideMenu';
import { MetricSelect } from './components/Select/MetricSelect';
import AppNotificationList from './components/AppNotifications/AppNotificationList';
import { ColorPicker, SeriesColorPickerPopoverWithTheme } from '@grafana/ui';
import { FunctionEditor } from 'app/plugins/datasource/graphite/FunctionEditor';
export function registerAngularDirectives() {
react2AngularDirective('passwordStrength', PasswordStrength, ['password']);
react2AngularDirective('sidemenu', SideMenu, []);
react2AngularDirective('functionEditor', FunctionEditor, ['func', 'onRemove', 'onMoveLeft', 'onMoveRight']);
react2AngularDirective('appNotificationsList', AppNotificationList, []);
react2AngularDirective('pageHeader', PageHeader, ['model', 'noTabs']);
react2AngularDirective('emptyListCta', EmptyListCTA, ['model']);

17
public/app/core/components/PermissionList/PermissionListItem.tsx
View File

@ -61,15 +61,14 @@ export default class PermissionsListItem extends PureComponent<Props> {
{item.name} <ItemDescription item={item} />
</td>
<td>
{item.inherited &&
folderInfo && (
<em className="muted no-wrap">
Inherited from folder{' '}
<a className="text-link" href={`${folderInfo.url}/permissions`}>
{folderInfo.title}
</a>{' '}
</em>
)}
{item.inherited && folderInfo && (
<em className="muted no-wrap">
Inherited from folder{' '}
<a className="text-link" href={`${folderInfo.url}/permissions`}>
{folderInfo.title}
</a>{' '}
</em>
)}
{inheritedFromRoot && <em className="muted no-wrap">Default Permission</em>}
</td>
<td className="query-keyword">Can</td>

20
public/app/core/components/json_explorer/helpers.ts
View File

@ -3,14 +3,14 @@
/*
* Escapes `"` characters from string
*/
*/
function escapeString(str: string): string {
return str.replace('"', '"');
}
/*
* Determines if a value is an object
*/
*/
export function isObject(value: any): boolean {
const type = typeof value;
return !!value && type === 'object';
@ -20,7 +20,7 @@ export function isObject(value: any): boolean {
* Gets constructor name of an object.
* From http://stackoverflow.com/a/332429
*
*/
*/
export function getObjectName(object: object): string {
if (object === undefined) {
return '';
@ -43,7 +43,7 @@ export function getObjectName(object: object): string {
/*
* Gets type of an object. Returns "null" for null objects
*/
*/
export function getType(object: object): string {
if (object === null) {
return 'null';
@ -53,7 +53,7 @@ export function getType(object: object): string {
/*
* Generates inline preview for a JavaScript object based on a value
*/
*/
export function getValuePreview(object: object, value: string): string {
const type = getType(object);
@ -78,7 +78,7 @@ export function getValuePreview(object: object, value: string): string {
/*
* Generates inline preview for a JavaScript object
*/
*/
let value = '';
export function getPreview(obj: object): string {
if (isObject(obj)) {
@ -94,15 +94,15 @@ export function getPreview(obj: object): string {
/*
* Generates a prefixed CSS class name
*/
*/
export function cssClass(className: string): string {
return `json-formatter-${className}`;
}
/*
* Creates a new DOM element with given type and class
* TODO: move me to helpers
*/
* Creates a new DOM element with given type and class
* TODO: move me to helpers
*/
export function createElement(type: string, className?: string, content?: Element | string): Element {
const el = document.createElement(type);
if (className) {

24
public/app/core/components/json_explorer/json_explorer.ts
View File

@ -83,7 +83,7 @@ export class JsonExplorer {
/*
* is formatter open?
*/
*/
private get isOpen(): boolean {
if (this._isOpen !== null) {
return this._isOpen;
@ -94,14 +94,14 @@ export class JsonExplorer {
/*
* set open state (from toggler)
*/
*/
private set isOpen(value: boolean) {
this._isOpen = value;
}
/*
* is this a date string?
*/
*/
private get isDate(): boolean {
return (
this.type === 'string' &&
@ -111,14 +111,14 @@ export class JsonExplorer {
/*
* is this a URL string?
*/
*/
private get isUrl(): boolean {
return this.type === 'string' && this.json.indexOf('http') === 0;
}
/*
* is this an array?
*/
*/
private get isArray(): boolean {
return Array.isArray(this.json);
}
@ -126,21 +126,21 @@ export class JsonExplorer {
/*
* is this an object?
* Note: In this context arrays are object as well
*/
*/
private get isObject(): boolean {
return isObject(this.json);
}
/*
* is this an empty object with no properties?
*/
*/
private get isEmptyObject(): boolean {
return !this.keys.length && !this.isArray;
}
/*
* is this an empty object or array?
*/
*/
private get isEmpty(): boolean {
return this.isEmptyObject || (this.keys && !this.keys.length && this.isArray);
}
@ -148,14 +148,14 @@ export class JsonExplorer {
/*
* did we receive a key argument?
* This means that the formatter was called as a sub formatter of a parent formatter
*/
*/
private get hasKey(): boolean {
return typeof this.key !== 'undefined';
}
/*
* if this is an object, get constructor function name
*/
*/
private get constructorName(): string {
return getObjectName(this.json);
}
@ -163,7 +163,7 @@ export class JsonExplorer {
/*
* get type of this value
* Possible values: all JavaScript primitive types plus "array" and "null"
*/
*/
private get type(): string {
return getType(this.json);
}
@ -171,7 +171,7 @@ export class JsonExplorer {
/*
* get object keys
* If there is an empty key we pad it wit quotes to make it visible
*/
*/
private get keys(): string[] {
if (this.isObject) {
return Object.keys(this.json).map(key => (key ? key : '""'));

3
public/app/core/components/sidemenu/BottomNavLinks.tsx
View File

@ -47,7 +47,8 @@ class BottomNavLinks extends PureComponent<Props> {
<div className="sidemenu-org-switcher__org-current">Current Org:</div>
</div>
<div className="sidemenu-org-switcher__switch">
<i className="fa fa-fw fa-random" />Switch
<i className="fa fa-fw fa-random" />
Switch
</div>
</a>
</li>

3
public/app/core/components/sidemenu/SideMenu.tsx
View File

@ -29,7 +29,8 @@ export class SideMenu extends PureComponent {
<div className="sidemenu__logo_small_breakpoint" onClick={this.toggleSideMenuSmallBreakpoint} key="hamburger">
<i className="fa fa-bars" />
<span className="sidemenu__close">
<i className="fa fa-times" />&nbsp;Close
<i className="fa fa-times" />
&nbsp;Close
</span>
</div>,
<TopSection key="topsection" />,

2
public/app/core/utils/explore.ts
View File

@ -153,7 +153,7 @@ export function buildQueryTransaction(
};
}
export const clearQueryKeys: ((query: DataQuery) => object) = ({ key, refId, ...rest }) => rest;
export const clearQueryKeys: (query: DataQuery) => object = ({ key, refId, ...rest }) => rest;
const isMetricSegment = (segment: { [key: string]: string }) => segment.hasOwnProperty('expr');
const isUISegment = (segment: { [key: string]: string }) => segment.hasOwnProperty('ui');

2
public/app/core/utils/kbn.ts
View File

@ -143,7 +143,7 @@ kbn.secondsToHhmmss = seconds => {
};
kbn.to_percent = (nr, outof) => {
return Math.floor(nr / outof * 10000) / 100 + '%';
return Math.floor((nr / outof) * 10000) / 100 + '%';
};
kbn.addslashes = str => {

7
public/app/features/alerting/AlertRuleList.tsx
View File

@ -149,4 +149,9 @@ const mapDispatchToProps = {
togglePauseAlertRule,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(AlertRuleList));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(AlertRuleList)
);

7
public/app/features/api-keys/ApiKeysPage.tsx
View File

@ -263,4 +263,9 @@ const mapDispatchToProps = {
addApiKey,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(ApiKeysPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(ApiKeysPage)
);

2
public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss
View File

@ -32,7 +32,7 @@
.add-panel-widget__title {
font-size: $font-size-md;
font-weight: $font-weight-semi-bold;
margin-right: $spacer*2;
margin-right: $spacer * 2;
}
.add-panel-widget__link {

5
public/app/features/dashboard/components/DashNav/DashNav.tsx
View File

@ -267,4 +267,7 @@ const mapDispatchToProps = {
updateLocation,
};
export default connect(mapStateToProps, mapDispatchToProps)(DashNav);
export default connect(
mapStateToProps,
mapDispatchToProps
)(DashNav);

7
public/app/features/dashboard/containers/DashboardPage.tsx
View File

@ -306,4 +306,9 @@ const mapDispatchToProps = {
updateLocation,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(DashboardPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(DashboardPage)
);

7
public/app/features/dashboard/containers/SoloPanelPage.tsx
View File

@ -107,4 +107,9 @@ const mapDispatchToProps = {
initDashboard,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(SoloPanelPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(SoloPanelPage)
);

29
public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx
View File

@ -49,21 +49,20 @@ export class PanelHeaderCorner extends Component<Props> {
return (
<div className="markdown-html">
<div dangerouslySetInnerHTML={{ __html: remarkableInterpolatedMarkdown }} />
{panel.links &&
panel.links.length > 0 && (
<ul className="text-left">
{panel.links.map((link, idx) => {
const info = linkSrv.getPanelLinkAnchorInfo(link, panel.scopedVars);
return (
<li key={idx}>
<a className="panel-menu-link" href={info.href} target={info.target}>
{info.title}
</a>
</li>
);
})}
</ul>
)}
{panel.links && panel.links.length > 0 && (
<ul className="text-left">
{panel.links.map((link, idx) => {
const info = linkSrv.getPanelLinkAnchorInfo(link, panel.scopedVars);
return (
<li key={idx}>
<a className="panel-menu-link" href={info.href} target={info.target}>
{info.title}
</a>
</li>
);
})}
</ul>
)}
</div>
);
};

3
public/app/features/dashboard/panel_editor/QueriesTab.tsx
View File

@ -176,7 +176,7 @@ export class QueriesTab extends PureComponent<Props, State> {
};
render() {
const { panel } = this.props;
const { panel, dashboard } = this.props;
const { currentDS, scrollTop } = this.state;
const queryInspector: EditorToolbarView = {
@ -205,6 +205,7 @@ export class QueriesTab extends PureComponent<Props, State> {
dataSourceValue={query.datasource || panel.datasource}
key={query.refId}
panel={panel}
dashboard={dashboard}
query={query}
onChange={query => this.onQueryChange(query, index)}
onRemoveQuery={this.onRemoveQuery}

6
public/app/features/dashboard/panel_editor/QueryEditorRow.tsx
View File

@ -12,10 +12,12 @@ import { getTimeSrv } from 'app/features/dashboard/services/TimeSrv';
// Types
import { PanelModel } from '../state/PanelModel';
import { DataQuery, DataSourceApi, TimeRange } from '@grafana/ui';
import { DashboardModel } from '../state/DashboardModel';
interface Props {
panel: PanelModel;
query: DataQuery;
dashboard: DashboardModel;
onAddQuery: (query?: DataQuery) => void;
onRemoveQuery: (query: DataQuery) => void;
onMoveQuery: (query: DataQuery, direction: number) => void;
@ -83,13 +85,14 @@ export class QueryEditorRow extends PureComponent<Props, State> {
};
getAngularQueryComponentScope(): AngularQueryComponentScope {
const { panel, query } = this.props;
const { panel, query, dashboard } = this.props;
const { datasource } = this.state;
return {
datasource: datasource,
target: query,
panel: panel,
dashboard: dashboard,
refresh: () => panel.refresh(),
render: () => panel.render(),
events: panel.events,
@ -265,6 +268,7 @@ export class QueryEditorRow extends PureComponent<Props, State> {
export interface AngularQueryComponentScope {
target: DataQuery;
panel: PanelModel;
dashboard: DashboardModel;
events: Emitter;
refresh: () => void;
render: () => void;

4
public/app/features/dashboard/services/TimeSrv.ts
View File

@ -227,8 +227,8 @@ export class TimeSrv {
const timespan = range.to.valueOf() - range.from.valueOf();
const center = range.to.valueOf() - timespan / 2;
const to = center + timespan * factor / 2;
const from = center - timespan * factor / 2;
const to = center + (timespan * factor) / 2;
const from = center - (timespan * factor) / 2;
this.setTime({ from: moment.utc(from), to: moment.utc(to) });
}

2
public/app/features/dashboard/state/DashboardMigrator.ts
View File

@ -487,7 +487,7 @@ export class DashboardMigrator {
for (const panel of row.panels) {
panel.span = panel.span || DEFAULT_PANEL_SPAN;
if (panel.minSpan) {
panel.minSpan = Math.min(GRID_COLUMN_COUNT, GRID_COLUMN_COUNT / 12 * panel.minSpan);
panel.minSpan = Math.min(GRID_COLUMN_COUNT, (GRID_COLUMN_COUNT / 12) * panel.minSpan);
}
const panelWidth = Math.floor(panel.span) * widthFactor;
const panelHeight = panel.height ? getGridHeight(panel.height) : rowGridHeight;

7
public/app/features/datasources/DataSourceDashboards.tsx
View File

@ -98,4 +98,9 @@ const mapDispatchToProps = {
removeDashboard,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(DataSourceDashboards));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(DataSourceDashboards)
);

7
public/app/features/datasources/DataSourcesListPage.tsx
View File

@ -115,4 +115,9 @@ const mapDispatchToProps = {
setDataSourcesLayoutMode,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(DataSourcesListPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(DataSourcesListPage)
);

7
public/app/features/datasources/NewDataSourcePage.tsx
View File

@ -80,4 +80,9 @@ const mapDispatchToProps = {
setDataSourceTypeSearchQuery,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(NewDataSourcePage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(NewDataSourcePage)
);

7
public/app/features/datasources/settings/DataSourceSettingsPage.tsx
View File

@ -259,4 +259,9 @@ const mapDispatchToProps = {
setIsDefault,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(DataSourceSettingsPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(DataSourceSettingsPage)
);

78
public/app/features/explore/Explore.tsx
View File

@ -200,43 +200,42 @@ export class Explore extends React.PureComponent<ExploreProps> {
</div>
)}
{datasourceInstance &&
!datasourceError && (
<div className="explore-container">
<QueryRows exploreEvents={this.exploreEvents} exploreId={exploreId} queryKeys={queryKeys} />
<AutoSizer onResize={this.onResize} disableHeight>
{({ width }) => {
if (width === 0) {
return null;
}
{datasourceInstance && !datasourceError && (
<div className="explore-container">
<QueryRows exploreEvents={this.exploreEvents} exploreId={exploreId} queryKeys={queryKeys} />
<AutoSizer onResize={this.onResize} disableHeight>
{({ width }) => {
if (width === 0) {
return null;
}
return (
<main className="m-t-2" style={{ width }}>
<ErrorBoundary>
{showingStartPage && <StartPage onClickExample={this.onClickExample} />}
{!showingStartPage && (
<>
{supportsGraph && !supportsLogs && <GraphContainer width={width} exploreId={exploreId} />}
{supportsTable && <TableContainer exploreId={exploreId} onClickCell={this.onClickLabel} />}
{supportsLogs && (
<LogsContainer
width={width}
exploreId={exploreId}
onChangeTime={this.onChangeTime}
onClickLabel={this.onClickLabel}
onStartScanning={this.onStartScanning}
onStopScanning={this.onStopScanning}
/>
)}
</>
)}
</ErrorBoundary>
</main>
);
}}
</AutoSizer>
</div>
)}
return (
<main className="m-t-2" style={{ width }}>
<ErrorBoundary>
{showingStartPage && <StartPage onClickExample={this.onClickExample} />}
{!showingStartPage && (
<>
{supportsGraph && !supportsLogs && <GraphContainer width={width} exploreId={exploreId} />}
{supportsTable && <TableContainer exploreId={exploreId} onClickCell={this.onClickLabel} />}
{supportsLogs && (
<LogsContainer
width={width}
exploreId={exploreId}
onChangeTime={this.onChangeTime}
onClickLabel={this.onClickLabel}
onStartScanning={this.onStartScanning}
onStopScanning={this.onStopScanning}
/>
)}
</>
)}
</ErrorBoundary>
</main>
);
}}
</AutoSizer>
</div>
)}
</div>
);
}
@ -287,4 +286,9 @@ const mapDispatchToProps = {
setQueries,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(Explore));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(Explore)
);

7
public/app/features/explore/ExploreToolbar.tsx
View File

@ -193,4 +193,9 @@ const mapDispatchToProps: DispatchProps = {
split: splitOpen,
};
export const ExploreToolbar = hot(module)(connect(mapStateToProps, mapDispatchToProps)(UnConnectedExploreToolbar));
export const ExploreToolbar = hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(UnConnectedExploreToolbar)
);

32
public/app/features/explore/Graph.tsx
View File

@ -217,11 +217,13 @@ export class Graph extends PureComponent<GraphProps, GraphState> {
let series = [{ data: [[0, 0]] }];
if (data && data.length > 0) {
series = data.filter((ts: TimeSeries) => !hiddenSeries.has(ts.alias)).map((ts: TimeSeries) => ({
color: ts.color,
label: ts.label,
data: ts.getFlotPairs('null'),
}));
series = data
.filter((ts: TimeSeries) => !hiddenSeries.has(ts.alias))
.map((ts: TimeSeries) => ({
color: ts.color,
label: ts.label,
data: ts.getFlotPairs('null'),
}));
}
this.dynamicOptions = this.getDynamicOptions();
@ -242,17 +244,15 @@ export class Graph extends PureComponent<GraphProps, GraphState> {
return (
<>
{this.props.data &&
this.props.data.length > MAX_NUMBER_OF_TIME_SERIES &&
!this.state.showAllTimeSeries && (
<div className="time-series-disclaimer">
<i className="fa fa-fw fa-warning disclaimer-icon" />
{`Showing only ${MAX_NUMBER_OF_TIME_SERIES} time series. `}
<span className="show-all-time-series" onClick={this.onShowAllTimeSeries}>{`Show all ${
this.props.data.length
}`}</span>
</div>
)}
{this.props.data && this.props.data.length > MAX_NUMBER_OF_TIME_SERIES && !this.state.showAllTimeSeries && (
<div className="time-series-disclaimer">
<i className="fa fa-fw fa-warning disclaimer-icon" />
{`Showing only ${MAX_NUMBER_OF_TIME_SERIES} time series. `}
<span className="show-all-time-series" onClick={this.onShowAllTimeSeries}>{`Show all ${
this.props.data.length
}`}</span>
</div>
)}
<div id={id} className="explore-graph" style={{ height }} />
<Legend data={data} hiddenSeries={hiddenSeries} onToggleSeries={this.onToggleSeries} />
</>

7
public/app/features/explore/GraphContainer.tsx
View File

@ -70,4 +70,9 @@ const mapDispatchToProps = {
changeTime,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(GraphContainer));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(GraphContainer)
);

4
public/app/features/explore/LogLabelStats.tsx
View File

@ -60,7 +60,9 @@ export class LogLabelStats extends PureComponent<Props> {
<span className="logs-stats__close fa fa-remove" onClick={onClickClose} />
</div>
<div className="logs-stats__body">
{topRows.map(stat => <LogLabelStatsRow key={stat.value} {...stat} active={stat.value === value} />)}
{topRows.map(stat => (
<LogLabelStatsRow key={stat.value} {...stat} active={stat.value === value} />
))}
{insertActiveRow && activeRow && <LogLabelStatsRow key={activeRow.value} {...activeRow} active />}
{otherCount > 0 && (
<LogLabelStatsRow key="__OTHERS__" count={otherCount} value="Other" proportion={otherProportion} />

17
public/app/features/explore/LogMessageAnsi.tsx
View File

@ -61,15 +61,14 @@ export class LogMessageAnsi extends PureComponent<Props, State> {
render() {
const { chunks } = this.state;
return chunks.map(
(chunk, index) =>
chunk.style ? (
<span key={index} style={chunk.style}>
{chunk.text}
</span>
) : (
chunk.text
)
return chunks.map((chunk, index) =>
chunk.style ? (
<span key={index} style={chunk.style}>
{chunk.text}
</span>
) : (
chunk.text
)
);
}
}

37
public/app/features/explore/LogRow.tsx
View File

@ -161,26 +161,23 @@ export class LogRow extends PureComponent<Props, State> {
)}
<div className="logs-row__message" onMouseEnter={this.onMouseOverMessage} onMouseLeave={this.onMouseOutMessage}>
{containsAnsiCodes && <LogMessageAnsi value={row.entry} />}
{!containsAnsiCodes &&
parsed && (
<Highlighter
autoEscape
highlightTag={FieldHighlight(this.onClickHighlight)}
textToHighlight={row.entry}
searchWords={parsedFieldHighlights}
highlightClassName="logs-row__field-highlight"
/>
)}
{!containsAnsiCodes &&
!parsed &&
needsHighlighter && (
<Highlighter
textToHighlight={row.entry}
searchWords={highlights}
findChunks={findHighlightChunksInText}
highlightClassName={highlightClassName}
/>
)}
{!containsAnsiCodes && parsed && (
<Highlighter
autoEscape
highlightTag={FieldHighlight(this.onClickHighlight)}
textToHighlight={row.entry}
searchWords={parsedFieldHighlights}
highlightClassName="logs-row__field-highlight"
/>
)}
{!containsAnsiCodes && !parsed && needsHighlighter && (
<Highlighter
textToHighlight={row.entry}
searchWords={highlights}
findChunks={findHighlightChunksInText}
highlightClassName={highlightClassName}
/>
)}
{!containsAnsiCodes && !parsed && !needsHighlighter && row.entry}
{showFieldStats && (
<div className="logs-row__stats">

39
public/app/features/explore/Logs.tsx
View File

@ -237,17 +237,16 @@ export default class Logs extends PureComponent<Props, State> {
</div>
</div>
{hasData &&
meta && (
<div className="logs-panel-meta">
{meta.map(item => (
<div className="logs-panel-meta__item" key={item.label}>
<span className="logs-panel-meta__label">{item.label}:</span>
<span className="logs-panel-meta__value">{renderMetaItem(item.value, item.kind)}</span>
</div>
))}
</div>
)}
{hasData && meta && (
<div className="logs-panel-meta">
{meta.map(item => (
<div className="logs-panel-meta__item" key={item.label}>
<span className="logs-panel-meta__label">{item.label}:</span>
<span className="logs-panel-meta__value">{renderMetaItem(item.value, item.kind)}</span>
</div>
))}
</div>
)}
<div className="logs-rows">
{hasData &&
@ -282,16 +281,14 @@ export default class Logs extends PureComponent<Props, State> {
))}
{hasData && deferLogs && <span>Rendering {dedupedData.rows.length} rows...</span>}
</div>
{!loading &&
!hasData &&
!scanning && (
<div className="logs-panel-nodata">
No logs found.
<a className="link" onClick={this.onClickScan}>
Scan for older logs
</a>
</div>
)}
{!loading && !hasData && !scanning && (
<div className="logs-panel-nodata">
No logs found.
<a className="link" onClick={this.onClickScan}>
Scan for older logs
</a>
</div>
)}
{scanning && (
<div className="logs-panel-nodata">

7
public/app/features/explore/LogsContainer.tsx
View File

@ -127,4 +127,9 @@ const mapDispatchToProps = {
toggleLogLevelAction,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(LogsContainer));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(LogsContainer)
);

7
public/app/features/explore/QueryRow.tsx
View File

@ -169,4 +169,9 @@ const mapDispatchToProps = {
runQueries,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(QueryRow));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(QueryRow)
);

7
public/app/features/explore/TableContainer.tsx
View File

@ -51,4 +51,9 @@ const mapDispatchToProps = {
toggleTable,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(TableContainer));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(TableContainer)
);

7
public/app/features/explore/Wrapper.tsx
View File

@ -82,4 +82,9 @@ const mapDispatchToProps = {
resetExploreAction,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(Wrapper));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(Wrapper)
);

7
public/app/features/folders/FolderPermissions.tsx
View File

@ -132,4 +132,9 @@ const mapDispatchToProps = {
addFolderPermission,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(FolderPermissions));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(FolderPermissions)
);

7
public/app/features/folders/FolderSettingsPage.tsx
View File

@ -113,4 +113,9 @@ const mapDispatchToProps = {
deleteFolder,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(FolderSettingsPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(FolderSettingsPage)
);

7
public/app/features/org/OrgDetailsPage.tsx
View File

@ -65,4 +65,9 @@ const mapDispatchToProps = {
updateOrganization,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(OrgDetailsPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(OrgDetailsPage)
);

7
public/app/features/plugins/PluginListPage.tsx
View File

@ -81,4 +81,9 @@ const mapDispatchToProps = {
setPluginsSearchQuery,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(PluginListPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(PluginListPage)
);

42
public/app/features/plugins/plugin_component.ts
View File

@ -136,27 +136,29 @@ function pluginDirectiveLoader($compile, datasourceSrv, $rootScope, $q, $http, $
// Datasource ConfigCtrl
case 'datasource-config-ctrl': {
const dsMeta = scope.ctrl.datasourceMeta;
return importPluginModule(dsMeta.module).then((dsModule): any => {
if (!dsModule.ConfigCtrl) {
return { notFound: true };
return importPluginModule(dsMeta.module).then(
(dsModule): any => {
if (!dsModule.ConfigCtrl) {
return { notFound: true };
}
scope.$watch(
'ctrl.current',
() => {
scope.onModelChanged(scope.ctrl.current);
},
true
);
return {
baseUrl: dsMeta.baseUrl,
name: 'ds-config-' + dsMeta.id,
bindings: { meta: '=', current: '=' },
attrs: { meta: 'ctrl.datasourceMeta', current: 'ctrl.current' },
Component: dsModule.ConfigCtrl,
};
}
scope.$watch(
'ctrl.current',
() => {
scope.onModelChanged(scope.ctrl.current);
},
true
);
return {
baseUrl: dsMeta.baseUrl,
name: 'ds-config-' + dsMeta.id,
bindings: { meta: '=', current: '=' },
attrs: { meta: 'ctrl.datasourceMeta', current: 'ctrl.current' },
Component: dsModule.ConfigCtrl,
};
});
);
}
// AppConfigCtrl
case 'app-config-ctrl': {

42
public/app/features/teams/TeamGroupSync.tsx
View File

@ -116,26 +116,25 @@ export class TeamGroupSync extends PureComponent<Props, State> {
</div>
</SlideDown>
{groups.length === 0 &&
!isAdding && (
<div className="empty-list-cta">
<div className="empty-list-cta__title">There are no external groups to sync with</div>
<button onClick={this.onToggleAdding} className="empty-list-cta__button btn btn-xlarge btn-primary">
<i className="gicon gicon-add-team" />
Add Group
</button>
<div className="empty-list-cta__pro-tip">
<i className="fa fa-rocket" /> {headerTooltip}
<a
className="text-link empty-list-cta__pro-tip-link"
href="http://docs.grafana.org/auth/enhanced_ldap/"
target="_blank"
>
Learn more
</a>
</div>
{groups.length === 0 && !isAdding && (
<div className="empty-list-cta">
<div className="empty-list-cta__title">There are no external groups to sync with</div>
<button onClick={this.onToggleAdding} className="empty-list-cta__button btn btn-xlarge btn-primary">
<i className="gicon gicon-add-team" />
Add Group
</button>
<div className="empty-list-cta__pro-tip">
<i className="fa fa-rocket" /> {headerTooltip}
<a
className="text-link empty-list-cta__pro-tip-link"
href="http://docs.grafana.org/auth/enhanced_ldap/"
target="_blank"
>
Learn more
</a>
</div>
)}
</div>
)}
{groups.length > 0 && (
<div className="admin-list-table">
@ -167,4 +166,7 @@ const mapDispatchToProps = {
removeTeamGroup,
};
export default connect(mapStateToProps, mapDispatchToProps)(TeamGroupSync);
export default connect(
mapStateToProps,
mapDispatchToProps
)(TeamGroupSync);

7
public/app/features/teams/TeamList.tsx
View File

@ -161,4 +161,9 @@ const mapDispatchToProps = {
setSearchQuery,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(TeamList));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(TeamList)
);

9
public/app/features/teams/TeamMembers.tsx
View File

@ -62,7 +62,9 @@ export class TeamMembers extends PureComponent<Props, State> {
return (
<td>
{labels.map(label => <TagBadge key={label} label={label} removeIcon={false} count={0} onClick={() => {}} />)}
{labels.map(label => (
<TagBadge key={label} label={label} removeIcon={false} count={0} onClick={() => {}} />
))}
</td>
);
}
@ -156,4 +158,7 @@ const mapDispatchToProps = {
setSearchMemberQuery,
};
export default connect(mapStateToProps, mapDispatchToProps)(TeamMembers);
export default connect(
mapStateToProps,
mapDispatchToProps
)(TeamMembers);

7
public/app/features/teams/TeamPages.tsx
View File

@ -108,4 +108,9 @@ const mapDispatchToProps = {
loadTeam,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(TeamPages));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(TeamPages)
);

5
public/app/features/teams/TeamSettings.tsx
View File

@ -98,4 +98,7 @@ const mapDispatchToProps = {
updateTeam,
};
export default connect(mapStateToProps, mapDispatchToProps)(TeamSettings);
export default connect(
mapStateToProps,
mapDispatchToProps
)(TeamSettings);

16
public/app/features/templating/variable_srv.ts
View File

@ -54,15 +54,17 @@ export class VariableSrv {
onTimeRangeUpdated(timeRange: TimeRange) {
this.templateSrv.updateTimeRange(timeRange);
const promises = this.variables.filter(variable => variable.refresh === 2).map(variable => {
const previousOptions = variable.options.slice();
const promises = this.variables
.filter(variable => variable.refresh === 2)
.map(variable => {
const previousOptions = variable.options.slice();
return variable.updateOptions().then(() => {
if (angular.toJson(previousOptions) !== angular.toJson(variable.options)) {
this.dashboard.templateVariableValueUpdated();
}
return variable.updateOptions().then(() => {
if (angular.toJson(previousOptions) !== angular.toJson(variable.options)) {
this.dashboard.templateVariableValueUpdated();
}
});
});
});
return this.$q.all(promises).then(() => {
this.dashboard.startRefresh();

9
public/app/features/users/InviteeRow.tsx
View File

@ -52,6 +52,9 @@ const mapDispatchToProps = {
revokeInvite,
};
export default connect(() => {
return {};
}, mapDispatchToProps)(InviteeRow);
export default connect(
() => {
return {};
},
mapDispatchToProps
)(InviteeRow);

5
public/app/features/users/UsersActionBar.tsx
View File

@ -92,4 +92,7 @@ const mapDispatchToProps = {
setUsersSearchQuery,
};
export default connect(mapStateToProps, mapDispatchToProps)(UsersActionBar);
export default connect(
mapStateToProps,
mapDispatchToProps
)(UsersActionBar);

7
public/app/features/users/UsersListPage.tsx
View File

@ -138,4 +138,9 @@ const mapDispatchToProps = {
removeUser,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(UsersListPage));
export default hot(module)(
connect(
mapStateToProps,
mapDispatchToProps
)(UsersListPage)
);

3
public/app/plugins/datasource/grafana-azure-monitor-datasource/annotations_query_ctrl.ts
View File

@ -4,7 +4,8 @@ export class AzureMonitorAnnotationsQueryCtrl {
annotation: any;
workspaces: any[];
defaultQuery = '<your table>\n| where $__timeFilter() \n| project TimeGenerated, Text=YourTitleColumn, Tags="tag1,tag2"';
defaultQuery =
'<your table>\n| where $__timeFilter() \n| project TimeGenerated, Text=YourTitleColumn, Tags="tag1,tag2"';
/** @ngInject */
constructor() {

4
public/app/plugins/datasource/grafana-azure-monitor-datasource/editor/query_field.tsx
View File

@ -311,8 +311,8 @@ class QueryField extends React.Component<any, any> {
let selectedIndex = Math.max(this.state.typeaheadIndex, 0);
const flattenedSuggestions = flattenSuggestions(suggestions);
selectedIndex = selectedIndex % flattenedSuggestions.length || 0;
const selectedKeys = (flattenedSuggestions.length > 0 ? [flattenedSuggestions[selectedIndex]] : []).map(
i => (typeof i === 'object' ? i.text : i)
const selectedKeys = (flattenedSuggestions.length > 0 ? [flattenedSuggestions[selectedIndex]] : []).map(i =>
typeof i === 'object' ? i.text : i
);
// Create typeahead in DOM root so we can later position it absolutely

110
public/app/plugins/datasource/graphite/FunctionEditor.tsx Normal file
View File

@ -0,0 +1,110 @@
import React from 'react';
import { PopperController, Popper } from '@grafana/ui';
import rst2html from 'rst2html';
import { FunctionDescriptor, FunctionEditorControlsProps, FunctionEditorControls } from './FunctionEditorControls';
interface FunctionEditorProps extends FunctionEditorControlsProps {
func: FunctionDescriptor;
}
interface FunctionEditorState {
showingDescription: boolean;
}
class FunctionEditor extends React.PureComponent<FunctionEditorProps, FunctionEditorState> {
private triggerRef = React.createRef<HTMLSpanElement>();
constructor(props: FunctionEditorProps) {
super(props);
this.state = {
showingDescription: false,
};
}
renderContent = ({ updatePopperPosition }) => {
const {
onMoveLeft,
onMoveRight,
func: {
def: { name, description },
},
} = this.props;
const { showingDescription } = this.state;
if (showingDescription) {
return (
<div style={{ overflow: 'auto', maxHeight: '30rem', textAlign: 'left', fontWeight: 'normal' }}>
<h4 style={{ color: 'white' }}> {name} </h4>
<div
dangerouslySetInnerHTML={{
__html: rst2html(description),
}}
/>
</div>
);
}
return (
<FunctionEditorControls
{...this.props}
onMoveLeft={() => {
onMoveLeft(this.props.func);
updatePopperPosition();
}}
onMoveRight={() => {
onMoveRight(this.props.func);
updatePopperPosition();
}}
onDescriptionShow={() => {
this.setState({ showingDescription: true }, () => {
updatePopperPosition();
});
}}
/>
);
};
render() {
return (
<PopperController content={this.renderContent} placement="top" hideAfter={300}>
{(showPopper, hidePopper, popperProps) => {
return (
<>
{this.triggerRef && (
<Popper
{...popperProps}
referenceElement={this.triggerRef.current}
wrapperClassName="popper"
className="popper__background"
onMouseLeave={() => {
this.setState({ showingDescription: false });
hidePopper();
}}
onMouseEnter={showPopper}
renderArrow={({ arrowProps, placement }) => (
<div className="popper__arrow" data-placement={placement} {...arrowProps} />
)}
/>
)}
<span
ref={this.triggerRef}
onClick={popperProps.show ? hidePopper : showPopper}
onMouseLeave={() => {
hidePopper();
this.setState({ showingDescription: false });
}}
style={{ cursor: 'pointer' }}
>
{this.props.func.def.name}
</span>
</>
);
}}
</PopperController>
);
}
}
export { FunctionEditor };

65
public/app/plugins/datasource/graphite/FunctionEditorControls.tsx Normal file
View File

@ -0,0 +1,65 @@
import React from 'react';
export interface FunctionDescriptor {
text: string;
params: string[];
def: {
category: string;
defaultParams: string[];
description?: string;
fake: boolean;
name: string;
params: string[];
};
}
export interface FunctionEditorControlsProps {
onMoveLeft: (func: FunctionDescriptor) => void;
onMoveRight: (func: FunctionDescriptor) => void;
onRemove: (func: FunctionDescriptor) => void;
}
const FunctionHelpButton = (props: { description: string; name: string; onDescriptionShow: () => void }) => {
if (props.description) {
return <span className="pointer fa fa-question-circle" onClick={props.onDescriptionShow} />;
}
return (
<span
className="pointer fa fa-question-circle"
onClick={() => {
window.open(
'http://graphite.readthedocs.org/en/latest/functions.html#graphite.render.functions.' + props.name,
'_blank'
);
}}
/>
);
};
export const FunctionEditorControls = (
props: FunctionEditorControlsProps & {
func: FunctionDescriptor;
onDescriptionShow: () => void;
}
) => {
const { func, onMoveLeft, onMoveRight, onRemove, onDescriptionShow } = props;
return (
<div
style={{
display: 'flex',
width: '60px',
justifyContent: 'space-between',
}}
>
<span className="pointer fa fa-arrow-left" onClick={() => onMoveLeft(func)} />
<FunctionHelpButton
name={func.def.name}
description={func.def.description}
onDescriptionShow={onDescriptionShow}
/>
<span className="pointer fa fa-remove" onClick={() => onRemove(func)} />
<span className="pointer fa fa-arrow-right" onClick={() => onMoveRight(func)} />
</div>
);
};

107
public/app/plugins/datasource/graphite/func_editor.ts
View File

@ -1,33 +1,42 @@
import _ from 'lodash';
import $ from 'jquery';
import rst2html from 'rst2html';
import coreModule from 'app/core/core_module';
/** @ngInject */
export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
const funcSpanTemplate = '<a ng-click="">{{func.def.name}}</a><span>(</span>';
const funcSpanTemplate = `
<function-editor
func="func"
onRemove="ctrl.handleRemoveFunction"
onMoveLeft="ctrl.handleMoveLeft"
onMoveRight="ctrl.handleMoveRight"
/><span>(</span>
`;
const paramTemplate =
'<input type="text" style="display:none"' + ' class="input-small tight-form-func-param"></input>';
const funcControlsTemplate = `
<div class="tight-form-func-controls">
<span class="pointer fa fa-arrow-left"></span>
<span class="pointer fa fa-question-circle"></span>
<span class="pointer fa fa-remove" ></span>
<span class="pointer fa fa-arrow-right"></span>
</div>`;
return {
restrict: 'A',
link: function postLink($scope, elem) {
const $funcLink = $(funcSpanTemplate);
const $funcControls = $(funcControlsTemplate);
const ctrl = $scope.ctrl;
const func = $scope.func;
let scheduledRelink = false;
let paramCountAtLink = 0;
let cancelBlur = null;
ctrl.handleRemoveFunction = func => {
ctrl.removeFunction(func);
};
ctrl.handleMoveLeft = func => {
ctrl.moveFunction(func, -1);
};
ctrl.handleMoveRight = func => {
ctrl.moveFunction(func, 1);
};
function clickFuncParam(this: any, paramIndex) {
/*jshint validthis:true */
@ -158,24 +167,7 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
};
}
function toggleFuncControls() {
const targetDiv = elem.closest('.tight-form');
if (elem.hasClass('show-function-controls')) {
elem.removeClass('show-function-controls');
targetDiv.removeClass('has-open-function');
$funcControls.hide();
return;
}
elem.addClass('show-function-controls');
targetDiv.addClass('has-open-function');
$funcControls.show();
}
function addElementsAndCompile() {
$funcControls.appendTo(elem);
$funcLink.appendTo(elem);
const defParams = _.clone(func.def.params);
@ -245,69 +237,10 @@ export function graphiteFuncEditor($compile, templateSrv, popoverSrv) {
}
}
function registerFuncControlsToggle() {
$funcLink.click(toggleFuncControls);
}
function registerFuncControlsActions() {
$funcControls.click(e => {
const $target = $(e.target);
if ($target.hasClass('fa-remove')) {
toggleFuncControls();
$scope.$apply(() => {
ctrl.removeFunction($scope.func);
});
return;
}
if ($target.hasClass('fa-arrow-left')) {
$scope.$apply(() => {
_.move(ctrl.queryModel.functions, $scope.$index, $scope.$index - 1);
ctrl.targetChanged();
});
return;
}
if ($target.hasClass('fa-arrow-right')) {
$scope.$apply(() => {
_.move(ctrl.queryModel.functions, $scope.$index, $scope.$index + 1);
ctrl.targetChanged();
});
return;
}
if ($target.hasClass('fa-question-circle')) {
const funcDef = ctrl.datasource.getFuncDef(func.def.name);
if (funcDef && funcDef.description) {
popoverSrv.show({
element: e.target,
position: 'bottom left',
classNames: 'drop-popover drop-function-def',
template: `
<div style="overflow:auto;max-height:30rem;">
<h4> ${funcDef.name} </h4>
${rst2html(funcDef.description)}
</div>`,
openOn: 'click',
});
} else {
window.open(
'http://graphite.readthedocs.org/en/latest/functions.html#graphite.render.functions.' + func.def.name,
'_blank'
);
}
return;
}
});
}
function relink() {
elem.children().remove();
addElementsAndCompile();
ifJustAddedFocusFirstParam();
registerFuncControlsToggle();
registerFuncControlsActions();
}
relink();

5
public/app/plugins/datasource/graphite/graphite_query.ts
View File

@ -154,6 +154,11 @@ export default class GraphiteQuery {
this.functions = _.without(this.functions, func);
}
moveFunction(func, offset) {
const index = this.functions.indexOf(func);
_.move(this.functions, index, index + offset);
}
updateModelTarget(targets) {
// render query
if (!this.target.textEditor) {

5
public/app/plugins/datasource/graphite/query_ctrl.ts
View File

@ -272,6 +272,11 @@ export class GraphiteQueryCtrl extends QueryCtrl {
this.targetChanged();
}
moveFunction(func, offset) {
this.queryModel.moveFunction(func, offset);
this.targetChanged();
}
addSeriesByTagFunc(tag) {
const newFunc = this.datasource.createFuncInstance('seriesByTag', {
withDefaultParams: false,

68
public/app/plugins/datasource/influxdb/datasource.ts
View File

@ -78,46 +78,48 @@ export default class InfluxDatasource {
// replace templated variables
allQueries = this.templateSrv.replace(allQueries, scopedVars);
return this._seriesQuery(allQueries, options).then((data): any => {
if (!data || !data.results) {
return [];
}
const seriesList = [];
for (i = 0; i < data.results.length; i++) {
const result = data.results[i];
if (!result || !result.series) {
continue;
return this._seriesQuery(allQueries, options).then(
(data): any => {
if (!data || !data.results) {
return [];
}
const target = queryTargets[i];
let alias = target.alias;
if (alias) {
alias = this.templateSrv.replace(target.alias, options.scopedVars);
}
const influxSeries = new InfluxSeries({
series: data.results[i].series,
alias: alias,
});
switch (target.resultFormat) {
case 'table': {
seriesList.push(influxSeries.getTable());
break;
const seriesList = [];
for (i = 0; i < data.results.length; i++) {
const result = data.results[i];
if (!result || !result.series) {
continue;
}
default: {
const timeSeries = influxSeries.getTimeSeries();
for (y = 0; y < timeSeries.length; y++) {
seriesList.push(timeSeries[y]);
const target = queryTargets[i];
let alias = target.alias;
if (alias) {
alias = this.templateSrv.replace(target.alias, options.scopedVars);
}
const influxSeries = new InfluxSeries({
series: data.results[i].series,
alias: alias,
});
switch (target.resultFormat) {
case 'table': {
seriesList.push(influxSeries.getTable());
break;
}
default: {
const timeSeries = influxSeries.getTimeSeries();
for (y = 0; y < timeSeries.length; y++) {
seriesList.push(timeSeries[y]);
}
break;
}
break;
}
}
}
return { data: seriesList };
});
return { data: seriesList };
}
);
}
annotationQuery(options) {

20
public/app/plugins/datasource/prometheus/components/PromQueryField.tsx
View File

@ -38,15 +38,17 @@ export function groupMetricsByPrefix(metrics: string[], delimiter = '_'): Cascad
const metricsOptions = _.chain(metrics)
.filter(metric => !ruleRegex.test(metric))
.groupBy(metric => metric.split(delimiter)[0])
.map((metricsForPrefix: string[], prefix: string): CascaderOption => {
const prefixIsMetric = metricsForPrefix.length === 1 && metricsForPrefix[0] === prefix;
const children = prefixIsMetric ? [] : metricsForPrefix.sort().map(m => ({ label: m, value: m }));
return {
children,
label: prefix,
value: prefix,
};
})
.map(
(metricsForPrefix: string[], prefix: string): CascaderOption => {
const prefixIsMetric = metricsForPrefix.length === 1 && metricsForPrefix[0] === prefix;
const children = prefixIsMetric ? [] : metricsForPrefix.sort().map(m => ({ label: m, value: m }));
return {
children,
label: prefix,
value: prefix,
};
}
)
.sortBy('label')
.value();

16
public/app/plugins/datasource/prometheus/datasource.ts
View File

@ -487,13 +487,15 @@ export function alignRange(start, end, step) {
export function extractRuleMappingFromGroups(groups: any[]) {
return groups.reduce(
(mapping, group) =>
group.rules.filter(rule => rule.type === 'recording').reduce(
(acc, rule) => ({
...acc,
[rule.name]: rule.query,
}),
mapping
),
group.rules
.filter(rule => rule.type === 'recording')
.reduce(
(acc, rule) => ({
...acc,
[rule.name]: rule.query,
}),
mapping
),
{}
);
}

14
public/app/plugins/datasource/stackdriver/components/Help.tsx
View File

@ -57,18 +57,18 @@ export class Help extends React.Component<Props, State> {
<div className="gf-form-label gf-form-label--grow" />
</div>
</div>
{rawQuery &&
displaRawQuery && (
<div className="gf-form">
<pre className="gf-form-pre">{rawQuery}</pre>
</div>
)}
{rawQuery && displaRawQuery && (
<div className="gf-form">
<pre className="gf-form-pre">{rawQuery}</pre>
</div>
)}
{displayHelp && (
<div className="gf-form grafana-info-box" style={{ padding: 0 }}>
<pre className="gf-form-pre alert alert-info" style={{ marginRight: 0 }}>
<h5>Alias Patterns</h5>Format the legend keys any way you want by using alias patterns. Format the legend
keys any way you want by using alias patterns.<br /> <br />
keys any way you want by using alias patterns.
<br /> <br />
Example:
<code>{`${'{{metricDescriptor.name}} - {{metricDescriptor.label.instance_name}}'}`}</code>
<br />

28
public/app/plugins/datasource/stackdriver/components/Metrics.tsx
View File

@ -92,12 +92,14 @@ export class Metrics extends React.Component<Props, State> {
if (!selectedMetricDescriptor) {
return [];
}
const metricsByService = metricDescriptors.filter(m => m.service === selectedMetricDescriptor.service).map(m => ({
service: m.service,
value: m.type,
label: m.displayName,
description: m.description,
}));
const metricsByService = metricDescriptors
.filter(m => m.service === selectedMetricDescriptor.service)
.map(m => ({
service: m.service,
value: m.type,
label: m.displayName,
description: m.description,
}));
return metricsByService;
}
@ -105,12 +107,14 @@ export class Metrics extends React.Component<Props, State> {
const { metricDescriptors } = this.state;
const { templateSrv, metricType } = this.props;
const metrics = metricDescriptors.filter(m => m.service === templateSrv.replace(service)).map(m => ({
service: m.service,
value: m.type,
label: m.displayName,
description: m.description,
}));
const metrics = metricDescriptors
.filter(m => m.service === templateSrv.replace(service))
.map(m => ({
service: m.service,
value: m.type,
label: m.displayName,
description: m.description,
}));
this.setState({ service, metrics });

8
public/app/plugins/datasource/stackdriver/components/VariableQueryEditor.tsx
View File

@ -58,7 +58,7 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
metricTypes,
selectedMetricType,
metricDescriptors,
...await this.getLabels(selectedMetricType),
...(await this.getLabels(selectedMetricType)),
};
this.setState(state);
}
@ -66,7 +66,7 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
async onQueryTypeChange(event) {
const state: any = {
selectedQueryType: event.target.value,
...await this.getLabels(this.state.selectedMetricType, event.target.value),
...(await this.getLabels(this.state.selectedMetricType, event.target.value)),
};
this.setState(state);
}
@ -82,13 +82,13 @@ export class StackdriverVariableQueryEditor extends PureComponent<VariableQueryP
selectedService: event.target.value,
metricTypes,
selectedMetricType,
...await this.getLabels(selectedMetricType),
...(await this.getLabels(selectedMetricType)),
};
this.setState(state);
}
async onMetricTypeChange(event) {
const state: any = { selectedMetricType: event.target.value, ...await this.getLabels(event.target.value) };
const state: any = { selectedMetricType: event.target.value, ...(await this.getLabels(event.target.value)) };
this.setState(state);
}

2
public/app/plugins/panel/graph/graph.ts
View File

@ -532,7 +532,7 @@ class GraphElement {
// Expand ticks for pretty view
min = Math.floor(min / tickStep) * tickStep;
// 1.01 is 101% - ensure we have enough space for last bar
max = Math.ceil(max * 1.01 / tickStep) * tickStep;
max = Math.ceil((max * 1.01) / tickStep) * tickStep;
ticks = [];
for (let i = min; i <= max; i += tickStep) {

3
public/app/plugins/panel/heatmap/color_legend.ts
View File

@ -173,8 +173,7 @@ function drawLegendValues(elem, colorScale, rangeFrom, rangeTo, maxValue, minVal
const posY = getSvgElemHeight(legendElem) + LEGEND_VALUE_MARGIN;
const posX = getSvgElemX(colorRect);
d3
.select(legendElem.get(0))
d3.select(legendElem.get(0))
.append('g')
.attr('class', 'axis')
.attr('transform', 'translate(' + posX + ',' + posY + ')')

4
public/app/plugins/panel/heatmap/heatmap_tooltip.ts
View File

@ -205,10 +205,10 @@ export class HeatmapTooltip {
let barWidth;
if (this.panel.yAxis.logBase === 1) {
barWidth = Math.floor(HISTOGRAM_WIDTH / (max - min) * yBucketSize * 0.9);
barWidth = Math.floor((HISTOGRAM_WIDTH / (max - min)) * yBucketSize * 0.9);
} else {
const barNumberFactor = yBucketSize ? yBucketSize : 1;
barWidth = Math.floor(HISTOGRAM_WIDTH / ticks / barNumberFactor * 0.9);
barWidth = Math.floor((HISTOGRAM_WIDTH / ticks / barNumberFactor) * 0.9);
}
barWidth = Math.max(barWidth, 1);

3
public/app/plugins/panel/heatmap/rendering.ts
View File

@ -570,8 +570,7 @@ export class HeatmapRenderer {
}
resetCardHighLight(event) {
d3
.select(event.target)
d3.select(event.target)
.style('fill', this.tooltip.originalFillColor)
.style('stroke', this.tooltip.originalFillColor)
.style('stroke-width', 0);

92
public/sass/_variables.scss
View File

@ -14,12 +14,31 @@ $spacer: 1rem !default;
$spacer-x: $spacer !default;
$spacer-y: $spacer !default;
$spacers: (
0: (x: 0, y: 0),
1: (x: $spacer-x, y: $spacer-y),
2: (x: ($spacer-x * 1.5), y: ($spacer-y * 1.5)),
3: (x: ($spacer-x * 3), y: ($spacer-y * 3))
)
!default;
0: (
x: 0,
y: 0,
),
1: (
x: $spacer-x,
y: $spacer-y,
),
2: (
x: (
$spacer-x * 1.5,
),
y: (
$spacer-y * 1.5,
),
),
3: (
x: (
$spacer-x * 3,
),
y: (
$spacer-y * 3,
),
),
) !default;
$border-width: 1px !default;
// Grid breakpoints
@ -27,13 +46,24 @@ $border-width: 1px !default;
// Define the minimum and maximum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries.
$grid-breakpoints: (xs: 0, sm: 544px, md: 768px, lg: 992px, xl: 1200px) !default;
$grid-breakpoints: (
xs: 0,
sm: 544px,
md: 768px,
lg: 992px,
xl: 1200px,
) !default;
// Grid containers
//
// Define the maximum width of `.container` for different screen sizes.
$container-max-widths: (sm: 576px, md: 720px, lg: 940px, xl: 1080px) !default;
$container-max-widths: (
sm: 576px,
md: 720px,
lg: 940px,
xl: 1080px,
) !default;
// Grid columns
//
@ -100,7 +130,7 @@ $line-height-sm: 1.5 !default;
$border-radius: 3px !default;
$border-radius-lg: 5px !default;
$border-radius-sm: 2px!default;
$border-radius-sm: 2px !default;
// Page
@ -143,12 +173,9 @@ $gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default;
// Form validation icons
$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E")
!default;
$form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E")
!default;
$form-icon-danger: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E")
!default;
$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default;
$form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E") !default;
$form-icon-danger: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E") !default;
// Z-index master list
// -------------------------
@ -191,19 +218,38 @@ $panel-margin: 10px;
$dashboard-padding: $panel-margin * 2;
$panel-horizontal-padding: 10;
$panel-vertical-padding: 5;
$panel-padding: 0px $panel-horizontal-padding+0px $panel-vertical-padding+0px $panel-horizontal-padding+0px;
$panel-padding: 0px $panel-horizontal-padding + 0px $panel-vertical-padding + 0px $panel-horizontal-padding + 0px;
// tabs
$tabs-padding: 10px 15px 9px;
$external-services: (
github: (bgColor: #464646, borderColor: #393939, icon: ''),
gitlab: (bgColor: #fc6d26, borderColor: #e24329, icon: ''),
google: (bgColor: #e84d3c, borderColor: #b83e31, icon: ''),
grafanacom: (bgColor: #262628, borderColor: #393939, icon: ''),
oauth: (bgColor: #262628, borderColor: #393939, icon: '')
)
!default;
github: (
bgColor: #464646,
borderColor: #393939,
icon: '',
),
gitlab: (
bgColor: #fc6d26,
borderColor: #e24329,
icon: '',
),
google: (
bgColor: #e84d3c,
borderColor: #b83e31,
icon: '',
),
grafanacom: (
bgColor: #262628,
borderColor: #393939,
icon: '',
),
oauth: (
bgColor: #262628,
borderColor: #393939,
icon: '',
),
) !default;
:export {
panelhorizontalpadding: $panel-horizontal-padding;

2
public/sass/base/_forms.scss
View File

@ -31,7 +31,7 @@ input,
button,
select,
textarea {
@include font-shorthand($font-size-base,normal,$line-height-base); // Set size, weight, line-height here
@include font-shorthand($font-size-base, normal, $line-height-base); // Set size, weight, line-height here
}
input,
button,

4
public/sass/base/_type.scss
View File

@ -357,14 +357,14 @@ a.external-link {
ul,
ol {
padding-left: $spacer*1.5;
padding-left: $spacer * 1.5;
margin-bottom: $spacer;
}
table {
td,
th {
padding: $spacer*0.5 $spacer;
padding: $spacer * 0.5 $spacer;
}
th {
font-weight: $font-weight-semi-bold;

2
public/sass/components/_cards.scss
View File

@ -35,7 +35,7 @@
}
.card-section {
margin-bottom: $spacer*2;
margin-bottom: $spacer * 2;
}
.card-list {

4
public/sass/components/_dashboard_settings.scss
View File

@ -53,7 +53,7 @@
.dashboard-settings__header {
font-size: $font-size-h3;
margin-bottom: $spacer*2;
margin-bottom: $spacer * 2;
}
.dashboard-settings__subheader {
@ -89,7 +89,7 @@
flex-direction: column;
height: 100%;
flex-grow: 1;
margin: $spacer*3 $spacer*2 0 0;
margin: $spacer * 3 $spacer * 2 0 0;
button {
margin-bottom: 10px;

6
public/sass/components/_empty_list_cta.scss
View File

@ -1,7 +1,7 @@
.empty-list-cta {
background-color: $empty-list-cta-bg;
text-align: center;
padding: $spacer*2;
padding: $spacer * 2;
border-radius: $border-radius;
.grafana-info-box {
@ -11,12 +11,12 @@
}
.empty-list-cta__title {
padding-bottom: $spacer*3;
padding-bottom: $spacer * 3;
font-style: italic;
}
.empty-list-cta__button {
margin-bottom: $spacer*3;
margin-bottom: $spacer * 3;
}
.empty-list-cta__pro-tip-link {

8
public/sass/components/_gf-form.scss
View File

@ -226,7 +226,7 @@ $input-border: 1px solid $input-border-color;
}
&--dropdown {
padding-right: $input-padding-x*2;
padding-right: $input-padding-x * 2;
&::after {
position: absolute;
@ -276,7 +276,7 @@ $input-border: 1px solid $input-border-color;
& + .gf-form-input {
position: relative;
z-index: 2;
padding-left: $input-padding-x*3;
padding-left: $input-padding-x * 3;
background-color: transparent;
option {
@ -293,7 +293,7 @@ $input-border: 1px solid $input-border-color;
select.gf-form-input {
text-indent: 0.01px;
text-overflow: '';
padding-right: $input-padding-x*3;
padding-right: $input-padding-x * 3;
appearance: none;
&:-moz-focusring {
@ -321,7 +321,7 @@ $input-border: 1px solid $input-border-color;
&--has-help-icon {
&::after {
right: $input-padding-x*3;
right: $input-padding-x * 3;
}
}
}

8
public/sass/components/_modals.scss
View File

@ -24,7 +24,7 @@
z-index: $zindex-modal;
width: 100%;
background: $page-bg;
@include box-shadow(0 3px 7px rgba(0,0,0,0.3));
@include box-shadow(0 3px 7px rgba(0, 0, 0, 0.3));
@include background-clip(padding-box);
outline: none;
@ -47,7 +47,7 @@
font-size: $font-size-h3;
float: left;
padding-top: $spacer * 0.75;
margin: 0 $spacer*3 0 $spacer*1.5;
margin: 0 $spacer * 3 0 $spacer * 1.5;
.gicon {
position: relative;
@ -66,7 +66,7 @@
}
.modal-content {
padding: $spacer*2;
padding: $spacer * 2;
&--has-scroll {
max-height: calc(100vh - 400px);
@ -105,7 +105,7 @@
.confirm-modal-text {
font-size: $font-size-h4;
color: $link-color;
margin-bottom: $spacer*2;
margin-bottom: $spacer * 2;
padding-top: $spacer;
}

2
public/sass/components/_panel_editor.scss
View File

@ -21,7 +21,7 @@
}
.panel-editor-container__editor {
margin-top: $panel-margin*2;
margin-top: $panel-margin * 2;
display: flex;
flex-direction: row;
flex: 1 1 0;

2
public/sass/components/_panel_gettingstarted.scss
View File

@ -57,7 +57,7 @@ $path-position: $marker-size-half - ($path-height / 2);
z-index: 1;
top: $path-position;
bottom: $path-position;
right: - $marker-size-half;
right: -$marker-size-half;
width: 100%;
height: $path-height;
border-top: 2px solid $progress-color-grey-light;

4
public/sass/components/_panel_logs.scss
View File

@ -6,7 +6,7 @@ $column-horizontal-spacing: 10px;
padding: $panel-padding;
padding-top: 10px;
border-radius: $border-radius;
margin: 2*$panel-margin 0 $panel-margin;
margin: 2 * $panel-margin 0 $panel-margin;
border: $panel-border;
flex-direction: column;
}
@ -18,7 +18,7 @@ $column-horizontal-spacing: 10px;
flex-wrap: wrap;
> * {
margin-right: $spacer*2;
margin-right: $spacer * 2;
}
}

1
public/sass/components/_panel_text.scss
View File

@ -1 +0,0 @@

1
public/sass/components/_query_editor.scss
View File

@ -50,7 +50,6 @@ input[type='text'].tight-form-func-param {
}
.tight-form-func-controls {
display: none;
text-align: center;
.fa-arrow-left {

4
public/sass/components/_search.scss
View File

@ -77,7 +77,7 @@
.search-filter-box {
background: $search-filter-box-bg;
border-radius: 2px;
padding: $spacer*1.5;
padding: $spacer * 1.5;
min-width: 340px;
margin-bottom: $spacer * 1.5;
}
@ -259,7 +259,7 @@
.search-button-row {
text-align: center;
padding: $spacer*2 $spacer;
padding: $spacer * 2 $spacer;
background: $panel-bg;
}

4
public/sass/components/_tabbed_view.scss
View File

@ -20,7 +20,7 @@
.tabbed-view-title {
float: left;
padding-top: 0.5rem;
margin: 0 $spacer*3 0 0;
margin: 0 $spacer * 3 0 0;
}
.tabbed-view-panel-title {
@ -45,7 +45,7 @@
}
.tabbed-view-body {
padding: $spacer*2 $spacer $spacer $spacer;
padding: $spacer * 2 $spacer $spacer $spacer;
display: flex;
flex-direction: column;
flex: 1;

2
public/sass/components/edit_sidemenu.scss
View File

@ -9,7 +9,7 @@
}
.edit-sidemenu-aside {
margin-right: $spacer*2;
margin-right: $spacer * 2;
}
.edit-sidemenu {

8
public/sass/layout/_page.scss
View File

@ -39,8 +39,8 @@
width: 100%;
margin-left: auto;
margin-right: auto;
padding-left: $spacer*2;
padding-right: $spacer*2;
padding-left: $spacer * 2;
padding-right: $spacer * 2;
max-width: 980px;
@include clearfix();
}
@ -93,7 +93,7 @@
}
.page-body {
padding-top: $spacer*2;
padding-top: $spacer * 2;
}
.page-heading {
@ -164,5 +164,5 @@
}
.page-sidebar-section {
margin-bottom: $spacer*2;
margin-bottom: $spacer * 2;
}

2
public/sass/mixins/_buttons.scss
View File

@ -1,6 +1,6 @@
// Button backgrounds
// ------------------
@mixin buttonBackground($startColor, $endColor, $text-color: #fff, $textShadow: 0px 1px 0 rgba(0,0,0,0.1)) {
@mixin buttonBackground($startColor, $endColor, $text-color: #fff, $textShadow: 0px 1px 0 rgba(0, 0, 0, 0.1)) {
// gradientBar will set the background to a pleasing blend of these, to support IE<=9
@include gradientBar($startColor, $endColor, $text-color, $textShadow);

10
public/sass/mixins/_drop_element.scss
View File

@ -41,7 +41,7 @@
&:before {
top: 100%;
left: 50%;
margin-left: - $popover-arrow-size;
margin-left: -$popover-arrow-size;
border-top-color: $border-color;
}
}
@ -52,7 +52,7 @@
&:before {
bottom: 100%;
left: 50%;
margin-left: - $popover-arrow-size;
margin-left: -$popover-arrow-size;
border-bottom-color: $border-color;
}
}
@ -63,7 +63,7 @@
&:before {
left: 100%;
top: 50%;
margin-top: - $popover-arrow-size;
margin-top: -$popover-arrow-size;
border-left-color: $border-color;
}
}
@ -74,14 +74,14 @@
&:before {
right: 100%;
top: 50%;
margin-top: - $popover-arrow-size;
margin-top: -$popover-arrow-size;
border-right-color: $border-color;
}
}
// Target middle/center, element corner
&.drop-element-attached-left.drop-target-attached-center .drop-content {
left: - $popover-arrow-size * 2;
left: -$popover-arrow-size * 2;
}
&.drop-element-attached-right.drop-target-attached-center .drop-content {

2
public/sass/mixins/_mixins.scss
View File

@ -278,7 +278,7 @@
}
// Gradient Bar Colors for buttons and alerts
@mixin gradientBar($primaryColor, $secondaryColor, $text-color: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,0.25)) {
@mixin gradientBar($primaryColor, $secondaryColor, $text-color: #fff, $textShadow: 0 -1px 0 rgba(0, 0, 0, 0.25)) {
color: $text-color;
text-shadow: $textShadow;
@include gradient-vertical($primaryColor, $secondaryColor);

2
public/sass/pages/_explore.scss
View File

@ -452,7 +452,7 @@
// TODO Experimental
.cheat-sheet-item {
margin: 2*$panel-margin 0;
margin: 2 * $panel-margin 0;
width: 50%;
}

8
yarn.lock
View File

@ -13500,10 +13500,10 @@ preserve@^0.2.0:
resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
integrity sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=
prettier@1.9.2:
version "1.9.2"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.9.2.tgz#96bc2132f7a32338e6078aeb29727178c6335827"
integrity sha512-piXx9N2WT8hWb7PBbX1glAuJVIkEyUV9F5fMXFINpZ0x3otVOFKKeGmeuiclFJlP/UrgTckyV606VjH2rNK4bw==
prettier@1.16.4:
version "1.16.4"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.4.tgz#73e37e73e018ad2db9c76742e2647e21790c9717"
integrity sha512-ZzWuos7TI5CKUeQAtFd6Zhm2s6EpAD/ZLApIhsF9pRvRtM1RFo61dM/4MSRUA0SuLugA/zgrZD8m0BaY46Og7g==
prettier@^1.12.1:
version "1.16.1"