1
0
mirror of https://github.com/ascribe/onion.git synced 2025-02-14 21:10:27 +01:00
onion/js/components/whitelabel/wallet/wallet_app.js
Brett Sun 764f81925b Change children prop from react-router to only be a Element type
Judging by
https://github.com/rackt/react-router/blob/master/docs/API.md#children-1
and a few inspections in the code, as well as tests, the `children`
prop injected into routes can only ever be a single React Element
object.

This allows us to easily get the active route of a child (if there is
an active route) by querying the `children`’s route prop.
2016-02-04 13:31:18 +01:00

52 lines
1.8 KiB
JavaScript

'use strict';
import React from 'react';
import classNames from 'classnames';
import AppBase from '../../app_base';
import Header from '../../header';
import { getSubdomain } from '../../../utils/general_utils';
let WalletApp = React.createClass({
propTypes: {
activeRoute: React.PropTypes.object.isRequired,
children: React.PropTypes.element.isRequired,
history: React.PropTypes.object.isRequired,
routes: React.PropTypes.arrayOf(React.PropTypes.object).isRequired
},
render() {
const { activeRoute, children, history, routes } = this.props;
const subdomain = getSubdomain();
// The second element of routes is always the active component object, where we can
// extract the path.
const path = routes[1] ? routes[1].path : null;
let header = null;
// if the path of the current activeRoute is not defined, then this is the IndexRoute
if ((!path || history.isActive('/login') || history.isActive('/signup') || history.isActive('/contract_notifications'))
&& (['cyland', 'ikonotv', 'lumenus', '23vivi']).indexOf(subdomain) > -1) {
header = (<div className="hero" />);
} else {
header = (<Header routes={routes} />);
}
// In react-router 1.0, Routes have no 'name' property anymore. To keep functionality however,
// we split the path by the first occurring slash and take the first splitter.
return (
<div className={classNames('ascribe-wallet-app', `route--${(path ? path.split('/')[0] : 'landing')}`)}>
{header}
<div className="container ascribe-body">
{/* Routes are injected here */}
{children}
</div>
</div>
);
}
});
export default AppBase(WalletApp);