Merge pull request #15713 from grafana/scrollbar-right-side

Fixed right side scrollbar margin on dashboard page

packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx

@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react';
+import React, { Component } from 'react';
 import isNil from 'lodash/isNil';
 import classNames from 'classnames';
 import Scrollbars from 'react-custom-scrollbars';
@@ -20,7 +20,7 @@ interface Props {
 /**
  * Wraps component into <Scrollbars> component from `react-custom-scrollbars`
  */
-export class CustomScrollbar extends PureComponent<Props> {
+export class CustomScrollbar extends Component<Props> {
   static defaultProps: Partial<Props> = {
     autoHide: false,
     autoHideTimeout: 200,

public/app/features/dashboard/containers/DashboardPage.tsx

@@ -268,7 +268,12 @@ export class DashboardPage extends PureComponent<Props, State> {
           onAddPanel={this.onAddPanel}
         />
         <div className="scroll-canvas scroll-canvas--dashboard">
-          <CustomScrollbar autoHeightMin={'100%'} setScrollTop={this.setScrollTop} scrollTop={scrollTop}>
+          <CustomScrollbar
+            autoHeightMin={'100%'}
+            setScrollTop={this.setScrollTop}
+            scrollTop={scrollTop}
+            className="custom-scrollbar--page"
+          >
             {editview && <DashboardSettings dashboard={dashboard} />}
 
             {initError && this.renderInitFailedState()}

public/app/features/dashboard/containers/__snapshots__/DashboardPage.test.tsx.snap

@@ -109,6 +109,7 @@ exports[`DashboardPage Dashboard init completed  Should render dashboard grid 1`
       autoHide={false}
       autoHideDuration={200}
       autoHideTimeout={200}
+      className="custom-scrollbar--page"
       hideTracksWhenNotNeeded={false}
       scrollTop={0}
       setScrollTop={[Function]}
@@ -344,6 +345,7 @@ exports[`DashboardPage When dashboard has editview url state should render setti
       autoHide={false}
       autoHideDuration={200}
       autoHideTimeout={200}
+      className="custom-scrollbar--page"
       hideTracksWhenNotNeeded={false}
       scrollTop={0}
       setScrollTop={[Function]}