|
1 |
| -// @ts-nocheck |
| 1 | +/* eslint-disable react/sort-comp */ |
| 2 | +/* eslint-disable lines-between-class-members */ |
| 3 | +/* eslint-disable react/static-property-placement */ |
| 4 | +//@ts-nocheck |
2 | 5 | import * as React from 'react';
|
3 | 6 | import { Component } from 'react';
|
4 | 7 | import { Steps } from 'intro.js-react';
|
5 | 8 | import 'intro.js/introjs.css';
|
6 | 9 | import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
7 | 10 | import { faQuestion } from '@fortawesome/free-solid-svg-icons';
|
8 | 11 | import { tutorialSaveSeriesToggle, setCurrentTabInApp } from '../actions/actions';
|
9 |
| -import { element } from 'prop-types'; |
| 12 | + |
| 13 | +interface tutorialProps { |
| 14 | + dispatch: unknown; |
| 15 | + currentTabInApp: unknown; |
| 16 | +} |
10 | 17 |
|
11 | 18 | // This is the tutorial displayed when the "How to use" button is clicked
|
12 | 19 | // This needs to be a class component to be compatible with updateStepElement from intro.js
|
13 |
| -class Tutorial extends Component { |
14 |
| - constructor(props) { |
| 20 | +export default class Tutorial extends React.Component<tutorialProps> { |
| 21 | + constructor(props:tutorialProps) { |
15 | 22 | super(props);
|
16 | 23 | this.state = {
|
17 | 24 | stepsEnabled: false,
|
18 | 25 | };
|
19 | 26 | }
|
20 | 27 |
|
21 |
| - render() { |
| 28 | + public props: tutorialProps; |
| 29 | + render(): JSX.Element { |
22 | 30 | const { currentTabInApp, dispatch } = this.props;
|
23 |
| - |
| 31 | + |
24 | 32 | // This updates the steps so that they can target dynamically rendered elements
|
25 |
| - const onChangeHandler = (currentStepIndex: Number) => { |
| 33 | + const onChangeHandler = (currentStepIndex: number) => { |
26 | 34 | if (currentTabInApp === 'performance' && currentStepIndex === 1) {
|
27 | 35 | dispatch(tutorialSaveSeriesToggle('inputBoxOpen'));
|
28 | 36 | this.steps.updateStepElement(currentStepIndex);
|
@@ -58,15 +66,14 @@ class Tutorial extends Component {
|
58 | 66 | };
|
59 | 67 |
|
60 | 68 | interface stepsObj {
|
61 |
| - title: String, |
62 |
| - element?: String, |
63 |
| - intro: String, |
64 |
| - position: String, |
| 69 | + title: string, |
| 70 | + element?: string, |
| 71 | + intro: string, |
| 72 | + position: string, |
65 | 73 | }
|
66 | 74 |
|
67 | 75 | let steps: stepsObj[] = [];
|
68 | 76 |
|
69 |
| - |
70 | 77 | switch (currentTabInApp) {
|
71 | 78 | case 'map':
|
72 | 79 | steps = [{
|
@@ -210,9 +217,6 @@ class Tutorial extends Component {
|
210 | 217 | break;
|
211 | 218 | }
|
212 | 219 |
|
213 |
| - |
214 |
| - |
215 |
| - |
216 | 220 | return (
|
217 | 221 | <>
|
218 | 222 | <Steps
|
@@ -250,5 +254,3 @@ class Tutorial extends Component {
|
250 | 254 | );
|
251 | 255 | }
|
252 | 256 | }
|
253 |
| - |
254 |
| -export default Tutorial; |
|
0 commit comments