diff options
Diffstat (limited to 'src/components/ui/AppLoader/index.js')
-rw-r--r-- | src/components/ui/AppLoader/index.js | 79 |
1 files changed, 0 insertions, 79 deletions
diff --git a/src/components/ui/AppLoader/index.js b/src/components/ui/AppLoader/index.js deleted file mode 100644 index e00960200..000000000 --- a/src/components/ui/AppLoader/index.js +++ /dev/null | |||
@@ -1,79 +0,0 @@ | |||
1 | import { Component } from 'react'; | ||
2 | import PropTypes from 'prop-types'; | ||
3 | import injectSheet, { withTheme } from 'react-jss'; | ||
4 | import classnames from 'classnames'; | ||
5 | |||
6 | import FullscreenLoader from '../FullscreenLoader'; | ||
7 | import { shuffleArray } from '../../../helpers/array-helpers'; | ||
8 | |||
9 | import styles from './styles'; | ||
10 | |||
11 | // TODO: Need to externalize for i18n | ||
12 | const textList = shuffleArray([ | ||
13 | 'Adding free features', | ||
14 | 'Making application usable', | ||
15 | 'Removing unproductive paywalls', | ||
16 | 'Creating custom server software', | ||
17 | 'Increasing productivity', | ||
18 | 'Listening to our userbase', | ||
19 | 'Fixing bugs', | ||
20 | ]); | ||
21 | |||
22 | @injectSheet(styles) | ||
23 | @withTheme | ||
24 | class AppLoader extends Component { | ||
25 | static propTypes = { | ||
26 | classes: PropTypes.object.isRequired, | ||
27 | theme: PropTypes.object.isRequired, | ||
28 | texts: PropTypes.array, | ||
29 | }; | ||
30 | |||
31 | static defaultProps = { | ||
32 | texts: textList, | ||
33 | }; | ||
34 | |||
35 | state = { | ||
36 | step: 0, | ||
37 | }; | ||
38 | |||
39 | interval = null; | ||
40 | |||
41 | componentDidMount() { | ||
42 | this.interval = setInterval(() => { | ||
43 | this.setState(prevState => ({ | ||
44 | step: prevState.step === textList.length - 1 ? 0 : prevState.step + 1, | ||
45 | })); | ||
46 | }, 2500); | ||
47 | } | ||
48 | |||
49 | componentWillUnmount() { | ||
50 | clearInterval(this.interval); | ||
51 | } | ||
52 | |||
53 | render() { | ||
54 | const { classes, theme, texts } = this.props; | ||
55 | const { step } = this.state; | ||
56 | |||
57 | return ( | ||
58 | <FullscreenLoader | ||
59 | title="Ferdi" | ||
60 | className={classes.component} | ||
61 | spinnerColor={theme.colorAppLoaderSpinner} | ||
62 | > | ||
63 | {texts.map((text, i) => ( | ||
64 | <span | ||
65 | key={text} | ||
66 | className={classnames({ | ||
67 | [`${classes.slogan}`]: true, | ||
68 | [`${classes.visible}`]: step === i, | ||
69 | })} | ||
70 | > | ||
71 | {text} | ||
72 | </span> | ||
73 | ))} | ||
74 | </FullscreenLoader> | ||
75 | ); | ||
76 | } | ||
77 | } | ||
78 | |||
79 | export default AppLoader; | ||