forked from Dadidam/gladiator
-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
63 lines (52 loc) · 1.82 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
import React from 'react';
import { Layout } from 'antd';
import { connect } from 'react-redux';
import * as storage from 'services/localStorage';
import Hero from 'Hero/Main';
import AppBody from './components/UI/Body';
import AppHeader from './components/UI/Header';
import AppFooter from './components/UI/Footer';
import './index.less';
const {Content, Header, Sider} = Layout;
class App extends React.Component {
componentWillReceiveProps(nextProps) {
if (nextProps.hero) {
let heroes = [];
nextProps.player.heroes.forEach((char) => {
const character = char.id === nextProps.hero.id ? nextProps.hero : char;
heroes.push(character);
});
nextProps.player.heroes = heroes;
storage.set('player', nextProps.player);
}
}
render() {
const player = this.props.player;
const hasActiveHero = player && player.activeHeroId;
const hero = this.props.hero;
return (
<Layout>
<Header className="header">
<AppHeader showMainMenu={hasActiveHero} />
</Header>
<Content className="appContent">
<Layout className="appLayout whiteBg">
{hasActiveHero ?
<Sider width={200} className="whiteBg leftPanel">
<Hero />
</Sider>
: null
}
<AppBody hero={hero} player={player} />
</Layout>
</Content>
<AppFooter />
</Layout>
)
}
}
const mapStateToProps = (state) => ({
hero: state.hero,
player: state.player
});
export default connect(mapStateToProps)(App);