From 175b5e70b60f23dc446aba22da4f00d56aa2d624 Mon Sep 17 00:00:00 2001
From: Jorik Schellekens <joriksch@gmail.com>
Date: Tue, 28 Apr 2020 14:09:54 +0100
Subject: [PATCH] Lint Slider

---
 src/components/views/elements/Slider.tsx | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/components/views/elements/Slider.tsx b/src/components/views/elements/Slider.tsx
index 722401801c..6712ddd7fd 100644
--- a/src/components/views/elements/Slider.tsx
+++ b/src/components/views/elements/Slider.tsx
@@ -43,7 +43,7 @@ export default class Slider extends React.Component<IProps> {
     // y values.
     // Offset is used for finding the location of a value on a
     // non linear slider.
-    _offset(values: number[], value: number): number {
+    private offset(values: number[], value: number): number {
         // the index of the first number greater than value.
         let closest = values.reduce((prev, curr) => {
             return (value > curr ? prev + 1 : prev);
@@ -80,19 +80,21 @@ export default class Slider extends React.Component<IProps> {
                  disabled={this.props.disabled}
             />);
 
-        const offset = this._offset(this.props.values, this.props.value);
+        let selection = null;
+
+        if (this.props.disabled) {
+            const offset = this.offset(this.props.values, this.props.value);
+            selection = <div className="mx_Slider_selection">
+                <div className="mx_Slider_selectionDot" style={{left: "calc(-0.55em + " + offset + "%)"}} />
+                <hr style={{width: offset + "%"}} />
+            </div>
+        }
 
         return <div className="mx_Slider">
             <div>
                 <div className="mx_Slider_bar">
                     <hr />
-                    { this.props.disabled ?
-                        null :
-                        <div className="mx_Slider_selection">
-                            <div className="mx_Slider_selectionDot" style={{left: "calc(-0.55em + " + offset + "%)"}} />
-                            <hr style={{width: offset + "%"}} />
-                        </div>
-                    }
+                    { selection }
                 </div>
                 <div className="mx_Slider_dotContainer">
                     {dots}
@@ -102,7 +104,7 @@ export default class Slider extends React.Component<IProps> {
     }
 }
 
-type DotIProps = {
+interface IDotProps {
     // Callback for behavior onclick
     onClick: () => void,
 
@@ -116,7 +118,7 @@ type DotIProps = {
     disabled: boolean;
 }
 
-class Dot extends React.PureComponent<DotIProps> {
+class Dot extends React.PureComponent<IDotProps> {
     render(): React.ReactNode {
         let className = "mx_Slider_dot"
         if (!this.props.disabled && this.props.active) {