From 35ef51dca91639295c171cc2f4337e2f537d00fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Fri, 7 Sep 2018 14:24:33 +0200
Subject: [PATCH] refactoring: custom scrollbars PR updated, #13175

---
 .../CustomScrollbar.test.tsx}                 |  8 +++---
 .../CustomScrollbar.tsx}                      | 25 +++++++++----------
 .../CustomScrollbar.test.tsx.snap}            |  2 +-
 yarn.lock                                     |  6 +++++
 4 files changed, 23 insertions(+), 18 deletions(-)
 rename public/app/core/components/{ScrollBar/GrafanaScrollbar.test.tsx => CustomScrollbar/CustomScrollbar.test.tsx} (63%)
 rename public/app/core/components/{ScrollBar/GrafanaScrollbar.tsx => CustomScrollbar/CustomScrollbar.tsx} (70%)
 rename public/app/core/components/{ScrollBar/__snapshots__/GrafanaScrollbar.test.tsx.snap => CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap} (96%)

diff --git a/public/app/core/components/ScrollBar/GrafanaScrollbar.test.tsx b/public/app/core/components/CustomScrollbar/CustomScrollbar.test.tsx
similarity index 63%
rename from public/app/core/components/ScrollBar/GrafanaScrollbar.test.tsx
rename to public/app/core/components/CustomScrollbar/CustomScrollbar.test.tsx
index 7e519acd29d..4edcf7313db 100644
--- a/public/app/core/components/ScrollBar/GrafanaScrollbar.test.tsx
+++ b/public/app/core/components/CustomScrollbar/CustomScrollbar.test.tsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import GrafanaScrollbar from './GrafanaScrollbar';
+import CustomScrollbar from './CustomScrollbar';
 
-describe('GrafanaScrollbar', () => {
+describe('CustomScrollbar', () => {
   it('renders correctly', () => {
     const tree = renderer
       .create(
-        <GrafanaScrollbar>
+        <CustomScrollbar>
           <p>Scrollable content</p>
-        </GrafanaScrollbar>
+        </CustomScrollbar>
       )
       .toJSON();
     expect(tree).toMatchSnapshot();
diff --git a/public/app/core/components/ScrollBar/GrafanaScrollbar.tsx b/public/app/core/components/CustomScrollbar/CustomScrollbar.tsx
similarity index 70%
rename from public/app/core/components/ScrollBar/GrafanaScrollbar.tsx
rename to public/app/core/components/CustomScrollbar/CustomScrollbar.tsx
index 24e5b0d8828..8be65249808 100644
--- a/public/app/core/components/ScrollBar/GrafanaScrollbar.tsx
+++ b/public/app/core/components/CustomScrollbar/CustomScrollbar.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
+import React, { PureComponent } from 'react';
 import Scrollbars from 'react-custom-scrollbars';
 
-interface GrafanaScrollBarProps {
+interface Props {
   customClassName?: string;
   autoHide?: boolean;
   autoHideTimeout?: number;
@@ -9,19 +9,18 @@ interface GrafanaScrollBarProps {
   hideTracksWhenNotNeeded?: boolean;
 }
 
-const grafanaScrollBarDefaultProps: Partial<GrafanaScrollBarProps> = {
-  customClassName: 'custom-scrollbars',
-  autoHide: true,
-  autoHideTimeout: 200,
-  autoHideDuration: 200,
-  hideTracksWhenNotNeeded: false,
-};
-
 /**
  * Wraps component into <Scrollbars> component from `react-custom-scrollbars`
  */
-class GrafanaScrollbar extends React.Component<GrafanaScrollBarProps> {
-  static defaultProps = grafanaScrollBarDefaultProps;
+class CustomScrollbar extends PureComponent<Props> {
+
+  static defaultProps: Partial<Props> = {
+    customClassName: 'custom-scrollbars',
+    autoHide: true,
+    autoHideTimeout: 200,
+    autoHideDuration: 200,
+    hideTracksWhenNotNeeded: false,
+  };
 
   render() {
     const { customClassName, children, ...scrollProps } = this.props;
@@ -45,4 +44,4 @@ class GrafanaScrollbar extends React.Component<GrafanaScrollBarProps> {
   }
 }
 
-export default GrafanaScrollbar;
+export default CustomScrollbar;
diff --git a/public/app/core/components/ScrollBar/__snapshots__/GrafanaScrollbar.test.tsx.snap b/public/app/core/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap
similarity index 96%
rename from public/app/core/components/ScrollBar/__snapshots__/GrafanaScrollbar.test.tsx.snap
rename to public/app/core/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap
index 8e4f51e3587..37d8cea45be 100644
--- a/public/app/core/components/ScrollBar/__snapshots__/GrafanaScrollbar.test.tsx.snap
+++ b/public/app/core/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`GrafanaScrollbar renders correctly 1`] = `
+exports[`CustomScrollbar renders correctly 1`] = `
 <div
   className="custom-scrollbars"
   style={
diff --git a/yarn.lock b/yarn.lock
index 54f7572d5d2..14712fa399b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -240,6 +240,12 @@
   version "8.10.17"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-8.10.17.tgz#d48cf10f0dc6dcf59f827f5a3fc7a4a6004318d3"
 
+"@types/react-custom-scrollbars@^4.0.5":
+  version "4.0.5"
+  resolved "https://registry.yarnpkg.com/@types/react-custom-scrollbars/-/react-custom-scrollbars-4.0.5.tgz#8629b4b3164914d27df7cb0ca0a086c0ad406389"
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-dom@^16.0.3":
   version "16.0.6"
   resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.6.tgz#f1a65a4e7be8ed5d123f8b3b9eacc913e35a1a3c"