From f95359fb344ca94545d9d234cf7c43c289448358 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Wed, 19 Dec 2018 12:58:10 +0100 Subject: [PATCH 01/42] Notify user on query error --- .../features/dashboard/dashgrid/DataPanel.tsx | 20 +++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/public/app/features/dashboard/dashgrid/DataPanel.tsx b/public/app/features/dashboard/dashgrid/DataPanel.tsx index 9926410f40d..72f405dcbe7 100644 --- a/public/app/features/dashboard/dashgrid/DataPanel.tsx +++ b/public/app/features/dashboard/dashgrid/DataPanel.tsx @@ -1,5 +1,6 @@ // Library import React, { Component } from 'react'; +import Tooltip from 'app/core/components/Tooltip/Tooltip'; // Services import { getDatasourceSrv, DatasourceSrv } from 'app/features/plugins/datasource_srv'; @@ -138,7 +139,7 @@ export class DataPanel extends Component { const timeSeries = response.data; if (isFirstLoad && loading === LoadingState.Loading) { - return this.renderLoadingSpinner(); + return this.renderLoadingState(); } if (!queries.length) { @@ -151,7 +152,7 @@ export class DataPanel extends Component { return ( <> - {this.renderLoadingSpinner()} + {this.renderLoadingState()} {this.props.children({ timeSeries, loading, @@ -160,15 +161,26 @@ export class DataPanel extends Component { ); } - private renderLoadingSpinner(): JSX.Element { + private renderLoadingState(): JSX.Element { const { loading } = this.state; - if (loading === LoadingState.Loading) { return (
); + } else if (loading === LoadingState.Error) { + return ( + + + + + ); } return null; From 1eca81139b6b7f27fabd692a910c52d5f1335b55 Mon Sep 17 00:00:00 2001 From: Michael Inthilith Date: Fri, 4 Jan 2019 15:57:34 +0100 Subject: [PATCH 02/42] Fix stackdriver aggregation series merge Fixes #14581 --- public/app/plugins/datasource/stackdriver/constants.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/public/app/plugins/datasource/stackdriver/constants.ts b/public/app/plugins/datasource/stackdriver/constants.ts index b11f4a1bcb1..b77e1be7b4b 100644 --- a/public/app/plugins/datasource/stackdriver/constants.ts +++ b/public/app/plugins/datasource/stackdriver/constants.ts @@ -158,25 +158,25 @@ export const aggOptions = [ text: 'min', value: 'REDUCE_MIN', valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY], - metricKinds: [MetricKind.GAUGE, MetricKind.DELTA], + metricKinds: [MetricKind.GAUGE, MetricKind.DELTA, MetricKind.CUMULATIVE, MetricKind.METRIC_KIND_UNSPECIFIED], }, { text: 'max', value: 'REDUCE_MAX', valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY], - metricKinds: [MetricKind.GAUGE, MetricKind.DELTA], + metricKinds: [MetricKind.GAUGE, MetricKind.DELTA, MetricKind.CUMULATIVE, MetricKind.METRIC_KIND_UNSPECIFIED], }, { text: 'sum', value: 'REDUCE_SUM', valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY, ValueTypes.DISTRIBUTION], - metricKinds: [MetricKind.GAUGE, MetricKind.DELTA], + metricKinds: [MetricKind.GAUGE, MetricKind.DELTA, MetricKind.CUMULATIVE, MetricKind.METRIC_KIND_UNSPECIFIED], }, { text: 'std. dev.', value: 'REDUCE_STDDEV', valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY, ValueTypes.DISTRIBUTION], - metricKinds: [MetricKind.GAUGE, MetricKind.DELTA], + metricKinds: [MetricKind.GAUGE, MetricKind.DELTA, MetricKind.CUMULATIVE, MetricKind.METRIC_KIND_UNSPECIFIED], }, { text: 'count', From 9759ee53ca4ac48202c8d1bedea92138c66f2945 Mon Sep 17 00:00:00 2001 From: Michael Inthilith Date: Fri, 4 Jan 2019 16:58:27 +0100 Subject: [PATCH 03/42] Add mean on distribution as well --- public/app/plugins/datasource/stackdriver/constants.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/app/plugins/datasource/stackdriver/constants.ts b/public/app/plugins/datasource/stackdriver/constants.ts index b77e1be7b4b..49ac5131f0d 100644 --- a/public/app/plugins/datasource/stackdriver/constants.ts +++ b/public/app/plugins/datasource/stackdriver/constants.ts @@ -151,7 +151,7 @@ export const aggOptions = [ { text: 'mean', value: 'REDUCE_MEAN', - valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY], + valueTypes: [ValueTypes.INT64, ValueTypes.DOUBLE, ValueTypes.MONEY, ValueTypes.DISTRIBUTION], metricKinds: [MetricKind.GAUGE, MetricKind.DELTA], }, { From 64163f019895248812dd5ec128cda5946f5d3e33 Mon Sep 17 00:00:00 2001 From: jaken551 Date: Sun, 6 Jan 2019 15:21:58 -0500 Subject: [PATCH 04/42] 14722 - removing unnecessary arn check that breaks assume role feature in other AWS partitions --- pkg/tsdb/cloudwatch/credentials.go | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/pkg/tsdb/cloudwatch/credentials.go b/pkg/tsdb/cloudwatch/credentials.go index 165f8fdbe97..fb92c827f7c 100644 --- a/pkg/tsdb/cloudwatch/credentials.go +++ b/pkg/tsdb/cloudwatch/credentials.go @@ -3,7 +3,6 @@ package cloudwatch import ( "fmt" "os" - "strings" "sync" "time" @@ -43,7 +42,7 @@ func GetCredentials(dsInfo *DatasourceInfo) (*credentials.Credentials, error) { secretAccessKey := "" sessionToken := "" var expiration *time.Time = nil - if dsInfo.AuthType == "arn" && strings.Index(dsInfo.AssumeRoleArn, "arn:aws:iam:") == 0 { + if dsInfo.AuthType == "arn" { params := &sts.AssumeRoleInput{ RoleArn: aws.String(dsInfo.AssumeRoleArn), RoleSessionName: aws.String("GrafanaSession"), From 5143a2669dcf7a118bd0283f6ba0ce310a927711 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Mon, 7 Jan 2019 13:05:27 +0100 Subject: [PATCH 05/42] feat: Add "theme" to Tooltip --- public/app/core/components/Tooltip/Popper.tsx | 12 +++++++-- .../core/components/Tooltip/withPopper.tsx | 3 ++- .../features/dashboard/dashgrid/DataPanel.tsx | 8 +++--- public/sass/_variables.dark.scss | 6 +++-- public/sass/_variables.light.scss | 6 +++-- public/sass/components/_popper.scss | 26 ++++++++++++------- 6 files changed, 42 insertions(+), 19 deletions(-) diff --git a/public/app/core/components/Tooltip/Popper.tsx b/public/app/core/components/Tooltip/Popper.tsx index 36cf0fe837e..d5ea1d93091 100644 --- a/public/app/core/components/Tooltip/Popper.tsx +++ b/public/app/core/components/Tooltip/Popper.tsx @@ -21,13 +21,21 @@ interface Props { placement?: any; content: string | ((props: any) => JSX.Element); refClassName?: string; + theme?: string; +} + +export enum Themes { + Default = 'popper__background--default', + Error = 'popper__background--error', } class Popper extends PureComponent { render() { - const { children, renderContent, show, placement, refClassName } = this.props; + const { children, renderContent, show, placement, refClassName, theme } = this.props; const { content } = this.props; + const popperBackgroundClassName = 'popper__background' + (theme ? ' ' + theme : ''); + return ( @@ -53,7 +61,7 @@ class Popper extends PureComponent { data-placement={placement} className="popper" > -
+
{renderContent(content)}
diff --git a/public/app/core/components/Tooltip/withPopper.tsx b/public/app/core/components/Tooltip/withPopper.tsx index 4ba05937531..7be12748247 100644 --- a/public/app/core/components/Tooltip/withPopper.tsx +++ b/public/app/core/components/Tooltip/withPopper.tsx @@ -9,6 +9,7 @@ export interface UsingPopperProps { content: string | ((props: any) => JSX.Element); className?: string; refClassName?: string; + theme?: string; } interface Props { @@ -16,6 +17,7 @@ interface Props { className?: string; refClassName?: string; content: string | ((props: any) => JSX.Element); + theme?: string; } interface State { @@ -71,7 +73,6 @@ export default function withPopper(WrappedComponent) { render() { const { show, placement } = this.state; const className = this.props.className || ''; - return ( { const timeSeries = response.data; if (isFirstLoad && loading === LoadingState.Loading) { - return this.renderLoadingState(); + return this.renderLoadingStates(); } if (!queries.length) { @@ -152,7 +153,7 @@ export class DataPanel extends Component { return ( <> - {this.renderLoadingState()} + {this.renderLoadingStates()} {this.props.children({ timeSeries, loading, @@ -161,7 +162,7 @@ export class DataPanel extends Component { ); } - private renderLoadingState(): JSX.Element { + private renderLoadingStates(): JSX.Element { const { loading } = this.state; if (loading === LoadingState.Loading) { return ( @@ -176,6 +177,7 @@ export class DataPanel extends Component { className="popper__manager--block" refClassName={`panel-info-corner panel-info-corner--error`} placement="bottom-start" + theme={Themes.Error} > diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index 70db51a0fb2..8769164d5ec 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -302,12 +302,14 @@ $popover-error-bg: $btn-danger-bg; // Tooltips and popovers // ------------------------- $tooltipColor: $popover-help-color; -$tooltipBackground: $popover-help-bg; $tooltipArrowWidth: 5px; -$tooltipArrowColor: $tooltipBackground; $tooltipLinkColor: $link-color; $graph-tooltip-bg: $dark-1; +$tooltipBackground: $popover-help-bg; +$tooltipArrowColor: $tooltipBackground; +$tooltipBackgroundError: $brand-danger; + // images $checkboxImageUrl: '../img/checkbox.png'; diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index 6afd087a849..be2d05e2441 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -307,12 +307,14 @@ $popover-error-bg: $btn-danger-bg; // Tooltips and popovers // ------------------------- $tooltipColor: $popover-help-color; -$tooltipBackground: $popover-help-bg; $tooltipArrowWidth: 5px; -$tooltipArrowColor: $tooltipBackground; $tooltipLinkColor: lighten($popover-help-color, 5%); $graph-tooltip-bg: $gray-5; +$tooltipBackground: $popover-help-bg; +$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip +$tooltipBackgroundError: $brand-danger; + // images $checkboxImageUrl: '../img/checkbox_white.png'; diff --git a/public/sass/components/_popper.scss b/public/sass/components/_popper.scss index d869d52b92f..afa629d4043 100644 --- a/public/sass/components/_popper.scss +++ b/public/sass/components/_popper.scss @@ -8,7 +8,22 @@ $popper-margin-from-ref: 5px; text-align: center; } -.popper .popper__arrow { +.popper__background { + background: $tooltipBackground; + border-radius: $border-radius; + box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); + padding: 10px; + + // Themes + &.popper__background--error { + background: $tooltipBackgroundError; + .popper__arrow { + border-color: $tooltipBackgroundError; + } + } +} + +.popper__arrow { width: 0; height: 0; border-style: solid; @@ -16,17 +31,10 @@ $popper-margin-from-ref: 5px; margin: 0px; } -.popper .popper__arrow { +.popper__arrow { border-color: $tooltipBackground; } -.popper__background { - background: $tooltipBackground; - border-radius: $border-radius; - box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); - padding: 10px; -} - // Top .popper[data-placement^='top'] { padding-bottom: $popper-margin-from-ref; From dadbaccfeb0bef811129fd07acfcba286832cd3b Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Wed, 19 Dec 2018 12:58:10 +0100 Subject: [PATCH 06/42] Notify user on query error --- .../features/dashboard/dashgrid/DataPanel.tsx | 20 +++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/public/app/features/dashboard/dashgrid/DataPanel.tsx b/public/app/features/dashboard/dashgrid/DataPanel.tsx index 30a939b50aa..7d752da95a8 100644 --- a/public/app/features/dashboard/dashgrid/DataPanel.tsx +++ b/public/app/features/dashboard/dashgrid/DataPanel.tsx @@ -1,5 +1,6 @@ // Library import React, { Component } from 'react'; +import Tooltip from 'app/core/components/Tooltip/Tooltip'; // Services import { getDatasourceSrv, DatasourceSrv } from 'app/features/plugins/datasource_srv'; @@ -139,7 +140,7 @@ export class DataPanel extends Component { const timeSeries = response.data; if (isFirstLoad && loading === LoadingState.Loading) { - return this.renderLoadingSpinner(); + return this.renderLoadingState(); } if (!queries.length) { @@ -152,7 +153,7 @@ export class DataPanel extends Component { return ( <> - {this.renderLoadingSpinner()} + {this.renderLoadingState()} {this.props.children({ timeSeries, loading, @@ -161,15 +162,26 @@ export class DataPanel extends Component { ); } - private renderLoadingSpinner(): JSX.Element { + private renderLoadingState(): JSX.Element { const { loading } = this.state; - if (loading === LoadingState.Loading) { return (
); + } else if (loading === LoadingState.Error) { + return ( + + + + + ); } return null; From 79fd8a7eda2e53685f52129175ce15e35af273fe Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Mon, 7 Jan 2019 13:05:27 +0100 Subject: [PATCH 07/42] feat: Add "theme" to Tooltip --- public/app/core/components/Tooltip/Popper.tsx | 12 +++++++-- .../core/components/Tooltip/withPopper.tsx | 3 ++- .../features/dashboard/dashgrid/DataPanel.tsx | 8 +++--- public/sass/_variables.dark.scss | 6 +++-- public/sass/_variables.light.scss | 6 +++-- public/sass/components/_popper.scss | 26 ++++++++++++------- 6 files changed, 42 insertions(+), 19 deletions(-) diff --git a/public/app/core/components/Tooltip/Popper.tsx b/public/app/core/components/Tooltip/Popper.tsx index 36cf0fe837e..d5ea1d93091 100644 --- a/public/app/core/components/Tooltip/Popper.tsx +++ b/public/app/core/components/Tooltip/Popper.tsx @@ -21,13 +21,21 @@ interface Props { placement?: any; content: string | ((props: any) => JSX.Element); refClassName?: string; + theme?: string; +} + +export enum Themes { + Default = 'popper__background--default', + Error = 'popper__background--error', } class Popper extends PureComponent { render() { - const { children, renderContent, show, placement, refClassName } = this.props; + const { children, renderContent, show, placement, refClassName, theme } = this.props; const { content } = this.props; + const popperBackgroundClassName = 'popper__background' + (theme ? ' ' + theme : ''); + return ( @@ -53,7 +61,7 @@ class Popper extends PureComponent { data-placement={placement} className="popper" > -
+
{renderContent(content)}
diff --git a/public/app/core/components/Tooltip/withPopper.tsx b/public/app/core/components/Tooltip/withPopper.tsx index 4ba05937531..7be12748247 100644 --- a/public/app/core/components/Tooltip/withPopper.tsx +++ b/public/app/core/components/Tooltip/withPopper.tsx @@ -9,6 +9,7 @@ export interface UsingPopperProps { content: string | ((props: any) => JSX.Element); className?: string; refClassName?: string; + theme?: string; } interface Props { @@ -16,6 +17,7 @@ interface Props { className?: string; refClassName?: string; content: string | ((props: any) => JSX.Element); + theme?: string; } interface State { @@ -71,7 +73,6 @@ export default function withPopper(WrappedComponent) { render() { const { show, placement } = this.state; const className = this.props.className || ''; - return ( { const timeSeries = response.data; if (isFirstLoad && loading === LoadingState.Loading) { - return this.renderLoadingState(); + return this.renderLoadingStates(); } if (!queries.length) { @@ -153,7 +154,7 @@ export class DataPanel extends Component { return ( <> - {this.renderLoadingState()} + {this.renderLoadingStates()} {this.props.children({ timeSeries, loading, @@ -162,7 +163,7 @@ export class DataPanel extends Component { ); } - private renderLoadingState(): JSX.Element { + private renderLoadingStates(): JSX.Element { const { loading } = this.state; if (loading === LoadingState.Loading) { return ( @@ -177,6 +178,7 @@ export class DataPanel extends Component { className="popper__manager--block" refClassName={`panel-info-corner panel-info-corner--error`} placement="bottom-start" + theme={Themes.Error} > diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index 70db51a0fb2..8769164d5ec 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -302,12 +302,14 @@ $popover-error-bg: $btn-danger-bg; // Tooltips and popovers // ------------------------- $tooltipColor: $popover-help-color; -$tooltipBackground: $popover-help-bg; $tooltipArrowWidth: 5px; -$tooltipArrowColor: $tooltipBackground; $tooltipLinkColor: $link-color; $graph-tooltip-bg: $dark-1; +$tooltipBackground: $popover-help-bg; +$tooltipArrowColor: $tooltipBackground; +$tooltipBackgroundError: $brand-danger; + // images $checkboxImageUrl: '../img/checkbox.png'; diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index 6afd087a849..be2d05e2441 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -307,12 +307,14 @@ $popover-error-bg: $btn-danger-bg; // Tooltips and popovers // ------------------------- $tooltipColor: $popover-help-color; -$tooltipBackground: $popover-help-bg; $tooltipArrowWidth: 5px; -$tooltipArrowColor: $tooltipBackground; $tooltipLinkColor: lighten($popover-help-color, 5%); $graph-tooltip-bg: $gray-5; +$tooltipBackground: $popover-help-bg; +$tooltipArrowColor: $tooltipBackground; // Used by Angular tooltip +$tooltipBackgroundError: $brand-danger; + // images $checkboxImageUrl: '../img/checkbox_white.png'; diff --git a/public/sass/components/_popper.scss b/public/sass/components/_popper.scss index d869d52b92f..afa629d4043 100644 --- a/public/sass/components/_popper.scss +++ b/public/sass/components/_popper.scss @@ -8,7 +8,22 @@ $popper-margin-from-ref: 5px; text-align: center; } -.popper .popper__arrow { +.popper__background { + background: $tooltipBackground; + border-radius: $border-radius; + box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); + padding: 10px; + + // Themes + &.popper__background--error { + background: $tooltipBackgroundError; + .popper__arrow { + border-color: $tooltipBackgroundError; + } + } +} + +.popper__arrow { width: 0; height: 0; border-style: solid; @@ -16,17 +31,10 @@ $popper-margin-from-ref: 5px; margin: 0px; } -.popper .popper__arrow { +.popper__arrow { border-color: $tooltipBackground; } -.popper__background { - background: $tooltipBackground; - border-radius: $border-radius; - box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); - padding: 10px; -} - // Top .popper[data-placement^='top'] { padding-bottom: $popper-margin-from-ref; From 0b89f81609fadab4d60aa0b47ca9c8a8f9124f55 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Mon, 7 Jan 2019 13:56:36 +0100 Subject: [PATCH 08/42] fix: Light theme corner bg color update --- public/sass/_variables.dark.scss | 1 + public/sass/_variables.light.scss | 1 + public/sass/pages/_dashboard.scss | 4 ++-- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index 8769164d5ec..ded17e6ecfe 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -103,6 +103,7 @@ $panel-bg: #212124; $panel-border-color: $dark-1; $panel-border: solid 1px $panel-border-color; $panel-header-hover-bg: $dark-4; +$panel-corner: $panel-bg; // page header $page-header-bg: linear-gradient(90deg, #292a2d, black); diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index be2d05e2441..1e7a2e9cfbe 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -102,6 +102,7 @@ $panel-bg: $white; $panel-border-color: $gray-5; $panel-border: solid 1px $panel-border-color; $panel-header-hover-bg: $gray-6; +$panel-corner: $gray-4; // Page header $page-header-bg: linear-gradient(90deg, $white, $gray-7); diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss index 589012bff3f..81698d396f8 100644 --- a/public/sass/pages/_dashboard.scss +++ b/public/sass/pages/_dashboard.scss @@ -214,7 +214,7 @@ div.flot-text { &--info { display: block; - @include panel-corner-color(lighten($panel-bg, 4%)); + @include panel-corner-color(lighten($panel-corner, 4%)); .fa:before { content: '\f129'; } @@ -222,7 +222,7 @@ div.flot-text { &--links { display: block; - @include panel-corner-color(lighten($panel-bg, 4%)); + @include panel-corner-color(lighten($panel-corner, 4%)); .fa { left: 4px; } From 96be5fe8a341fb4aa5ee59076691ca5bb910d421 Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Mon, 7 Jan 2019 15:07:08 +0100 Subject: [PATCH 09/42] Remove the jump effect on run query button Caused by the return and loading spinner icons having different widths. Used fa-fw helper class to ensure fixed width on icons. Also, made the spacing between icon and button label slightly smaller, as the rotated level-down icon used as return icon has significantly smaller width compared to the loading spinner and it looked oddly far from the label as compared to timepicker's icon --- public/app/features/explore/Explore.tsx | 2 +- public/sass/pages/_explore.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/public/app/features/explore/Explore.tsx b/public/app/features/explore/Explore.tsx index a905034f302..d4d645950c1 100644 --- a/public/app/features/explore/Explore.tsx +++ b/public/app/features/explore/Explore.tsx @@ -944,7 +944,7 @@ export class Explore extends React.PureComponent {
diff --git a/public/sass/pages/_explore.scss b/public/sass/pages/_explore.scss index dd1afea7394..098dae1a4a2 100644 --- a/public/sass/pages/_explore.scss +++ b/public/sass/pages/_explore.scss @@ -160,7 +160,7 @@ } .run-icon { - margin-left: 0.5em; + margin-left: 0.25em; transform: rotate(90deg); } From 4f943687d84c66165511547eb888607c219bbe9f Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 09:55:23 +0100 Subject: [PATCH 10/42] feat: Display error when plot fail to render --- packages/grafana-ui/src/types/panel.ts | 1 + .../src/visualizations/Graph/Graph.tsx | 4 ++- public/app/core/components/Tooltip/Popper.tsx | 12 ++++----- .../core/components/Tooltip/withPopper.tsx | 6 ++--- .../features/dashboard/dashgrid/DataPanel.tsx | 26 ++++++++++++++++--- .../dashboard/dashgrid/PanelChrome.tsx | 4 +-- .../app/plugins/panel/graph2/GraphPanel.tsx | 7 ++--- public/sass/pages/_dashboard.scss | 2 +- 8 files changed, 42 insertions(+), 20 deletions(-) diff --git a/packages/grafana-ui/src/types/panel.ts b/packages/grafana-ui/src/types/panel.ts index 44336555a81..cf808f514de 100644 --- a/packages/grafana-ui/src/types/panel.ts +++ b/packages/grafana-ui/src/types/panel.ts @@ -9,6 +9,7 @@ export interface PanelProps { renderCounter: number; width: number; height: number; + onRenderError: () => void; } export interface PanelOptionsProps { diff --git a/packages/grafana-ui/src/visualizations/Graph/Graph.tsx b/packages/grafana-ui/src/visualizations/Graph/Graph.tsx index 51afb33802d..b3f2120639c 100644 --- a/packages/grafana-ui/src/visualizations/Graph/Graph.tsx +++ b/packages/grafana-ui/src/visualizations/Graph/Graph.tsx @@ -13,6 +13,7 @@ interface GraphProps { showBars?: boolean; width: number; height: number; + onRenderError: () => void; } export class Graph extends PureComponent { @@ -37,7 +38,7 @@ export class Graph extends PureComponent { return; } - const { width, timeSeries, timeRange, showLines, showBars, showPoints } = this.props; + const { width, timeSeries, timeRange, showLines, showBars, showPoints, onRenderError } = this.props; if (!width) { return; @@ -98,6 +99,7 @@ export class Graph extends PureComponent { $.plot(this.element, timeSeries, flotOptions); } catch (err) { console.log('Graph rendering error', err, flotOptions, timeSeries); + onRenderError(); } } diff --git a/public/app/core/components/Tooltip/Popper.tsx b/public/app/core/components/Tooltip/Popper.tsx index d5ea1d93091..65ef510ba8f 100644 --- a/public/app/core/components/Tooltip/Popper.tsx +++ b/public/app/core/components/Tooltip/Popper.tsx @@ -3,6 +3,11 @@ import Portal from 'app/core/components/Portal/Portal'; import { Manager, Popper as ReactPopper, Reference } from 'react-popper'; import Transition from 'react-transition-group/Transition'; +export enum Themes { + Default = 'popper__background--default', + Error = 'popper__background--error', +} + const defaultTransitionStyles = { transition: 'opacity 200ms linear', opacity: 0, @@ -21,12 +26,7 @@ interface Props { placement?: any; content: string | ((props: any) => JSX.Element); refClassName?: string; - theme?: string; -} - -export enum Themes { - Default = 'popper__background--default', - Error = 'popper__background--error', + theme?: Themes; } class Popper extends PureComponent { diff --git a/public/app/core/components/Tooltip/withPopper.tsx b/public/app/core/components/Tooltip/withPopper.tsx index 7be12748247..3766b78f0f6 100644 --- a/public/app/core/components/Tooltip/withPopper.tsx +++ b/public/app/core/components/Tooltip/withPopper.tsx @@ -1,5 +1,5 @@ import React from 'react'; - +import { Themes } from './Popper'; export interface UsingPopperProps { showPopper: (prevState: object) => void; hidePopper: (prevState: object) => void; @@ -9,7 +9,7 @@ export interface UsingPopperProps { content: string | ((props: any) => JSX.Element); className?: string; refClassName?: string; - theme?: string; + theme?: Themes; } interface Props { @@ -17,7 +17,7 @@ interface Props { className?: string; refClassName?: string; content: string | ((props: any) => JSX.Element); - theme?: string; + theme?: Themes; } interface State { diff --git a/public/app/features/dashboard/dashgrid/DataPanel.tsx b/public/app/features/dashboard/dashgrid/DataPanel.tsx index d57b787bf57..4cd9460802a 100644 --- a/public/app/features/dashboard/dashgrid/DataPanel.tsx +++ b/public/app/features/dashboard/dashgrid/DataPanel.tsx @@ -16,6 +16,7 @@ import { Themes } from 'app/core/components/Tooltip/Popper'; interface RenderProps { loading: LoadingState; timeSeries: TimeSeries[]; + onRenderError: () => void; } export interface Props { @@ -35,6 +36,7 @@ export interface Props { export interface State { isFirstLoad: boolean; loading: LoadingState; + errorMessage: string; response: DataQueryResponse; } @@ -53,6 +55,7 @@ export class DataPanel extends Component { this.state = { loading: LoadingState.NotStarted, + errorMessage: '', response: { data: [], }, @@ -92,7 +95,7 @@ export class DataPanel extends Component { return; } - this.setState({ loading: LoadingState.Loading }); + this.setState({ loading: LoadingState.Loading, errorMessage: '' }); try { const ds = await this.dataSourceSrv.get(datasource); @@ -130,10 +133,24 @@ export class DataPanel extends Component { }); } catch (err) { console.log('Loading error', err); - this.setState({ loading: LoadingState.Error, isFirstLoad: false }); + this.onError('Request Error'); } }; + onError = (errorMessage: string) => { + if (this.state.loading !== LoadingState.Error || this.state.errorMessage !== errorMessage) { + this.setState({ + loading: LoadingState.Error, + isFirstLoad: false, + errorMessage: errorMessage + }); + } + } + + onRenderError = () => { + this.onError('Error rendering panel'); + } + render() { const { queries } = this.props; const { response, loading, isFirstLoad } = this.state; @@ -158,13 +175,14 @@ export class DataPanel extends Component { {this.props.children({ timeSeries, loading, + onRenderError: this.onRenderError })} ); } private renderLoadingStates(): JSX.Element { - const { loading } = this.state; + const { loading, errorMessage } = this.state; if (loading === LoadingState.Loading) { return (
@@ -174,7 +192,7 @@ export class DataPanel extends Component { } else if (loading === LoadingState.Error) { return ( { const { datasource, targets, transparent } = panel; const PanelComponent = plugin.exports.Panel; const containerClassNames = `panel-container panel-container--absolute ${transparent ? 'panel-transparent' : ''}`; - return ( {({ width, height }) => { @@ -115,7 +114,7 @@ export class PanelChrome extends PureComponent { widthPixels={width} refreshCounter={refreshCounter} > - {({ loading, timeSeries }) => { + {({ loading, timeSeries, onRenderError }) => { return (
{ width={width} height={height - PANEL_HEADER_HEIGHT} renderCounter={renderCounter} + onRenderError={onRenderError} />
); diff --git a/public/app/plugins/panel/graph2/GraphPanel.tsx b/public/app/plugins/panel/graph2/GraphPanel.tsx index a08276e5179..1a23fba0c27 100644 --- a/public/app/plugins/panel/graph2/GraphPanel.tsx +++ b/public/app/plugins/panel/graph2/GraphPanel.tsx @@ -1,6 +1,6 @@ // Libraries import _ from 'lodash'; -import React, { PureComponent } from 'react'; +import React, { Component } from 'react'; import colors from 'app/core/utils/colors'; // Components & Types @@ -9,13 +9,13 @@ import { Options } from './types'; interface Props extends PanelProps {} -export class GraphPanel extends PureComponent { +export class GraphPanel extends Component { constructor(props) { super(props); } render() { - const { timeSeries, timeRange, width, height } = this.props; + const { timeSeries, timeRange, width, height, onRenderError } = this.props; const { showLines, showBars, showPoints } = this.props.options; const vmSeries = processTimeSeries({ @@ -33,6 +33,7 @@ export class GraphPanel extends PureComponent { showBars={showBars} width={width} height={height} + onRenderError={onRenderError} /> ); } diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss index 81698d396f8..a0ff9fd877c 100644 --- a/public/sass/pages/_dashboard.scss +++ b/public/sass/pages/_dashboard.scss @@ -233,7 +233,7 @@ div.flot-text { &--error { display: block; - color: $text-color; + color: $white; @include panel-corner-color($popover-error-bg); .fa:before { content: '\f12a'; From bcb94cc0ece63fef6c03870d17887d66c12a741a Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 10:30:00 +0100 Subject: [PATCH 11/42] fix: GraphPanel should be a PureComponent --- public/app/plugins/panel/graph2/GraphPanel.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/app/plugins/panel/graph2/GraphPanel.tsx b/public/app/plugins/panel/graph2/GraphPanel.tsx index 1a23fba0c27..49d2ac3e4e4 100644 --- a/public/app/plugins/panel/graph2/GraphPanel.tsx +++ b/public/app/plugins/panel/graph2/GraphPanel.tsx @@ -1,6 +1,6 @@ // Libraries import _ from 'lodash'; -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import colors from 'app/core/utils/colors'; // Components & Types @@ -9,7 +9,7 @@ import { Options } from './types'; interface Props extends PanelProps {} -export class GraphPanel extends Component { +export class GraphPanel extends PureComponent { constructor(props) { super(props); } From 8e8b759b21c26d128e3de24df708d8a41f269973 Mon Sep 17 00:00:00 2001 From: Daniel Lee Date: Tue, 8 Jan 2019 10:47:14 +0100 Subject: [PATCH 12/42] adds note for #13914 and #14581 --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 867253ccd18..671740f7225 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,7 @@ * **Proxy whitelist**: Add CIDR capability to auth_proxy whitelist [#14546](https://github.com/grafana/grafana/issues/14546), thx [@jacobrichard](https://github.com/jacobrichard) * **OAuth**: Support OAuth providers that are not RFC6749 compliant [#14562](https://github.com/grafana/grafana/issues/14562), thx [@tdabasinskas](https://github.com/tdabasinskas) * **Units**: Add blood glucose level units mg/dL and mmol/L [#14519](https://github.com/grafana/grafana/issues/14519), thx [@kjedamzik](https://github.com/kjedamzik) +* **Stackdriver**: Aggregating series returns more than one series [#14581](https://github.com/grafana/grafana/issues/14581) and [#13914](https://github.com/grafana/grafana/issues/13914), thx [@kinok](https://github.com/kinok) ### Bug fixes * **Search**: Fix for issue with scrolling the "tags filter" dropdown, fixes [#14486](https://github.com/grafana/grafana/issues/14486) From f428db282c277e70ccf192c3593feba1f98d3695 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 13:32:08 +0100 Subject: [PATCH 13/42] fix: Remove the onRenderError prop and add an ErrorBoundary component --- packages/grafana-ui/src/types/panel.ts | 1 - .../src/visualizations/Graph/Graph.tsx | 5 +- .../ErrorBoundary/ErrorBoundary.tsx | 47 +++++++++++++++++++ .../features/dashboard/dashgrid/DataPanel.tsx | 29 ++++++++---- .../dashboard/dashgrid/PanelChrome.tsx | 3 +- .../app/plugins/panel/graph2/GraphPanel.tsx | 5 +- 6 files changed, 71 insertions(+), 19 deletions(-) create mode 100644 public/app/core/components/ErrorBoundary/ErrorBoundary.tsx diff --git a/packages/grafana-ui/src/types/panel.ts b/packages/grafana-ui/src/types/panel.ts index cf808f514de..44336555a81 100644 --- a/packages/grafana-ui/src/types/panel.ts +++ b/packages/grafana-ui/src/types/panel.ts @@ -9,7 +9,6 @@ export interface PanelProps { renderCounter: number; width: number; height: number; - onRenderError: () => void; } export interface PanelOptionsProps { diff --git a/packages/grafana-ui/src/visualizations/Graph/Graph.tsx b/packages/grafana-ui/src/visualizations/Graph/Graph.tsx index b3f2120639c..ad038cebcda 100644 --- a/packages/grafana-ui/src/visualizations/Graph/Graph.tsx +++ b/packages/grafana-ui/src/visualizations/Graph/Graph.tsx @@ -13,7 +13,6 @@ interface GraphProps { showBars?: boolean; width: number; height: number; - onRenderError: () => void; } export class Graph extends PureComponent { @@ -38,7 +37,7 @@ export class Graph extends PureComponent { return; } - const { width, timeSeries, timeRange, showLines, showBars, showPoints, onRenderError } = this.props; + const { width, timeSeries, timeRange, showLines, showBars, showPoints } = this.props; if (!width) { return; @@ -99,7 +98,7 @@ export class Graph extends PureComponent { $.plot(this.element, timeSeries, flotOptions); } catch (err) { console.log('Graph rendering error', err, flotOptions, timeSeries); - onRenderError(); + throw new Error('Error rendering panel'); } } diff --git a/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx b/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx new file mode 100644 index 00000000000..ed068819adc --- /dev/null +++ b/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx @@ -0,0 +1,47 @@ +import React, { Component } from 'react'; + +interface ErrorInfo { + componentStack: string; +} + +interface RenderProps { + error: Error; + errorInfo: ErrorInfo; +} + +interface Props { + children: (r: RenderProps) => JSX.Element; +} + +interface State { + error: Error; + errorInfo: ErrorInfo; +} + +class ErrorBoundary extends Component { + constructor(props) { + super(props); + this.state = { error: null, errorInfo: null }; + } + + componentDidCatch(error: Error, errorInfo: ErrorInfo) { + this.setState({ + error: error, + errorInfo: errorInfo + }); + } + + render() { + const { error, errorInfo } = this.state; + return ( + <> + {this.props.children({ + error, + errorInfo, + })} + + ); + } +} + +export default ErrorBoundary; diff --git a/public/app/features/dashboard/dashgrid/DataPanel.tsx b/public/app/features/dashboard/dashgrid/DataPanel.tsx index 4cd9460802a..fa21276d7a2 100644 --- a/public/app/features/dashboard/dashgrid/DataPanel.tsx +++ b/public/app/features/dashboard/dashgrid/DataPanel.tsx @@ -1,6 +1,7 @@ // Library import React, { Component } from 'react'; import Tooltip from 'app/core/components/Tooltip/Tooltip'; +import ErrorBoundary from 'app/core/components/ErrorBoundary/ErrorBoundary'; // Services import { getDatasourceSrv, DatasourceSrv } from 'app/features/plugins/datasource_srv'; @@ -13,10 +14,11 @@ import { DataQueryOptions, DataQueryResponse } from 'app/types'; import { TimeRange, TimeSeries, LoadingState } from '@grafana/ui'; import { Themes } from 'app/core/components/Tooltip/Popper'; +const DEFAULT_PLUGIN_ERROR = 'Error in plugin'; + interface RenderProps { loading: LoadingState; timeSeries: TimeSeries[]; - onRenderError: () => void; } export interface Props { @@ -147,10 +149,6 @@ export class DataPanel extends Component { } } - onRenderError = () => { - this.onError('Error rendering panel'); - } - render() { const { queries } = this.props; const { response, loading, isFirstLoad } = this.state; @@ -172,11 +170,22 @@ export class DataPanel extends Component { return ( <> {this.renderLoadingStates()} - {this.props.children({ - timeSeries, - loading, - onRenderError: this.onRenderError - })} + + {({error, errorInfo}) => { + if (errorInfo) { + this.onError(error.message || DEFAULT_PLUGIN_ERROR); + return null; + } + return ( + <> + {this.props.children({ + timeSeries, + loading, + })} + + ); + }} + ); } diff --git a/public/app/features/dashboard/dashgrid/PanelChrome.tsx b/public/app/features/dashboard/dashgrid/PanelChrome.tsx index 90d66a14cd3..84e11511453 100644 --- a/public/app/features/dashboard/dashgrid/PanelChrome.tsx +++ b/public/app/features/dashboard/dashgrid/PanelChrome.tsx @@ -114,7 +114,7 @@ export class PanelChrome extends PureComponent { widthPixels={width} refreshCounter={refreshCounter} > - {({ loading, timeSeries, onRenderError }) => { + {({ loading, timeSeries }) => { return (
{ width={width} height={height - PANEL_HEADER_HEIGHT} renderCounter={renderCounter} - onRenderError={onRenderError} />
); diff --git a/public/app/plugins/panel/graph2/GraphPanel.tsx b/public/app/plugins/panel/graph2/GraphPanel.tsx index 49d2ac3e4e4..2c21c7f0e15 100644 --- a/public/app/plugins/panel/graph2/GraphPanel.tsx +++ b/public/app/plugins/panel/graph2/GraphPanel.tsx @@ -10,12 +10,12 @@ import { Options } from './types'; interface Props extends PanelProps {} export class GraphPanel extends PureComponent { - constructor(props) { + constructor(props: Props) { super(props); } render() { - const { timeSeries, timeRange, width, height, onRenderError } = this.props; + const { timeSeries, timeRange, width, height } = this.props; const { showLines, showBars, showPoints } = this.props.options; const vmSeries = processTimeSeries({ @@ -33,7 +33,6 @@ export class GraphPanel extends PureComponent { showBars={showBars} width={width} height={height} - onRenderError={onRenderError} /> ); } From de4e1a91f7d6b42c008e7e1bafac2b194f2d9fc6 Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Tue, 8 Jan 2019 13:44:10 +0100 Subject: [PATCH 14/42] Refactored withPoper HOC to PopperController using render prop --- public/app/core/components/Tooltip/Popper.tsx | 17 ++-- .../components/Tooltip/PopperController.tsx | 94 +++++++++++++++++++ .../core/components/Tooltip/withPopper.tsx | 88 ----------------- 3 files changed, 100 insertions(+), 99 deletions(-) create mode 100644 public/app/core/components/Tooltip/PopperController.tsx delete mode 100644 public/app/core/components/Tooltip/withPopper.tsx diff --git a/public/app/core/components/Tooltip/Popper.tsx b/public/app/core/components/Tooltip/Popper.tsx index 36cf0fe837e..cbd00028e90 100644 --- a/public/app/core/components/Tooltip/Popper.tsx +++ b/public/app/core/components/Tooltip/Popper.tsx @@ -1,6 +1,7 @@ import React, { PureComponent } from 'react'; +import * as PopperJS from 'popper.js'; +import { Manager, Popper as ReactPopper } from 'react-popper'; import Portal from 'app/core/components/Portal/Portal'; -import { Manager, Popper as ReactPopper, Reference } from 'react-popper'; import Transition from 'react-transition-group/Transition'; const defaultTransitionStyles = { @@ -18,29 +19,23 @@ const transitionStyles = { interface Props { renderContent: (content: any) => any; show: boolean; - placement?: any; + placement?: PopperJS.Placement; content: string | ((props: any) => JSX.Element); refClassName?: string; + referenceElement: PopperJS.ReferenceObject; } class Popper extends PureComponent { render() { - const { children, renderContent, show, placement, refClassName } = this.props; + const { renderContent, show, placement } = this.props; const { content } = this.props; return ( - - {({ ref }) => ( -
- {children} -
- )} -
{transitionState => ( - + {({ ref, style, placement, arrowProps }) => { return (
JSX.Element); + +export interface UsingPopperProps { + show?: boolean; + placement?: PopperJS.Placement; + content: PopperContent; + children: JSX.Element; + renderContent?: (content: PopperContent) => JSX.Element; +} + +type PopperControllerRenderProp = ( + showPopper: () => void, + hidePopper: () => void, + popperProps: { + show: boolean; + placement: PopperJS.Placement; + content: string | ((props: any) => JSX.Element); + renderContent: (content: any) => any; + } +) => JSX.Element; + +interface Props { + placement?: PopperJS.Placement; + content: PopperContent; + className?: string; + children: PopperControllerRenderProp; +} + +interface State { + placement: PopperJS.Placement; + show: boolean; +} + +class PopperController extends React.Component { + constructor(props: Props) { + super(props); + + this.state = { + placement: this.props.placement || 'auto', + show: false, + }; + } + + componentWillReceiveProps(nextProps: Props) { + if (nextProps.placement && nextProps.placement !== this.state.placement) { + this.setState(prevState => { + return { + ...prevState, + placement: nextProps.placement, + }; + }); + } + } + + showPopper = () => { + this.setState(prevState => ({ + ...prevState, + show: true, + })); + }; + + hidePopper = () => { + this.setState(prevState => ({ + ...prevState, + show: false, + })); + }; + + renderContent(content: PopperContent) { + if (typeof content === 'function') { + // If it's a function we assume it's a React component + const ReactComponent = content; + return ; + } + return content; + } + + render() { + const { children, content } = this.props; + const { show, placement } = this.state; + + return children(this.showPopper, this.hidePopper, { + show, + placement, + content, + renderContent: this.renderContent, + }); + } +} + +export default PopperController; diff --git a/public/app/core/components/Tooltip/withPopper.tsx b/public/app/core/components/Tooltip/withPopper.tsx deleted file mode 100644 index 4ba05937531..00000000000 --- a/public/app/core/components/Tooltip/withPopper.tsx +++ /dev/null @@ -1,88 +0,0 @@ -import React from 'react'; - -export interface UsingPopperProps { - showPopper: (prevState: object) => void; - hidePopper: (prevState: object) => void; - renderContent: (content: any) => any; - show: boolean; - placement?: string; - content: string | ((props: any) => JSX.Element); - className?: string; - refClassName?: string; -} - -interface Props { - placement?: string; - className?: string; - refClassName?: string; - content: string | ((props: any) => JSX.Element); -} - -interface State { - placement: string; - show: boolean; -} - -export default function withPopper(WrappedComponent) { - return class extends React.Component { - constructor(props) { - super(props); - this.setState = this.setState.bind(this); - this.state = { - placement: this.props.placement || 'auto', - show: false, - }; - } - - componentWillReceiveProps(nextProps) { - if (nextProps.placement && nextProps.placement !== this.state.placement) { - this.setState(prevState => { - return { - ...prevState, - placement: nextProps.placement, - }; - }); - } - } - - showPopper = () => { - this.setState(prevState => ({ - ...prevState, - show: true, - })); - }; - - hidePopper = () => { - this.setState(prevState => ({ - ...prevState, - show: false, - })); - }; - - renderContent(content) { - if (typeof content === 'function') { - // If it's a function we assume it's a React component - const ReactComponent = content; - return ; - } - return content; - } - - render() { - const { show, placement } = this.state; - const className = this.props.className || ''; - - return ( - - ); - } - }; -} From ec904cf66247a870f49d4ccaf0ef52f2f476c30d Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Tue, 8 Jan 2019 13:53:59 +0100 Subject: [PATCH 15/42] Update components to fit updated PopperController API --- public/app/core/components/Label/Label.tsx | 6 ++- .../app/core/components/Tooltip/Popover.tsx | 19 ---------- .../core/components/Tooltip/Tooltip.test.tsx | 4 +- .../app/core/components/Tooltip/Tooltip.tsx | 37 ++++++++++++------- .../__snapshots__/Tooltip.test.tsx.snap | 17 +++------ .../dashboard/dashgrid/PanelEditor.tsx | 2 +- .../PanelHeader/PanelHeaderCorner.tsx | 10 +++-- .../permissions/DashboardPermissions.tsx | 6 ++- .../features/folders/FolderPermissions.tsx | 6 ++- public/app/features/teams/TeamGroupSync.tsx | 6 ++- public/app/features/teams/TeamSettings.tsx | 1 + .../__snapshots__/TeamGroupSync.test.tsx.snap | 30 +++++++++------ 12 files changed, 73 insertions(+), 71 deletions(-) delete mode 100644 public/app/core/components/Tooltip/Popover.tsx diff --git a/public/app/core/components/Label/Label.tsx b/public/app/core/components/Label/Label.tsx index 362c3c577f7..956678283f6 100644 --- a/public/app/core/components/Label/Label.tsx +++ b/public/app/core/components/Label/Label.tsx @@ -14,8 +14,10 @@ export const Label: SFC = props => { {props.children} {props.tooltip && ( - - + +
+ +
)}
diff --git a/public/app/core/components/Tooltip/Popover.tsx b/public/app/core/components/Tooltip/Popover.tsx deleted file mode 100644 index 62397243c1c..00000000000 --- a/public/app/core/components/Tooltip/Popover.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React, { PureComponent } from 'react'; -import Popper from './Popper'; -import withPopper, { UsingPopperProps } from './withPopper'; - -class Popover extends PureComponent { - render() { - const { children, hidePopper, showPopper, className, ...restProps } = this.props; - - const togglePopper = restProps.show ? hidePopper : showPopper; - - return ( -
- {children} -
- ); - } -} - -export default withPopper(Popover); diff --git a/public/app/core/components/Tooltip/Tooltip.test.tsx b/public/app/core/components/Tooltip/Tooltip.test.tsx index d2c96bb23d2..4a6def738e0 100644 --- a/public/app/core/components/Tooltip/Tooltip.test.tsx +++ b/public/app/core/components/Tooltip/Tooltip.test.tsx @@ -6,8 +6,8 @@ describe('Tooltip', () => { it('renders correctly', () => { const tree = renderer .create( - - Link with tooltip + + Link with tooltip ) .toJSON(); diff --git a/public/app/core/components/Tooltip/Tooltip.tsx b/public/app/core/components/Tooltip/Tooltip.tsx index 795da94a03c..a905be7d988 100644 --- a/public/app/core/components/Tooltip/Tooltip.tsx +++ b/public/app/core/components/Tooltip/Tooltip.tsx @@ -1,17 +1,28 @@ -import React, { PureComponent } from 'react'; +import React, { createRef } from 'react'; +import * as PopperJS from 'popper.js'; + import Popper from './Popper'; -import withPopper, { UsingPopperProps } from './withPopper'; +import PopperController, { UsingPopperProps } from './PopperController'; -class Tooltip extends PureComponent { - render() { - const { children, hidePopper, showPopper, className, ...restProps } = this.props; +const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperProps) => { + const tooltipTriggerRef = createRef(); - return ( -
- {children} -
- ); - } -} + return ( + + {(showPopper, hidePopper, popperProps) => { + return ( + <> + + {React.cloneElement(children, { + ref: tooltipTriggerRef, + onMouseEnter: showPopper, + onMouseLeave: hidePopper, + })} + + ); + }} + + ); +}; -export default withPopper(Tooltip); +export default Tooltip; diff --git a/public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap b/public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap index c7d680049f4..761221906d4 100644 --- a/public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap +++ b/public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap @@ -1,19 +1,12 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Tooltip renders correctly 1`] = ` - + Link with tooltip + `; diff --git a/public/app/features/dashboard/dashgrid/PanelEditor.tsx b/public/app/features/dashboard/dashgrid/PanelEditor.tsx index fbc683c2eb3..bce9af252ee 100644 --- a/public/app/features/dashboard/dashgrid/PanelEditor.tsx +++ b/public/app/features/dashboard/dashgrid/PanelEditor.tsx @@ -138,7 +138,7 @@ function TabItem({ tab, activeTab, onClick }: TabItemParams) { return (
onClick(tab)}> - + diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx index 331e469a60d..3346f4b902d 100644 --- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx @@ -78,12 +78,14 @@ export class PanelHeaderCorner extends Component { {infoMode === InfoModes.Info || infoMode === InfoModes.Links ? ( - - +
+ + +
) : null} diff --git a/public/app/features/dashboard/permissions/DashboardPermissions.tsx b/public/app/features/dashboard/permissions/DashboardPermissions.tsx index c07bef42930..95d78e7a737 100644 --- a/public/app/features/dashboard/permissions/DashboardPermissions.tsx +++ b/public/app/features/dashboard/permissions/DashboardPermissions.tsx @@ -70,8 +70,10 @@ export class DashboardPermissions extends PureComponent {

Permissions

- - + +
+ +
- - ) - .toJSON(); - expect(tree).toMatchSnapshot(); - }); -}); diff --git a/public/app/core/components/Tooltip/__snapshots__/Popover.test.tsx.snap b/public/app/core/components/Tooltip/__snapshots__/Popover.test.tsx.snap deleted file mode 100644 index b36a4fe9af9..00000000000 --- a/public/app/core/components/Tooltip/__snapshots__/Popover.test.tsx.snap +++ /dev/null @@ -1,16 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Popover renders correctly 1`] = ` -
-
- -
-
-`; From bf478a40b191e6c8a9c9fcd7d378008507793dbd Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 14:58:57 +0100 Subject: [PATCH 17/42] fix: When loki is default data source, datasource is passed as undefined to QueryOptions #14667 --- public/app/features/dashboard/dashgrid/QueryOptions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/app/features/dashboard/dashgrid/QueryOptions.tsx b/public/app/features/dashboard/dashgrid/QueryOptions.tsx index fad70d92990..df911800c20 100644 --- a/public/app/features/dashboard/dashgrid/QueryOptions.tsx +++ b/public/app/features/dashboard/dashgrid/QueryOptions.tsx @@ -94,7 +94,7 @@ export class QueryOptions extends PureComponent { renderOptions() { const { datasource, panel } = this.props; - const { queryOptions } = datasource.meta; + const queryOptions = datasource && datasource.meta ? datasource.meta.queryOptions : undefined; if (!queryOptions) { return null; From 8d210afd76233ddff949914533eb99428cb4b24e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= Date: Tue, 8 Jan 2019 15:18:29 +0100 Subject: [PATCH 18/42] Moved AlertTab and StateHistory to app/features/alerting --- .../features/{dashboard/dashgrid => alerting}/AlertTab.tsx | 6 +++--- .../{dashboard/dashgrid => alerting}/StateHistory.tsx | 6 +++--- public/app/features/dashboard/dashgrid/PanelEditor.tsx | 2 +- 3 files changed, 7 insertions(+), 7 deletions(-) rename public/app/features/{dashboard/dashgrid => alerting}/AlertTab.tsx (94%) rename public/app/features/{dashboard/dashgrid => alerting}/StateHistory.tsx (95%) diff --git a/public/app/features/dashboard/dashgrid/AlertTab.tsx b/public/app/features/alerting/AlertTab.tsx similarity index 94% rename from public/app/features/dashboard/dashgrid/AlertTab.tsx rename to public/app/features/alerting/AlertTab.tsx index 20f7e90633e..a5afbc198fc 100644 --- a/public/app/features/dashboard/dashgrid/AlertTab.tsx +++ b/public/app/features/alerting/AlertTab.tsx @@ -6,14 +6,14 @@ import { AngularComponent, getAngularLoader } from 'app/core/services/AngularLoa import appEvents from 'app/core/app_events'; // Components -import { EditorTabBody, EditorToolbarView } from './EditorTabBody'; +import { EditorTabBody, EditorToolbarView } from '../dashboard/dashgrid/EditorTabBody'; import EmptyListCTA from 'app/core/components/EmptyListCTA/EmptyListCTA'; import StateHistory from './StateHistory'; import 'app/features/alerting/AlertTabCtrl'; // Types -import { DashboardModel } from '../dashboard_model'; -import { PanelModel } from '../panel_model'; +import { DashboardModel } from '../dashboard/dashboard_model'; +import { PanelModel } from '../dashboard/panel_model'; interface Props { angularPanel?: AngularComponent; diff --git a/public/app/features/dashboard/dashgrid/StateHistory.tsx b/public/app/features/alerting/StateHistory.tsx similarity index 95% rename from public/app/features/dashboard/dashgrid/StateHistory.tsx rename to public/app/features/alerting/StateHistory.tsx index 99229b41848..eb5541f6094 100644 --- a/public/app/features/dashboard/dashgrid/StateHistory.tsx +++ b/public/app/features/alerting/StateHistory.tsx @@ -1,8 +1,8 @@ import React, { PureComponent } from 'react'; -import alertDef from '../../alerting/state/alertDef'; +import alertDef from './state/alertDef'; import { getBackendSrv } from 'app/core/services/backend_srv'; -import { DashboardModel } from '../dashboard_model'; -import appEvents from '../../../core/app_events'; +import { DashboardModel } from '../dashboard/dashboard_model'; +import appEvents from '../../core/app_events'; interface Props { dashboard: DashboardModel; diff --git a/public/app/features/dashboard/dashgrid/PanelEditor.tsx b/public/app/features/dashboard/dashgrid/PanelEditor.tsx index fbc683c2eb3..2b91e19d83c 100644 --- a/public/app/features/dashboard/dashgrid/PanelEditor.tsx +++ b/public/app/features/dashboard/dashgrid/PanelEditor.tsx @@ -4,7 +4,7 @@ import classNames from 'classnames'; import { QueriesTab } from './QueriesTab'; import { VisualizationTab } from './VisualizationTab'; import { GeneralTab } from './GeneralTab'; -import { AlertTab } from './AlertTab'; +import { AlertTab } from '../../alerting/AlertTab'; import config from 'app/core/config'; import { store } from 'app/store/store'; From df83c4650d7db9a97a177033f78ecb86f195da15 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Tue, 8 Jan 2019 15:54:12 +0100 Subject: [PATCH 19/42] minor code refactor --- public/app/features/dashboard/dashgrid/QueriesTab.tsx | 8 ++++++-- public/app/features/dashboard/dashgrid/QueryOptions.tsx | 2 +- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/public/app/features/dashboard/dashgrid/QueriesTab.tsx b/public/app/features/dashboard/dashgrid/QueriesTab.tsx index 741e2cd9ac1..77ab64b1dba 100644 --- a/public/app/features/dashboard/dashgrid/QueriesTab.tsx +++ b/public/app/features/dashboard/dashgrid/QueriesTab.tsx @@ -50,17 +50,21 @@ export class QueriesTab extends PureComponent { constructor(props) { super(props); - const { panel } = props; this.state = { - currentDS: this.datasources.find(datasource => datasource.value === panel.datasource), isLoadingHelp: false, + currentDS: this.findCurrentDataSource(), helpContent: null, isPickerOpen: false, isAddingMixed: false, }; } + findCurrentDataSource(): DataSourceSelectItem { + const { panel } = this.props; + return this.datasources.find(datasource => datasource.value === panel.datasource) || this.datasources[0]; + } + getAngularQueryComponentScope(): AngularQueryComponentScope { const { panel, dashboard } = this.props; diff --git a/public/app/features/dashboard/dashgrid/QueryOptions.tsx b/public/app/features/dashboard/dashgrid/QueryOptions.tsx index df911800c20..fad70d92990 100644 --- a/public/app/features/dashboard/dashgrid/QueryOptions.tsx +++ b/public/app/features/dashboard/dashgrid/QueryOptions.tsx @@ -94,7 +94,7 @@ export class QueryOptions extends PureComponent { renderOptions() { const { datasource, panel } = this.props; - const queryOptions = datasource && datasource.meta ? datasource.meta.queryOptions : undefined; + const { queryOptions } = datasource.meta; if (!queryOptions) { return null; From 12a3edd6e501e1e92ab222e37bdfd8c7d2a299b5 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 16:04:46 +0100 Subject: [PATCH 20/42] fix: Clean up per PR feedback. Thanks @dprokop --- .../ErrorBoundary/ErrorBoundary.tsx | 23 ++++++++----------- .../app/plugins/panel/graph2/GraphPanel.tsx | 4 ---- 2 files changed, 10 insertions(+), 17 deletions(-) diff --git a/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx b/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx index ed068819adc..188750b0fef 100644 --- a/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx +++ b/public/app/core/components/ErrorBoundary/ErrorBoundary.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import { Component } from 'react'; interface ErrorInfo { componentStack: string; @@ -19,10 +19,10 @@ interface State { } class ErrorBoundary extends Component { - constructor(props) { - super(props); - this.state = { error: null, errorInfo: null }; - } + readonly state: State = { + error: null, + errorInfo: null, + }; componentDidCatch(error: Error, errorInfo: ErrorInfo) { this.setState({ @@ -32,15 +32,12 @@ class ErrorBoundary extends Component { } render() { + const { children } = this.props; const { error, errorInfo } = this.state; - return ( - <> - {this.props.children({ - error, - errorInfo, - })} - - ); + return children({ + error, + errorInfo, + }); } } diff --git a/public/app/plugins/panel/graph2/GraphPanel.tsx b/public/app/plugins/panel/graph2/GraphPanel.tsx index 2c21c7f0e15..020c33f7d38 100644 --- a/public/app/plugins/panel/graph2/GraphPanel.tsx +++ b/public/app/plugins/panel/graph2/GraphPanel.tsx @@ -10,10 +10,6 @@ import { Options } from './types'; interface Props extends PanelProps {} export class GraphPanel extends PureComponent { - constructor(props: Props) { - super(props); - } - render() { const { timeSeries, timeRange, width, height } = this.props; const { showLines, showBars, showPoints } = this.props.options; From 023e4961081774884cea5e86c4ab3e174deaaaa3 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Tue, 8 Jan 2019 16:45:04 +0100 Subject: [PATCH 21/42] docs: rpm/deb beta repo. --- docs/sources/installation/debian.md | 6 ++++++ docs/sources/installation/rpm.md | 14 ++++++++++++++ 2 files changed, 20 insertions(+) diff --git a/docs/sources/installation/debian.md b/docs/sources/installation/debian.md index 28b975e31e8..d26af5277a1 100644 --- a/docs/sources/installation/debian.md +++ b/docs/sources/installation/debian.md @@ -47,6 +47,12 @@ Create a file `/etc/apt/sources.list.d/grafana.list` and add the following to it deb https://packages.grafana.com/oss/deb stable main ``` +There is a separate repository if you want beta releases. + +```bash +deb https://packages.grafana.com/oss/deb beta main +``` + Use the above line even if you are on Ubuntu or another Debian version. Then add our gpg key. This allows you to install signed packages. ```bash diff --git a/docs/sources/installation/rpm.md b/docs/sources/installation/rpm.md index 559bb0a8ef4..156f703e164 100644 --- a/docs/sources/installation/rpm.md +++ b/docs/sources/installation/rpm.md @@ -76,6 +76,20 @@ sslverify=1 sslcacert=/etc/pki/tls/certs/ca-bundle.crt ``` +There is a separate repository if you want beta releases. + +```bash +[grafana] +name=grafana +baseurl=https://packages.grafana.com/oss/rpm-beta +repo_gpgcheck=1 +enabled=1 +gpgcheck=1 +gpgkey=https://packages.grafana.com/gpg.key +sslverify=1 +sslcacert=/etc/pki/tls/certs/ca-bundle.crt +``` + Then install Grafana via the `yum` command. ```bash From 22c9ce7de827ef9078449aecec69786eb9bbae7e Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Tue, 8 Jan 2019 17:01:50 +0100 Subject: [PATCH 22/42] Make tooltips persistent when hovered --- public/app/core/components/Tooltip/Popper.tsx | 6 ++++-- public/app/core/components/Tooltip/Tooltip.tsx | 7 ++++++- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/public/app/core/components/Tooltip/Popper.tsx b/public/app/core/components/Tooltip/Popper.tsx index cbd00028e90..dc89b801e37 100644 --- a/public/app/core/components/Tooltip/Popper.tsx +++ b/public/app/core/components/Tooltip/Popper.tsx @@ -16,7 +16,7 @@ const transitionStyles = { exiting: { opacity: 0 }, }; -interface Props { +interface Props extends React.DOMAttributes { renderContent: (content: any) => any; show: boolean; placement?: PopperJS.Placement; @@ -27,7 +27,7 @@ interface Props { class Popper extends PureComponent { render() { - const { renderContent, show, placement } = this.props; + const { renderContent, show, placement, onMouseEnter, onMouseLeave } = this.props; const { content } = this.props; return ( @@ -39,6 +39,8 @@ class Popper extends PureComponent { {({ ref, style, placement, arrowProps }) => { return (
{ return ( <> - + {React.cloneElement(children, { ref: tooltipTriggerRef, onMouseEnter: showPopper, From 79c6fdc0e8fe7bb900a88c3782df8f8870d8a5c1 Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Tue, 8 Jan 2019 20:51:00 +0100 Subject: [PATCH 23/42] wip --- packages/grafana-ui/package.json | 6 ++++-- .../src}/components/Tooltip/Popper.tsx | 0 .../components/Tooltip/PopperController.tsx | 0 .../src}/components/Tooltip/Tooltip.test.tsx | 8 +++++--- .../src}/components/Tooltip/Tooltip.tsx | 19 +++++++++---------- .../src/components/Tooltip/_Tooltip.scss | 0 .../__snapshots__/Tooltip.test.tsx.snap | 0 packages/grafana-ui/src/components/index.scss | 1 + packages/grafana-ui/src/components/index.ts | 1 + public/app/core/components/Label/Label.tsx | 2 +- .../ToggleButtonGroup/ToggleButtonGroup.tsx | 2 +- .../dashboard/dashgrid/DataSourceOption.tsx | 2 +- .../dashboard/dashgrid/PanelEditor.tsx | 2 +- .../PanelHeader/PanelHeaderCorner.tsx | 6 +++--- .../permissions/DashboardPermissions.tsx | 2 +- .../features/folders/FolderPermissions.tsx | 2 +- public/app/features/teams/TeamGroupSync.tsx | 2 +- public/sass/_grafana.scss | 1 - yarn.lock | 18 ++++++++++++++++-- 19 files changed, 46 insertions(+), 28 deletions(-) rename {public/app/core => packages/grafana-ui/src}/components/Tooltip/Popper.tsx (100%) rename {public/app/core => packages/grafana-ui/src}/components/Tooltip/PopperController.tsx (100%) rename {public/app/core => packages/grafana-ui/src}/components/Tooltip/Tooltip.test.tsx (69%) rename {public/app/core => packages/grafana-ui/src}/components/Tooltip/Tooltip.tsx (63%) rename public/sass/components/_popper.scss => packages/grafana-ui/src/components/Tooltip/_Tooltip.scss (100%) rename {public/app/core => packages/grafana-ui/src}/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap (100%) diff --git a/packages/grafana-ui/package.json b/packages/grafana-ui/package.json index 2fb210e3b46..f48b8221f9c 100644 --- a/packages/grafana-ui/package.json +++ b/packages/grafana-ui/package.json @@ -11,6 +11,8 @@ "license": "ISC", "dependencies": { "@torkelo/react-select": "2.1.1", + "@types/react-test-renderer": "^16.0.3", + "@types/react-transition-group": "^2.0.15", "classnames": "^2.2.5", "jquery": "^3.2.1", "lodash": "^4.17.10", @@ -23,11 +25,11 @@ "react-virtualized": "^9.21.0" }, "devDependencies": { + "@types/classnames": "^2.2.6", "@types/jest": "^23.3.2", + "@types/jquery": "^1.10.35", "@types/lodash": "^4.14.119", "@types/react": "^16.7.6", - "@types/classnames": "^2.2.6", - "@types/jquery": "^1.10.35", "typescript": "^3.2.2" } } diff --git a/public/app/core/components/Tooltip/Popper.tsx b/packages/grafana-ui/src/components/Tooltip/Popper.tsx similarity index 100% rename from public/app/core/components/Tooltip/Popper.tsx rename to packages/grafana-ui/src/components/Tooltip/Popper.tsx diff --git a/public/app/core/components/Tooltip/PopperController.tsx b/packages/grafana-ui/src/components/Tooltip/PopperController.tsx similarity index 100% rename from public/app/core/components/Tooltip/PopperController.tsx rename to packages/grafana-ui/src/components/Tooltip/PopperController.tsx diff --git a/public/app/core/components/Tooltip/Tooltip.test.tsx b/packages/grafana-ui/src/components/Tooltip/Tooltip.test.tsx similarity index 69% rename from public/app/core/components/Tooltip/Tooltip.test.tsx rename to packages/grafana-ui/src/components/Tooltip/Tooltip.test.tsx index 4a6def738e0..95d01c7f2fe 100644 --- a/public/app/core/components/Tooltip/Tooltip.test.tsx +++ b/packages/grafana-ui/src/components/Tooltip/Tooltip.test.tsx @@ -1,13 +1,15 @@ import React from 'react'; import renderer from 'react-test-renderer'; -import Tooltip from './Tooltip'; +import { Tooltip } from './Tooltip'; describe('Tooltip', () => { it('renders correctly', () => { const tree = renderer .create( - - Link with tooltip + + + Link with tooltip + ) .toJSON(); diff --git a/public/app/core/components/Tooltip/Tooltip.tsx b/packages/grafana-ui/src/components/Tooltip/Tooltip.tsx similarity index 63% rename from public/app/core/components/Tooltip/Tooltip.tsx rename to packages/grafana-ui/src/components/Tooltip/Tooltip.tsx index 8fcc4793ba9..9cffb151d83 100644 --- a/public/app/core/components/Tooltip/Tooltip.tsx +++ b/packages/grafana-ui/src/components/Tooltip/Tooltip.tsx @@ -1,10 +1,9 @@ import React, { createRef } from 'react'; import * as PopperJS from 'popper.js'; - import Popper from './Popper'; import PopperController, { UsingPopperProps } from './PopperController'; -const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperProps) => { +export const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperProps) => { const tooltipTriggerRef = createRef(); return ( @@ -12,12 +11,14 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro {(showPopper, hidePopper, popperProps) => { return ( <> - + {tooltipTriggerRef.current && ( + + )} {React.cloneElement(children, { ref: tooltipTriggerRef, onMouseEnter: showPopper, @@ -29,5 +30,3 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro ); }; - -export default Tooltip; diff --git a/public/sass/components/_popper.scss b/packages/grafana-ui/src/components/Tooltip/_Tooltip.scss similarity index 100% rename from public/sass/components/_popper.scss rename to packages/grafana-ui/src/components/Tooltip/_Tooltip.scss diff --git a/public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap b/packages/grafana-ui/src/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap similarity index 100% rename from public/app/core/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap rename to packages/grafana-ui/src/components/Tooltip/__snapshots__/Tooltip.test.tsx.snap diff --git a/packages/grafana-ui/src/components/index.scss b/packages/grafana-ui/src/components/index.scss index d52508c946c..fd10d21f9f1 100644 --- a/packages/grafana-ui/src/components/index.scss +++ b/packages/grafana-ui/src/components/index.scss @@ -1 +1,2 @@ @import 'DeleteButton/DeleteButton'; +@import 'Tooltip/Tooltip'; diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts index b57b9bcfdb7..8b9b11404c2 100644 --- a/packages/grafana-ui/src/components/index.ts +++ b/packages/grafana-ui/src/components/index.ts @@ -1 +1,2 @@ export { DeleteButton } from './DeleteButton/DeleteButton'; +export { Tooltip } from './Tooltip/Tooltip'; diff --git a/public/app/core/components/Label/Label.tsx b/public/app/core/components/Label/Label.tsx index 956678283f6..5d60efa056a 100644 --- a/public/app/core/components/Label/Label.tsx +++ b/public/app/core/components/Label/Label.tsx @@ -1,5 +1,5 @@ import React, { SFC, ReactNode } from 'react'; -import Tooltip from '../Tooltip/Tooltip'; +import { Tooltip } from '@grafana/ui'; interface Props { tooltip?: string; diff --git a/public/app/core/components/ToggleButtonGroup/ToggleButtonGroup.tsx b/public/app/core/components/ToggleButtonGroup/ToggleButtonGroup.tsx index 2524a265054..86e15923bda 100644 --- a/public/app/core/components/ToggleButtonGroup/ToggleButtonGroup.tsx +++ b/public/app/core/components/ToggleButtonGroup/ToggleButtonGroup.tsx @@ -1,5 +1,5 @@ import React, { SFC, ReactNode, PureComponent } from 'react'; -import Tooltip from 'app/core/components/Tooltip/Tooltip'; +import { Tooltip } from '@grafana/ui'; interface ToggleButtonGroupProps { label?: string; diff --git a/public/app/features/dashboard/dashgrid/DataSourceOption.tsx b/public/app/features/dashboard/dashgrid/DataSourceOption.tsx index 0adfc4abe16..9a3ce527510 100644 --- a/public/app/features/dashboard/dashgrid/DataSourceOption.tsx +++ b/public/app/features/dashboard/dashgrid/DataSourceOption.tsx @@ -1,5 +1,5 @@ import React, { SFC } from 'react'; -import Tooltip from 'app/core/components/Tooltip/Tooltip'; +import { Tooltip } from '@grafana/ui'; interface Props { label: string; diff --git a/public/app/features/dashboard/dashgrid/PanelEditor.tsx b/public/app/features/dashboard/dashgrid/PanelEditor.tsx index bce9af252ee..22921a4f98e 100644 --- a/public/app/features/dashboard/dashgrid/PanelEditor.tsx +++ b/public/app/features/dashboard/dashgrid/PanelEditor.tsx @@ -15,7 +15,7 @@ import { PanelModel } from '../panel_model'; import { DashboardModel } from '../dashboard_model'; import { PanelPlugin } from 'app/types/plugins'; -import Tooltip from 'app/core/components/Tooltip/Tooltip'; +import { Tooltip } from '@grafana/ui'; interface PanelEditorProps { panel: PanelModel; diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx index 3346f4b902d..82b8d57b64a 100644 --- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx @@ -1,10 +1,10 @@ import React, { Component } from 'react'; +import Remarkable from 'remarkable'; +import { Tooltip } from '@grafana/ui'; import { PanelModel } from 'app/features/dashboard/panel_model'; -import Tooltip from 'app/core/components/Tooltip/Tooltip'; import templateSrv from 'app/features/templating/template_srv'; import { LinkSrv } from 'app/features/dashboard/panellinks/link_srv'; import { getTimeSrv, TimeSrv } from 'app/features/dashboard/time_srv'; -import Remarkable from 'remarkable'; enum InfoModes { Error = 'Error', @@ -78,7 +78,7 @@ export class PanelHeaderCorner extends Component { {infoMode === InfoModes.Info || infoMode === InfoModes.Links ? (
Date: Wed, 9 Jan 2019 09:42:30 +0100 Subject: [PATCH 24/42] changed light theme page background gradient --- public/sass/_variables.light.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index 16bb341ba27..6ad07011b68 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -76,8 +76,7 @@ $textShadow: none; // gradients $brand-gradient: linear-gradient(to right, rgba(255, 213, 0, 1) 0%, rgba(255, 68, 0, 1) 99%, rgba(255, 68, 0, 1) 100%); -$page-gradient: linear-gradient(-60deg, $gray-7, #f5f6f9 70%, $gray-7 98%); -//$page-gradient: linear-gradient(180deg, $white 10px, $gray-7 100px); +$page-gradient: linear-gradient(180deg, $white 10px, $gray-7 100px); $edit-gradient: linear-gradient(-60deg, $gray-7, #f5f6f9 70%, $gray-7 98%); // Links From 6ac25d41fa29f02ba6437da365aa8d2b5b5d2a25 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Tue, 8 Jan 2019 16:59:16 +0100 Subject: [PATCH 25/42] chore: Move CustomScrollbar to @grafana/ui #14759 --- package.json | 4 +-- packages/grafana-ui/package.json | 8 +++-- .../CustomScrollbar/CustomScrollbar.test.tsx | 0 .../CustomScrollbar/CustomScrollbar.tsx | 2 +- .../CustomScrollbar.test.tsx.snap | 0 packages/grafana-ui/src/components/index.ts | 1 + public/app/core/components/Select/Select.tsx | 2 +- .../dashboard/dashgrid/EditorTabBody.tsx | 2 +- .../app/plugins/panel/graph/Legend/Legend.tsx | 2 +- yarn.lock | 34 +++++++++++++++++-- 10 files changed, 44 insertions(+), 11 deletions(-) rename {public/app/core => packages/grafana-ui/src}/components/CustomScrollbar/CustomScrollbar.test.tsx (100%) rename {public/app/core => packages/grafana-ui/src}/components/CustomScrollbar/CustomScrollbar.tsx (96%) rename {public/app/core => packages/grafana-ui/src}/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap (100%) diff --git a/package.json b/package.json index eefe2cbbe53..c8d891b91bc 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,6 @@ "@types/jquery": "^1.10.35", "@types/node": "^8.0.31", "@types/react": "^16.7.6", - "@types/react-custom-scrollbars": "^4.0.5", "@types/react-dom": "^16.0.9", "@types/react-select": "^2.0.4", "angular-mocks": "1.6.6", @@ -72,8 +71,8 @@ "ng-annotate-loader": "^0.6.1", "ng-annotate-webpack-plugin": "^0.3.0", "ngtemplate-loader": "^2.0.1", - "npm": "^5.4.2", "node-sass": "^4.11.0", + "npm": "^5.4.2", "optimize-css-assets-webpack-plugin": "^4.0.2", "phantomjs-prebuilt": "^2.1.15", "postcss-browser-reporter": "^0.5.0", @@ -167,7 +166,6 @@ "prop-types": "^15.6.2", "rc-cascader": "^0.14.0", "react": "^16.6.3", - "react-custom-scrollbars": "^4.2.1", "react-dom": "^16.6.3", "react-grid-layout": "0.16.6", "react-highlight-words": "0.11.0", diff --git a/packages/grafana-ui/package.json b/packages/grafana-ui/package.json index 2fb210e3b46..594faa57b0a 100644 --- a/packages/grafana-ui/package.json +++ b/packages/grafana-ui/package.json @@ -16,6 +16,7 @@ "lodash": "^4.17.10", "moment": "^2.22.2", "react": "^16.6.3", + "react-custom-scrollbars": "^4.2.1", "react-dom": "^16.6.3", "react-highlight-words": "0.11.0", "react-popper": "^1.3.0", @@ -23,11 +24,14 @@ "react-virtualized": "^9.21.0" }, "devDependencies": { + "@types/classnames": "^2.2.6", "@types/jest": "^23.3.2", + "@types/jquery": "^1.10.35", "@types/lodash": "^4.14.119", "@types/react": "^16.7.6", - "@types/classnames": "^2.2.6", - "@types/jquery": "^1.10.35", + "@types/react-custom-scrollbars": "^4.0.5", + "@types/react-test-renderer": "^16.0.3", + "react-test-renderer": "^16.7.0", "typescript": "^3.2.2" } } diff --git a/public/app/core/components/CustomScrollbar/CustomScrollbar.test.tsx b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.test.tsx similarity index 100% rename from public/app/core/components/CustomScrollbar/CustomScrollbar.test.tsx rename to packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.test.tsx diff --git a/public/app/core/components/CustomScrollbar/CustomScrollbar.tsx b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx similarity index 96% rename from public/app/core/components/CustomScrollbar/CustomScrollbar.tsx rename to packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx index 977892c637d..cf1657e1c83 100644 --- a/public/app/core/components/CustomScrollbar/CustomScrollbar.tsx +++ b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx @@ -12,7 +12,7 @@ interface Props { /** * Wraps component into component from `react-custom-scrollbars` */ -class CustomScrollbar extends PureComponent { +export class CustomScrollbar extends PureComponent { static defaultProps: Partial = { customClassName: 'custom-scrollbars', autoHide: true, diff --git a/public/app/core/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap b/packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap similarity index 100% rename from public/app/core/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap rename to packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts index b57b9bcfdb7..7423ce2a93a 100644 --- a/packages/grafana-ui/src/components/index.ts +++ b/packages/grafana-ui/src/components/index.ts @@ -1 +1,2 @@ export { DeleteButton } from './DeleteButton/DeleteButton'; +export { CustomScrollbar } from './CustomScrollbar/CustomScrollbar'; diff --git a/public/app/core/components/Select/Select.tsx b/public/app/core/components/Select/Select.tsx index 893eb1a6655..f66e07c9ed6 100644 --- a/public/app/core/components/Select/Select.tsx +++ b/public/app/core/components/Select/Select.tsx @@ -11,7 +11,7 @@ import OptionGroup from './OptionGroup'; import IndicatorsContainer from './IndicatorsContainer'; import NoOptionsMessage from './NoOptionsMessage'; import ResetStyles from './ResetStyles'; -import CustomScrollbar from '../CustomScrollbar/CustomScrollbar'; +import { CustomScrollbar } from '@grafana/ui'; export interface SelectOptionItem { label?: string; diff --git a/public/app/features/dashboard/dashgrid/EditorTabBody.tsx b/public/app/features/dashboard/dashgrid/EditorTabBody.tsx index b7da81a23f8..b159cb30a4b 100644 --- a/public/app/features/dashboard/dashgrid/EditorTabBody.tsx +++ b/public/app/features/dashboard/dashgrid/EditorTabBody.tsx @@ -2,7 +2,7 @@ import React, { PureComponent } from 'react'; // Components -import CustomScrollbar from 'app/core/components/CustomScrollbar/CustomScrollbar'; +import { CustomScrollbar } from '@grafana/ui'; import { FadeIn } from 'app/core/components/Animations/FadeIn'; import { PanelOptionSection } from './PanelOptionSection'; diff --git a/public/app/plugins/panel/graph/Legend/Legend.tsx b/public/app/plugins/panel/graph/Legend/Legend.tsx index 7af61fde4e9..b83cd7bd88c 100644 --- a/public/app/plugins/panel/graph/Legend/Legend.tsx +++ b/public/app/plugins/panel/graph/Legend/Legend.tsx @@ -1,7 +1,7 @@ import _ from 'lodash'; import React, { PureComponent } from 'react'; import { TimeSeries } from 'app/core/core'; -import CustomScrollbar from 'app/core/components/CustomScrollbar/CustomScrollbar'; +import { CustomScrollbar } from '@grafana/ui'; import { LegendItem, LEGEND_STATS } from './LegendSeriesItem'; interface LegendProps { diff --git a/yarn.lock b/yarn.lock index 78300be233e..0f7cf0fab92 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1091,6 +1091,13 @@ "@types/react-dom" "*" "@types/react-transition-group" "*" +"@types/react-test-renderer@^16.0.3": + version "16.0.3" + resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.0.3.tgz#cce5c983d66cc5c3582e7c2f44b274ab635a8acc" + integrity sha512-NWOAxVQeJxpXuNKgw83Hah0nquiw1nUexM9qY/Hk3a+XhZwgMtaa6GLA9E1TKMT75Odb3/KE/jiBO4enTuEJjQ== + dependencies: + "@types/react" "*" + "@types/react-transition-group@*": version "2.0.14" resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-2.0.14.tgz#afd0cd785a97f070b55765e9f9d76ff568269001" @@ -1098,7 +1105,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@16.7.6", "@types/react@^16.1.0", "@types/react@^16.7.6": +"@types/react@*", "@types/react@^16.1.0", "@types/react@^16.7.6": version "16.7.6" resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.6.tgz#80e4bab0d0731ad3ae51f320c4b08bdca5f03040" integrity sha512-QBUfzftr/8eg/q3ZRgf/GaDP6rTYc7ZNem+g4oZM38C9vXyV8AWRWaTQuW5yCoZTsfHrN7b3DeEiUnqH9SrnpA== @@ -3161,7 +3168,7 @@ caniuse-api@^1.5.2: lodash.memoize "^4.1.2" lodash.uniq "^4.5.0" -caniuse-db@1.0.30000772, caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639: +caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639: version "1.0.30000772" resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000772.tgz#51aae891768286eade4a3d8319ea76d6a01b512b" integrity sha1-UarokXaChureSj2DGep21qAbUSs= @@ -12061,6 +12068,11 @@ react-is@^16.5.2: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.5.2.tgz#e2a7b7c3f5d48062eb769fcb123505eb928722e3" integrity sha512-hSl7E6l25GTjNEZATqZIuWOgSnpXb3kD0DVCujmg46K5zLxsbiKaaT6VO9slkSBDPZfYs30lwfJwbOFOnoEnKQ== +react-is@^16.7.0: + version "16.7.0" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.7.0.tgz#c1bd21c64f1f1364c6f70695ec02d69392f41bfa" + integrity sha512-Z0VRQdF4NPDoI0tsXVMLkJLiwEBa+RP66g0xDHxgxysxSoCUccSten4RTF/UFvZF1dZvZ9Zu1sx+MDXwcOR34g== + react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" @@ -12134,6 +12146,16 @@ react-test-renderer@^16.0.0-0, react-test-renderer@^16.5.0: react-is "^16.5.2" schedule "^0.5.0" +react-test-renderer@^16.7.0: + version "16.7.0" + resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.7.0.tgz#1ca96c2b450ab47c36ba92cd8c03fcefc52ea01c" + integrity sha512-tFbhSjknSQ6+ttzmuGdv+SjQfmvGcq3PFKyPItohwhhOBmRoTf1We3Mlt3rJtIn85mjPXOkKV+TaKK4irvk9Yg== + dependencies: + object-assign "^4.1.1" + prop-types "^15.6.2" + react-is "^16.7.0" + scheduler "^0.12.0" + react-transition-group@^2.2.1: version "2.5.0" resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.5.0.tgz#70bca0e3546102c4dc5cf3f5f57f73447cce6874" @@ -12977,6 +12999,14 @@ scheduler@^0.11.2: loose-envify "^1.1.0" object-assign "^4.1.1" +scheduler@^0.12.0: + version "0.12.0" + resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.12.0.tgz#8ab17699939c0aedc5a196a657743c496538647b" + integrity sha512-t7MBR28Akcp4Jm+QoR63XgAi9YgCUmgvDHqf5otgAj4QvdoBE4ImCX0ffehefePPG+aitiYHp0g/mW6s4Tp+dw== + dependencies: + loose-envify "^1.1.0" + object-assign "^4.1.1" + schema-utils@^0.4.0, schema-utils@^0.4.4, schema-utils@^0.4.5: version "0.4.7" resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187" From 076defdc0b1b6e119c9c619967cafab3682cdee3 Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Wed, 9 Jan 2019 10:33:20 +0100 Subject: [PATCH 26/42] Post merge updates --- .../features/dashboard/dashgrid/DataPanel.tsx | 25 ++++++++----------- .../PanelHeader/PanelHeaderCorner.tsx | 2 +- 2 files changed, 12 insertions(+), 15 deletions(-) diff --git a/public/app/features/dashboard/dashgrid/DataPanel.tsx b/public/app/features/dashboard/dashgrid/DataPanel.tsx index fa21276d7a2..d71a274ab10 100644 --- a/public/app/features/dashboard/dashgrid/DataPanel.tsx +++ b/public/app/features/dashboard/dashgrid/DataPanel.tsx @@ -1,6 +1,8 @@ // Library import React, { Component } from 'react'; -import Tooltip from 'app/core/components/Tooltip/Tooltip'; +import { Tooltip } from '@grafana/ui'; +import { Themes } from '@grafana/ui/src/components/Tooltip/Popper'; + import ErrorBoundary from 'app/core/components/ErrorBoundary/ErrorBoundary'; // Services @@ -12,7 +14,6 @@ import kbn from 'app/core/utils/kbn'; // Types import { DataQueryOptions, DataQueryResponse } from 'app/types'; import { TimeRange, TimeSeries, LoadingState } from '@grafana/ui'; -import { Themes } from 'app/core/components/Tooltip/Popper'; const DEFAULT_PLUGIN_ERROR = 'Error in plugin'; @@ -144,10 +145,10 @@ export class DataPanel extends Component { this.setState({ loading: LoadingState.Error, isFirstLoad: false, - errorMessage: errorMessage + errorMessage: errorMessage, }); } - } + }; render() { const { queries } = this.props; @@ -171,7 +172,7 @@ export class DataPanel extends Component { <> {this.renderLoadingStates()} - {({error, errorInfo}) => { + {({ error, errorInfo }) => { if (errorInfo) { this.onError(error.message || DEFAULT_PLUGIN_ERROR); return null; @@ -200,15 +201,11 @@ export class DataPanel extends Component { ); } else if (loading === LoadingState.Error) { return ( - - - + +
+ + +
); } diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx index 82b8d57b64a..6b6f81fc579 100644 --- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx @@ -78,7 +78,7 @@ export class PanelHeaderCorner extends Component { {infoMode === InfoModes.Info || infoMode === InfoModes.Links ? (
Date: Wed, 9 Jan 2019 10:35:03 +0100 Subject: [PATCH 27/42] chore: Move sass code related to custom scrollbar into @grafana/ui #14759 --- .../CustomScrollbar/_CustomScrollbar.scss | 40 +++++++++++++++++ packages/grafana-ui/src/components/index.scss | 1 + public/sass/components/_scrollbar.scss | 44 ------------------- 3 files changed, 41 insertions(+), 44 deletions(-) create mode 100644 packages/grafana-ui/src/components/CustomScrollbar/_CustomScrollbar.scss diff --git a/packages/grafana-ui/src/components/CustomScrollbar/_CustomScrollbar.scss b/packages/grafana-ui/src/components/CustomScrollbar/_CustomScrollbar.scss new file mode 100644 index 00000000000..c0a8077fb63 --- /dev/null +++ b/packages/grafana-ui/src/components/CustomScrollbar/_CustomScrollbar.scss @@ -0,0 +1,40 @@ +.custom-scrollbars { + // Fix for Firefox. For some reason sometimes .view container gets a height of its content, but in order to + // make scroll working it should fit outer container size (scroll appears only when inner container size is + // greater than outer one). + display: flex; + flex-grow: 1; + + .view { + display: flex; + flex-grow: 1; + flex-direction: column; + } + + .track-vertical { + border-radius: 3px; + width: 6px !important; + right: 2px; + bottom: 2px; + top: 2px; + } + + .track-horizontal { + border-radius: 3px; + height: 6px !important; + + right: 2px; + bottom: 2px; + left: 2px; + } + + .thumb-vertical { + @include gradient-vertical($scrollbarBackground, $scrollbarBackground2); + border-radius: 6px; + } + + .thumb-horizontal { + @include gradient-horizontal($scrollbarBackground, $scrollbarBackground2); + border-radius: 6px; + } +} \ No newline at end of file diff --git a/packages/grafana-ui/src/components/index.scss b/packages/grafana-ui/src/components/index.scss index d52508c946c..0e18eaf018c 100644 --- a/packages/grafana-ui/src/components/index.scss +++ b/packages/grafana-ui/src/components/index.scss @@ -1 +1,2 @@ +@import 'CustomScrollbar/CustomScrollbar'; @import 'DeleteButton/DeleteButton'; diff --git a/public/sass/components/_scrollbar.scss b/public/sass/components/_scrollbar.scss index 5dbb4518d52..a7ecb73b786 100644 --- a/public/sass/components/_scrollbar.scss +++ b/public/sass/components/_scrollbar.scss @@ -295,50 +295,6 @@ } } -// Custom styles for 'react-custom-scrollbars' - -.custom-scrollbars { - // Fix for Firefox. For some reason sometimes .view container gets a height of its content, but in order to - // make scroll working it should fit outer container size (scroll appears only when inner container size is - // greater than outer one). - display: flex; - flex-grow: 1; - - .view { - display: flex; - flex-grow: 1; - flex-direction: column; - } - - .track-vertical { - border-radius: 3px; - width: 6px !important; - - right: 2px; - bottom: 2px; - top: 2px; - } - - .track-horizontal { - border-radius: 3px; - height: 6px !important; - - right: 2px; - bottom: 2px; - left: 2px; - } - - .thumb-vertical { - @include gradient-vertical($scrollbarBackground, $scrollbarBackground2); - border-radius: 6px; - } - - .thumb-horizontal { - @include gradient-horizontal($scrollbarBackground, $scrollbarBackground2); - border-radius: 6px; - } -} - .scroll-margin-helper { margin-right: 12px; } From fae8ff57500fa7d9deb20395a7495034861562ba Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Wed, 9 Jan 2019 10:55:38 +0100 Subject: [PATCH 28/42] Move Portal to @grafana/ui --- .../grafana-ui/src}/components/Portal/Portal.tsx | 4 ++-- packages/grafana-ui/src/components/Tooltip/Popper.tsx | 4 ++-- packages/grafana-ui/src/components/index.ts | 1 + 3 files changed, 5 insertions(+), 4 deletions(-) rename {public/app/core => packages/grafana-ui/src}/components/Portal/Portal.tsx (87%) diff --git a/public/app/core/components/Portal/Portal.tsx b/packages/grafana-ui/src/components/Portal/Portal.tsx similarity index 87% rename from public/app/core/components/Portal/Portal.tsx rename to packages/grafana-ui/src/components/Portal/Portal.tsx index 25d54a64209..6f51f4053e2 100644 --- a/public/app/core/components/Portal/Portal.tsx +++ b/packages/grafana-ui/src/components/Portal/Portal.tsx @@ -6,11 +6,11 @@ interface Props { root?: HTMLElement; } -export default class BodyPortal extends PureComponent { +export class Portal extends PureComponent { node: HTMLElement = document.createElement('div'); portalRoot: HTMLElement; - constructor(props) { + constructor(props: Props) { super(props); const { className, diff --git a/packages/grafana-ui/src/components/Tooltip/Popper.tsx b/packages/grafana-ui/src/components/Tooltip/Popper.tsx index fd12e7db517..c393ed4bac5 100644 --- a/packages/grafana-ui/src/components/Tooltip/Popper.tsx +++ b/packages/grafana-ui/src/components/Tooltip/Popper.tsx @@ -1,7 +1,7 @@ -import React, { PureComponent } from 'react'; +import React, { PureComponent } from 'react'; import * as PopperJS from 'popper.js'; import { Manager, Popper as ReactPopper } from 'react-popper'; -import Portal from 'app/core/components/Portal/Portal'; +import { Portal } from '@grafana/ui'; import Transition from 'react-transition-group/Transition'; export enum Themes { diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts index 8b9b11404c2..d1205e6c291 100644 --- a/packages/grafana-ui/src/components/index.ts +++ b/packages/grafana-ui/src/components/index.ts @@ -1,2 +1,3 @@ export { DeleteButton } from './DeleteButton/DeleteButton'; export { Tooltip } from './Tooltip/Tooltip'; +export { Portal } from './Portal/Portal'; From 0b4d212bd2fe8a9ac198ae9478791356d277023b Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Wed, 9 Jan 2019 10:56:40 +0100 Subject: [PATCH 29/42] Fixing TS errors and updating snapshot --- packages/grafana-ui/src/components/Tooltip/Popper.tsx | 4 ++-- .../src/components/Tooltip/PopperController.tsx | 4 ++-- .../teams/__snapshots__/TeamGroupSync.test.tsx.snap | 8 ++++---- yarn.lock | 4 ++-- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/grafana-ui/src/components/Tooltip/Popper.tsx b/packages/grafana-ui/src/components/Tooltip/Popper.tsx index c393ed4bac5..b405d4c4328 100644 --- a/packages/grafana-ui/src/components/Tooltip/Popper.tsx +++ b/packages/grafana-ui/src/components/Tooltip/Popper.tsx @@ -1,4 +1,4 @@ -import React, { PureComponent } from 'react'; +import React, { PureComponent } from 'react'; import * as PopperJS from 'popper.js'; import { Manager, Popper as ReactPopper } from 'react-popper'; import { Portal } from '@grafana/ui'; @@ -14,7 +14,7 @@ const defaultTransitionStyles = { opacity: 0, }; -const transitionStyles = { +const transitionStyles: {[key: string]: object} = { exited: { opacity: 0 }, entering: { opacity: 0 }, entered: { opacity: 1 }, diff --git a/packages/grafana-ui/src/components/Tooltip/PopperController.tsx b/packages/grafana-ui/src/components/Tooltip/PopperController.tsx index 1b6703c3627..5f4010ac58a 100644 --- a/packages/grafana-ui/src/components/Tooltip/PopperController.tsx +++ b/packages/grafana-ui/src/components/Tooltip/PopperController.tsx @@ -50,10 +50,10 @@ class PopperController extends React.Component { componentWillReceiveProps(nextProps: Props) { if (nextProps.placement && nextProps.placement !== this.state.placement) { - this.setState(prevState => { + this.setState((prevState: State) => { return { ...prevState, - placement: nextProps.placement, + placement: nextProps.placement || 'auto', }; }); } diff --git a/public/app/features/teams/__snapshots__/TeamGroupSync.test.tsx.snap b/public/app/features/teams/__snapshots__/TeamGroupSync.test.tsx.snap index ac26dba88ed..e28eb86dc7a 100644 --- a/public/app/features/teams/__snapshots__/TeamGroupSync.test.tsx.snap +++ b/public/app/features/teams/__snapshots__/TeamGroupSync.test.tsx.snap @@ -10,7 +10,7 @@ exports[`Render should render component 1`] = ` > External group sync - @@ -21,7 +21,7 @@ exports[`Render should render component 1`] = ` className="gicon gicon-question gicon--has-hover" />
-
+
@@ -119,7 +119,7 @@ exports[`Render should render groups table 1`] = ` > External group sync - @@ -130,7 +130,7 @@ exports[`Render should render groups table 1`] = ` className="gicon gicon-question gicon--has-hover" />
-
+
diff --git a/yarn.lock b/yarn.lock index ae8c1dc5e06..23ebebb689c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1112,7 +1112,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^16.1.0", "@types/react@^16.7.6": +"@types/react@*", "@types/react@16.7.6", "@types/react@^16.1.0", "@types/react@^16.7.6": version "16.7.6" resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.6.tgz#80e4bab0d0731ad3ae51f320c4b08bdca5f03040" integrity sha512-QBUfzftr/8eg/q3ZRgf/GaDP6rTYc7ZNem+g4oZM38C9vXyV8AWRWaTQuW5yCoZTsfHrN7b3DeEiUnqH9SrnpA== @@ -3175,7 +3175,7 @@ caniuse-api@^1.5.2: lodash.memoize "^4.1.2" lodash.uniq "^4.5.0" -caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639: +caniuse-db@1.0.30000772, caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639: version "1.0.30000772" resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000772.tgz#51aae891768286eade4a3d8319ea76d6a01b512b" integrity sha1-UarokXaChureSj2DGep21qAbUSs= From 7fea1f84c0f5a206ba393e1406b35e82b2163a35 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Fri, 14 Dec 2018 16:10:16 +0100 Subject: [PATCH 30/42] build: release of debs to our debian repo. --- .circleci/config.yml | 12 +++++++- scripts/build/load-signing-key.sh | 7 +++++ scripts/build/update_repo/aptly.conf | 27 ++++++++++++++++++ scripts/build/update_repo/sign-repo.sh | 7 +++++ scripts/build/update_repo/update-deb.sh | 38 +++++++++++++++++++++++++ scripts/build/update_repo/update-rpm.sh | 1 + 6 files changed, 91 insertions(+), 1 deletion(-) create mode 100644 scripts/build/load-signing-key.sh create mode 100644 scripts/build/update_repo/aptly.conf create mode 100755 scripts/build/update_repo/sign-repo.sh create mode 100755 scripts/build/update_repo/update-deb.sh create mode 100755 scripts/build/update_repo/update-rpm.sh diff --git a/.circleci/config.yml b/.circleci/config.yml index dba6c5f8bd0..1a1617ed407 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -398,8 +398,9 @@ jobs: deploy-release: docker: - - image: grafana/grafana-ci-deploy:1.0.0 + - image: xlson/aptly-ci:0.1 steps: + - checkout - attach_workspace: at: . - run: @@ -417,6 +418,15 @@ jobs: - run: name: Deploy to Grafana.com command: './scripts/build/publish.sh' + - run: + name: Load GPG private key + comand: './scripts/build/load-signing-key.sh' + - run: + name: Update Debian repository + command: './scripts/build/update_repo/update-deb.sh "oss" "$GPG_KEY_PASSWORD"' + - run: + name: Update RPM repository + command: 'ls' workflows: version: 2 diff --git a/scripts/build/load-signing-key.sh b/scripts/build/load-signing-key.sh new file mode 100644 index 00000000000..aa70d289443 --- /dev/null +++ b/scripts/build/load-signing-key.sh @@ -0,0 +1,7 @@ +#!/usr/bin/env bash + +set -e + +git clone git@github.com:torkelo/private.git ~/private-repo +gpg --batch --allow-secret-key-import --import ~/private-repo/signing/private.key +pkill gpg-agent \ No newline at end of file diff --git a/scripts/build/update_repo/aptly.conf b/scripts/build/update_repo/aptly.conf new file mode 100644 index 00000000000..5d2a64cd88d --- /dev/null +++ b/scripts/build/update_repo/aptly.conf @@ -0,0 +1,27 @@ +{ + "rootDir": "/deb-repo/db", + "downloadConcurrency": 4, + "downloadSpeedLimit": 0, + "architectures": [], + "dependencyFollowSuggests": false, + "dependencyFollowRecommends": false, + "dependencyFollowAllVariants": false, + "dependencyFollowSource": false, + "dependencyVerboseResolve": false, + "gpgDisableSign": false, + "gpgDisableVerify": false, + "gpgProvider": "gpg2", + "downloadSourcePackages": false, + "skipLegacyPool": true, + "ppaDistributorID": "ubuntu", + "ppaCodename": "", + "skipContentsPublishing": false, + "FileSystemPublishEndpoints": { + "repo": { + "rootDir": "/deb-repo/repo", + "linkMethod": "copy" + } + }, + "S3PublishEndpoints": {}, + "SwiftPublishEndpoints": {} +} diff --git a/scripts/build/update_repo/sign-repo.sh b/scripts/build/update_repo/sign-repo.sh new file mode 100755 index 00000000000..eb2922104fe --- /dev/null +++ b/scripts/build/update_repo/sign-repo.sh @@ -0,0 +1,7 @@ +#!/usr/bin/env expect + +set password [lindex $argv 0] +spawn aptly publish repo grafana filesystem:repo:grafana +expect "Enter passphrase: " +send -- "$password\r" +expect eof diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh new file mode 100755 index 00000000000..08f5bd7ef6f --- /dev/null +++ b/scripts/build/update_repo/update-deb.sh @@ -0,0 +1,38 @@ +#!/usr/bin/env bash + +RELEASE_TYPE="${1:-}" +GPG_PASS="${2:-}" + +if [ -z "$RELEASE_TYPE" -o -z "$GPG_PASS" ]; then + exit 1 +fi + +set -e + +# Setup environment +cp scripts/build/update_repo/aptly.conf /etc/aptly.conf +mkdir -p /deb-repo/db +mkdir -p /deb-repo/repo + +# Download the database +gsutil -m rsync -r gs://grafana-aptly-db/repo-db /deb-repo/db + +# Add the new release to the repo +set +e +aptly publish drop squeeze filesystem:repo:grafana +set -e +aptly repo add grafana ./dist + +# Setup signing and sign the repo + +echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf +echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf + +./scripts/build/update_repo/sign-repo.sh "$GPG_PASS" + +# Update the repo and db on gcp +gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db +gsutil -m rsync -r -d /deb-repo/repo/grafana "gs://grafana-repo/$RELEASE_TYPE/deb" + +# usage: +# deb https://grafana-repo.storage.googleapis.com/oss/deb squeeze main \ No newline at end of file diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh new file mode 100755 index 00000000000..212c4ba239e --- /dev/null +++ b/scripts/build/update_repo/update-rpm.sh @@ -0,0 +1 @@ +#!/usr/bin/env bash \ No newline at end of file From a26a10cfd1ea2b0e571953aef1ca893746989cc9 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Mon, 17 Dec 2018 11:09:35 +0100 Subject: [PATCH 31/42] build: repo update input error. --- scripts/build/update_repo/update-deb.sh | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index 08f5bd7ef6f..d1694f0fee0 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -4,6 +4,7 @@ RELEASE_TYPE="${1:-}" GPG_PASS="${2:-}" if [ -z "$RELEASE_TYPE" -o -z "$GPG_PASS" ]; then + echo "Both RELEASE_TYPE (arg 1) and GPG_PASS (arg 2) has to be set" exit 1 fi @@ -35,4 +36,7 @@ gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db gsutil -m rsync -r -d /deb-repo/repo/grafana "gs://grafana-repo/$RELEASE_TYPE/deb" # usage: -# deb https://grafana-repo.storage.googleapis.com/oss/deb squeeze main \ No newline at end of file +# deb https://grafana-repo.storage.googleapis.com/oss/deb squeeze main +# +# later: +# deb https://repo.grafana.com/oss/deb squeeze main From c3e23d7574face9ef72747faca1b1e92da9bc9d2 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Mon, 17 Dec 2018 17:19:55 +0100 Subject: [PATCH 32/42] build: rpm repo deploy. --- .circleci/config.yml | 2 +- .../{sign-repo.sh => sign-deb-repo.sh} | 0 scripts/build/update_repo/sign-rpm-repo.sh | 7 +++ scripts/build/update_repo/update-deb.sh | 2 +- scripts/build/update_repo/update-rpm.sh | 44 ++++++++++++++++++- 5 files changed, 52 insertions(+), 3 deletions(-) rename scripts/build/update_repo/{sign-repo.sh => sign-deb-repo.sh} (100%) create mode 100755 scripts/build/update_repo/sign-rpm-repo.sh diff --git a/.circleci/config.yml b/.circleci/config.yml index 1a1617ed407..b5c123bad58 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -426,7 +426,7 @@ jobs: command: './scripts/build/update_repo/update-deb.sh "oss" "$GPG_KEY_PASSWORD"' - run: name: Update RPM repository - command: 'ls' + command: './scripts/build/update_repo/update-rpm.sh "oss" "$GPG_KEY_PASSWORD"' workflows: version: 2 diff --git a/scripts/build/update_repo/sign-repo.sh b/scripts/build/update_repo/sign-deb-repo.sh similarity index 100% rename from scripts/build/update_repo/sign-repo.sh rename to scripts/build/update_repo/sign-deb-repo.sh diff --git a/scripts/build/update_repo/sign-rpm-repo.sh b/scripts/build/update_repo/sign-rpm-repo.sh new file mode 100755 index 00000000000..f7e80756127 --- /dev/null +++ b/scripts/build/update_repo/sign-rpm-repo.sh @@ -0,0 +1,7 @@ +#!/usr/bin/env expect + +set password [lindex $argv 0] +spawn gpg --detach-sign --armor /rpm-repo/repodata/repomd.xml +expect "Enter passphrase: " +send -- "$password\r" +expect eof diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index d1694f0fee0..f2eb2f0dfd3 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -29,7 +29,7 @@ aptly repo add grafana ./dist echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf -./scripts/build/update_repo/sign-repo.sh "$GPG_PASS" +./scripts/build/update_repo/sign-deb-repo.sh "$GPG_PASS" # Update the repo and db on gcp gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh index 212c4ba239e..ca943957fe4 100755 --- a/scripts/build/update_repo/update-rpm.sh +++ b/scripts/build/update_repo/update-rpm.sh @@ -1 +1,43 @@ -#!/usr/bin/env bash \ No newline at end of file +#!/usr/bin/env bash + +RELEASE_TYPE="${1:-}" +GPG_PASS="${2:-}" + +if [ -z "$RELEASE_TYPE" -o -z "$GPG_PASS" ]; then + echo "Both RELEASE_TYPE (arg 1) and GPG_PASS (arg 2) has to be set" + exit 1 +fi + +set -e + +# Setup environment +mkdir -p /rpm-repo + +# Download the database +gsutil -m rsync -r "gs://grafana-repo/$RELEASE_TYPE/rpm" /rpm-repo + +# Add the new release to the repo +cp ./dist/*.rpm /rpm-repo +cd /rpm-repo +createrepo . + +# Setup signing and sign the repo + +echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf +echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf + +./scripts/build/update_repo/sign-rpm-repo.sh "$GPG_PASS" + +# Update the repo and db on gcp +gsutil -m rsync -r -d /rpm-repo "gs://grafana-repo/$RELEASE_TYPE/rpm" + +# usage: +# [grafana] +# name=grafana +# baseurl=https://grafana-repo.storage.googleapis.com/oss/rpm +# repo_gpgcheck=1 +# enabled=1 +# gpgcheck=1 +# gpgkey=https://grafana-repo.storage.googleapis.com/gpg.key https://grafanarel.s3.amazonaws.com/RPM-GPG-KEY-grafana +# sslverify=1 +# sslcacert=/etc/pki/tls/certs/ca-bundle.crt# later: From 919617ef963037c44c223c8e1ed8240c87392608 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Tue, 18 Dec 2018 15:30:51 +0100 Subject: [PATCH 33/42] build: only adds the correct packages to the repo. --- scripts/build/update_repo/update-deb.sh | 7 ++++--- scripts/build/update_repo/update-rpm.sh | 1 + 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index f2eb2f0dfd3..15c555d3426 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -14,14 +14,15 @@ set -e cp scripts/build/update_repo/aptly.conf /etc/aptly.conf mkdir -p /deb-repo/db mkdir -p /deb-repo/repo +mkdir -p /deb-repo/tmp # Download the database gsutil -m rsync -r gs://grafana-aptly-db/repo-db /deb-repo/db # Add the new release to the repo -set +e -aptly publish drop squeeze filesystem:repo:grafana -set -e +aptly publish drop squeeze filesystem:repo:grafana || true +cp ./dist/*.deb /deb-repo/tmp +rm /deb-repo/tmp/grafana_latest*.deb || true aptly repo add grafana ./dist # Setup signing and sign the repo diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh index ca943957fe4..b89468938a6 100755 --- a/scripts/build/update_repo/update-rpm.sh +++ b/scripts/build/update_repo/update-rpm.sh @@ -18,6 +18,7 @@ gsutil -m rsync -r "gs://grafana-repo/$RELEASE_TYPE/rpm" /rpm-repo # Add the new release to the repo cp ./dist/*.rpm /rpm-repo +rm /rpm-repo/grafana-latest-1*.rpm || true cd /rpm-repo createrepo . From 31066aebb423ad5935d20449df85ef138ae1d772 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Thu, 20 Dec 2018 11:11:20 +0100 Subject: [PATCH 34/42] build: handles unexpected cases. --- scripts/build/update_repo/update-deb.sh | 5 +++-- scripts/build/update_repo/update-rpm.sh | 2 ++ 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index 15c555d3426..9184ed0369b 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -33,11 +33,12 @@ echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf ./scripts/build/update_repo/sign-deb-repo.sh "$GPG_PASS" # Update the repo and db on gcp -gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db +gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db # TODO: support separate enterprise db gsutil -m rsync -r -d /deb-repo/repo/grafana "gs://grafana-repo/$RELEASE_TYPE/deb" # usage: # deb https://grafana-repo.storage.googleapis.com/oss/deb squeeze main # # later: -# deb https://repo.grafana.com/oss/deb squeeze main +# curl https://packages.grafana.com/gpg.key | apt-key add - +# deb https://packages.grafana.com/oss/deb squeeze main diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh index b89468938a6..a98d00a108d 100755 --- a/scripts/build/update_repo/update-rpm.sh +++ b/scripts/build/update_repo/update-rpm.sh @@ -27,6 +27,8 @@ createrepo . echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf +rm /rpm-repo/repodata/repomd.xml.asc || true +pkill gpg-agent || true ./scripts/build/update_repo/sign-rpm-repo.sh "$GPG_PASS" # Update the repo and db on gcp From a98c75121f7d30c5fda3ae8b6e0070501faf7e99 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Fri, 21 Dec 2018 12:26:31 +0100 Subject: [PATCH 35/42] build: adds aptly and createrepo to deploy tools. --- scripts/build/ci-deploy/Dockerfile | 26 ++++++++++++++++++++++--- scripts/build/ci-deploy/build-deploy.sh | 2 +- 2 files changed, 24 insertions(+), 4 deletions(-) diff --git a/scripts/build/ci-deploy/Dockerfile b/scripts/build/ci-deploy/Dockerfile index deef612e761..f6683f9663c 100644 --- a/scripts/build/ci-deploy/Dockerfile +++ b/scripts/build/ci-deploy/Dockerfile @@ -1,5 +1,25 @@ +FROM circleci/golang:1.11 + +RUN git clone https://github.com/aptly-dev/aptly $GOPATH/src/github.com/aptly-dev/aptly && \ + cd $GOPATH/src/github.com/aptly-dev/aptly && \ + # pin aptly to a specific commit after 1.3.0 that contains gpg2 support + git reset --hard a64807efdaf5e380bfa878c71bc88eae10d62be1 && \ + make install + FROM circleci/python:2.7-stretch -RUN sudo pip install awscli && \ - curl https://dl.google.com/dl/cloudsdk/channels/rapid/downloads/google-cloud-sdk-222.0.0-linux-x86_64.tar.gz | \ - sudo tar xvzf - -C /opt +ENV PATH=$PATH:/opt/google-cloud-sdk/bin + +USER root + +RUN pip install awscli && \ + curl https://dl.google.com/dl/cloudsdk/channels/rapid/downloads/google-cloud-sdk-222.0.0-linux-x86_64.tar.gz | \ + tar xvzf - -C /opt && \ + apt update && \ + apt install -y createrepo expect && \ + apt-get autoremove -y && \ + rm -rf /var/lib/apt/lists/* + +COPY --from=0 /go/bin/aptly /usr/local/bin/aptly + +USER circleci diff --git a/scripts/build/ci-deploy/build-deploy.sh b/scripts/build/ci-deploy/build-deploy.sh index c9ce805b30b..818f91013ac 100755 --- a/scripts/build/ci-deploy/build-deploy.sh +++ b/scripts/build/ci-deploy/build-deploy.sh @@ -1,6 +1,6 @@ #!/bin/bash -_version="1.0.0" +_version="1.1.0" _tag="grafana/grafana-ci-deploy:${_version}" docker build -t $_tag . From 89956a6a41f1d31c7a57fe46cb9da65dbfe1f6e7 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Fri, 21 Dec 2018 12:32:01 +0100 Subject: [PATCH 36/42] build: uses official deployment image. --- .circleci/config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.circleci/config.yml b/.circleci/config.yml index b5c123bad58..8cbb124d7c3 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -398,7 +398,7 @@ jobs: deploy-release: docker: - - image: xlson/aptly-ci:0.1 + - image: grafana/grafana-ci-deploy:1.1.0 steps: - checkout - attach_workspace: From bbbeb78c17480c5f002c1f61cdb0bc4875495d96 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Fri, 4 Jan 2019 10:18:44 +0100 Subject: [PATCH 37/42] build: makes repo update enterprise compatible. --- scripts/build/update_repo/update-deb.sh | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index 9184ed0369b..92b0940d396 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -17,7 +17,7 @@ mkdir -p /deb-repo/repo mkdir -p /deb-repo/tmp # Download the database -gsutil -m rsync -r gs://grafana-aptly-db/repo-db /deb-repo/db +gsutil -m rsync -r "gs://grafana-aptly-db/$RELEASE_TYPE" /deb-repo/db # Add the new release to the repo aptly publish drop squeeze filesystem:repo:grafana || true @@ -33,12 +33,9 @@ echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf ./scripts/build/update_repo/sign-deb-repo.sh "$GPG_PASS" # Update the repo and db on gcp -gsutil -m rsync -r -d /deb-repo/db gs://grafana-aptly-db/repo-db # TODO: support separate enterprise db +gsutil -m rsync -r -d /deb-repo/db "gs://grafana-aptly-db/$RELEASE_TYPE" gsutil -m rsync -r -d /deb-repo/repo/grafana "gs://grafana-repo/$RELEASE_TYPE/deb" # usage: -# deb https://grafana-repo.storage.googleapis.com/oss/deb squeeze main -# -# later: # curl https://packages.grafana.com/gpg.key | apt-key add - -# deb https://packages.grafana.com/oss/deb squeeze main +# deb https://packages.grafana.com/oss/deb stable main From 8f5886e6d444a2933c3d9912ed5cc0b8bd4b26f1 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Fri, 4 Jan 2019 16:35:17 +0100 Subject: [PATCH 38/42] refactoring --- scripts/build/update_repo/update-deb.sh | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index 92b0940d396..bc6833d07f2 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -12,9 +12,9 @@ set -e # Setup environment cp scripts/build/update_repo/aptly.conf /etc/aptly.conf -mkdir -p /deb-repo/db -mkdir -p /deb-repo/repo -mkdir -p /deb-repo/tmp +mkdir -p /deb-repo/db \ + /deb-repo/repo \ + /deb-repo/tmp # Download the database gsutil -m rsync -r "gs://grafana-aptly-db/$RELEASE_TYPE" /deb-repo/db From b9c4eb70b13a4ee9a5eae150ee8ef02480ed2ad7 Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Tue, 8 Jan 2019 16:20:26 +0100 Subject: [PATCH 39/42] build: publishes beta releases to separate repos. --- .circleci/config.yml | 4 ++-- .../{sign-deb-repo.sh => unlock-gpg-key.sh} | 2 +- scripts/build/update_repo/update-deb.sh | 23 +++++++++++++++---- scripts/build/update_repo/update-rpm.sh | 17 ++++++++++++-- 4 files changed, 37 insertions(+), 9 deletions(-) rename scripts/build/update_repo/{sign-deb-repo.sh => unlock-gpg-key.sh} (66%) diff --git a/.circleci/config.yml b/.circleci/config.yml index 8cbb124d7c3..58357c1d490 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -423,10 +423,10 @@ jobs: comand: './scripts/build/load-signing-key.sh' - run: name: Update Debian repository - command: './scripts/build/update_repo/update-deb.sh "oss" "$GPG_KEY_PASSWORD"' + command: './scripts/build/update_repo/update-deb.sh "oss" "$GPG_KEY_PASSWORD" "$CIRCLE_TAG"' - run: name: Update RPM repository - command: './scripts/build/update_repo/update-rpm.sh "oss" "$GPG_KEY_PASSWORD"' + command: './scripts/build/update_repo/update-rpm.sh "oss" "$GPG_KEY_PASSWORD" "$CIRCLE_TAG"' workflows: version: 2 diff --git a/scripts/build/update_repo/sign-deb-repo.sh b/scripts/build/update_repo/unlock-gpg-key.sh similarity index 66% rename from scripts/build/update_repo/sign-deb-repo.sh rename to scripts/build/update_repo/unlock-gpg-key.sh index eb2922104fe..82f981809c2 100755 --- a/scripts/build/update_repo/sign-deb-repo.sh +++ b/scripts/build/update_repo/unlock-gpg-key.sh @@ -1,7 +1,7 @@ #!/usr/bin/env expect set password [lindex $argv 0] -spawn aptly publish repo grafana filesystem:repo:grafana +spawn gpg --detach-sign --armor /tmp/sign-this expect "Enter passphrase: " send -- "$password\r" expect eof diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index bc6833d07f2..b08ff36149f 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -2,12 +2,23 @@ RELEASE_TYPE="${1:-}" GPG_PASS="${2:-}" +RELEASE_TAG="${3:-}" +REPO="grafana" if [ -z "$RELEASE_TYPE" -o -z "$GPG_PASS" ]; then echo "Both RELEASE_TYPE (arg 1) and GPG_PASS (arg 2) has to be set" exit 1 fi +if [[ "$RELEASE_TYPE" != "oss" && "$RELEASE_TYPE" != "enterprise" ]]; then + echo "RELEASE_TYPE (arg 1) must be either oss or enterprise." + exit 1 +fi + +if echo "$RELEASE_TAG" | grep -q "beta"; then + REPO="beta" +fi + set -e # Setup environment @@ -20,22 +31,26 @@ mkdir -p /deb-repo/db \ gsutil -m rsync -r "gs://grafana-aptly-db/$RELEASE_TYPE" /deb-repo/db # Add the new release to the repo -aptly publish drop squeeze filesystem:repo:grafana || true +aptly publish drop grafana filesystem:repo:grafana || true +aptly publish drop beta filesystem:repo:grafana || true cp ./dist/*.deb /deb-repo/tmp rm /deb-repo/tmp/grafana_latest*.deb || true -aptly repo add grafana ./dist +aptly repo add "$REPO" ./dist # Setup signing and sign the repo echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf -./scripts/build/update_repo/sign-deb-repo.sh "$GPG_PASS" +./scripts/build/update_repo/unlock-gpg-key.sh "$GPG_PASS" + +aptly publish repo grafana filesystem:repo:grafana +aptly publish repo beta filesystem:repo:grafana # Update the repo and db on gcp gsutil -m rsync -r -d /deb-repo/db "gs://grafana-aptly-db/$RELEASE_TYPE" gsutil -m rsync -r -d /deb-repo/repo/grafana "gs://grafana-repo/$RELEASE_TYPE/deb" # usage: -# curl https://packages.grafana.com/gpg.key | apt-key add - +# # deb https://packages.grafana.com/oss/deb stable main diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh index a98d00a108d..26eb2c5b329 100755 --- a/scripts/build/update_repo/update-rpm.sh +++ b/scripts/build/update_repo/update-rpm.sh @@ -3,18 +3,31 @@ RELEASE_TYPE="${1:-}" GPG_PASS="${2:-}" +RELEASE_TAG="${3:-}" +REPO="rpm" + if [ -z "$RELEASE_TYPE" -o -z "$GPG_PASS" ]; then echo "Both RELEASE_TYPE (arg 1) and GPG_PASS (arg 2) has to be set" exit 1 fi +if [[ "$RELEASE_TYPE" != "oss" && "$RELEASE_TYPE" != "enterprise" ]]; then + echo "RELEASE_TYPE (arg 1) must be either oss or enterprise." + exit 1 +fi + +if echo "$RELEASE_TAG" | grep -q "beta"; then + REPO="rpm-beta" +fi + set -e # Setup environment +BUCKET="gs://grafana-repo/$RELEASE_TYPE/$REPO" mkdir -p /rpm-repo # Download the database -gsutil -m rsync -r "gs://grafana-repo/$RELEASE_TYPE/rpm" /rpm-repo +gsutil -m rsync -r "$BUCKET" /rpm-repo # Add the new release to the repo cp ./dist/*.rpm /rpm-repo @@ -32,7 +45,7 @@ pkill gpg-agent || true ./scripts/build/update_repo/sign-rpm-repo.sh "$GPG_PASS" # Update the repo and db on gcp -gsutil -m rsync -r -d /rpm-repo "gs://grafana-repo/$RELEASE_TYPE/rpm" +gsutil -m rsync -r -d /rpm-repo "$BUCKET" # usage: # [grafana] From 76e9607b25bfde8562c66550430474544339bb6c Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Tue, 8 Jan 2019 16:34:59 +0100 Subject: [PATCH 40/42] build: inline docs --- scripts/build/update_repo/update-rpm.sh | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/scripts/build/update_repo/update-rpm.sh b/scripts/build/update_repo/update-rpm.sh index 26eb2c5b329..caed3918216 100755 --- a/scripts/build/update_repo/update-rpm.sh +++ b/scripts/build/update_repo/update-rpm.sh @@ -50,10 +50,10 @@ gsutil -m rsync -r -d /rpm-repo "$BUCKET" # usage: # [grafana] # name=grafana -# baseurl=https://grafana-repo.storage.googleapis.com/oss/rpm +# baseurl=https://packages.grafana.com/oss/rpm # repo_gpgcheck=1 # enabled=1 # gpgcheck=1 -# gpgkey=https://grafana-repo.storage.googleapis.com/gpg.key https://grafanarel.s3.amazonaws.com/RPM-GPG-KEY-grafana +# gpgkey=https://packages.grafana.com/gpg.key # sslverify=1 -# sslcacert=/etc/pki/tls/certs/ca-bundle.crt# later: +# sslcacert=/etc/pki/tls/certs/ca-bundle.crt \ No newline at end of file From ad61bff3779b9079baeb01d56c00f51f73a6bcda Mon Sep 17 00:00:00 2001 From: Leonard Gram Date: Wed, 9 Jan 2019 11:17:21 +0100 Subject: [PATCH 41/42] build: deploys enterprise to its own repo. --- .circleci/config.yml | 16 +++++++++++++--- scripts/build/update_repo/update-deb.sh | 2 ++ 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/.circleci/config.yml b/.circleci/config.yml index 58357c1d490..236d5aec398 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -323,7 +323,7 @@ jobs: deploy-enterprise-master: docker: - - image: grafana/grafana-ci-deploy:1.0.0 + - image: grafana/grafana-ci-deploy:1.1.0 steps: - attach_workspace: at: . @@ -346,7 +346,7 @@ jobs: deploy-enterprise-release: docker: - - image: grafana/grafana-ci-deploy:1.0.0 + - image: grafana/grafana-ci-deploy:1.1.0 steps: - attach_workspace: at: . @@ -365,10 +365,20 @@ jobs: - run: name: Deploy to Grafana.com command: './scripts/build/publish.sh --enterprise' + - run: + name: Load GPG private key + comand: './scripts/build/load-signing-key.sh' + - run: + name: Update Debian repository + command: './scripts/build/update_repo/update-deb.sh "enterprise" "$GPG_KEY_PASSWORD" "$CIRCLE_TAG"' + - run: + name: Update RPM repository + command: './scripts/build/update_repo/update-rpm.sh "enterprise" "$GPG_KEY_PASSWORD" "$CIRCLE_TAG"' + deploy-master: docker: - - image: grafana/grafana-ci-deploy:1.0.0 + - image: grafana/grafana-ci-deploy:1.1.0 steps: - attach_workspace: at: . diff --git a/scripts/build/update_repo/update-deb.sh b/scripts/build/update_repo/update-deb.sh index b08ff36149f..89c5937b064 100755 --- a/scripts/build/update_repo/update-deb.sh +++ b/scripts/build/update_repo/update-deb.sh @@ -42,7 +42,9 @@ aptly repo add "$REPO" ./dist echo "allow-loopback-pinentry" > ~/.gnupg/gpg-agent.conf echo "pinentry-mode loopback" > ~/.gnupg/gpg.conf +touch /tmp/sign-this ./scripts/build/update_repo/unlock-gpg-key.sh "$GPG_PASS" +rm /tmp/sign-this /tmp/sign-this.asc aptly publish repo grafana filesystem:repo:grafana aptly publish repo beta filesystem:repo:grafana From 6e3225c29e399ce4d0837975773a2acb93cd61d7 Mon Sep 17 00:00:00 2001 From: Dominik Prokop Date: Wed, 9 Jan 2019 13:09:26 +0100 Subject: [PATCH 42/42] Removed unused refClassNameprops from Propper --- packages/grafana-ui/src/components/Tooltip/Popper.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/grafana-ui/src/components/Tooltip/Popper.tsx b/packages/grafana-ui/src/components/Tooltip/Popper.tsx index b405d4c4328..f6f9fa6f73a 100644 --- a/packages/grafana-ui/src/components/Tooltip/Popper.tsx +++ b/packages/grafana-ui/src/components/Tooltip/Popper.tsx @@ -26,7 +26,6 @@ interface Props extends React.DOMAttributes { show: boolean; placement?: PopperJS.Placement; content: string | ((props: any) => JSX.Element); - refClassName?: string; referenceElement: PopperJS.ReferenceObject; theme?: Themes; }