Merge pull request #1424 from mattermost/plt-1113

PLT-1113 Tutorial tip dots are now clickable

1 files changed, 14 insertions, 13 deletions

diff --git a/web/react/components/tutorial/tutorial_tip.jsx b/web/react/components/tutorial/tutorial_tip.jsx
index 75d73e920..dd231b816 100644
--- a/web/react/components/tutorial/tutorial_tip.jsx
+++ b/web/react/components/tutorial/tutorial_tip.jsx
@@ -51,21 +51,22 @@ export default class TutorialTip extends React.Component {
         const dots = [];
         if (this.props.screens.length > 1) {
             for (let i = 0; i < this.props.screens.length; i++) {
+                let className = 'circle';
                 if (i === this.state.currentScreen) {
-                    dots.push(
-                        <div
-                            className='circle active'
-                            key={'dotactive' + i}
-                        />
-                    );
-                } else {
-                    dots.push(
-                        <div
-                            className='circle'
-                            key={'dotinactive' + i}
-                        />
-                    );
+                    className += ' active';
                 }
+
+                dots.push(
+                    <a
+                        href='#'
+                        key={'dotactive' + i}
+                        className={className}
+                        onClick={(e) => { //eslint-disable-line no-loop-func
+                            e.preventDefault();
+                            this.setState({currentScreen: i});
+                        }}
+                    />
+                );
             }
         }