refactoring: custom scrollbars PR updated, #13175

This commit is contained in:
Torkel Ödegaard 2018-09-07 14:24:33 +02:00
parent 1415bed045
commit 35ef51dca9
4 changed files with 23 additions and 18 deletions

View File

@ -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();

View File

@ -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;

View File

@ -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={

View File

@ -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"