mirror of
https://github.com/ascribe/onion.git
synced 2024-12-22 09:23:13 +01:00
Change Header and parents for loading UserStore from top level app
This commit is contained in:
parent
9059ca184a
commit
d4064ee83a
@ -55,7 +55,10 @@ let AscribeApp = React.createClass({
|
||||
|
||||
return (
|
||||
<div className="container ascribe-default-app">
|
||||
<Header routes={routes} />
|
||||
<Header
|
||||
currentUser={currentUser}
|
||||
routes={routes}
|
||||
whitelabel={whitelabel} />
|
||||
<AppRouteWrapper
|
||||
currentUser={currentUser}
|
||||
whitelabel={whitelabel}>
|
||||
|
@ -14,47 +14,25 @@ import NavItem from 'react-bootstrap/lib/NavItem';
|
||||
|
||||
import LinkContainer from 'react-router-bootstrap/lib/LinkContainer';
|
||||
|
||||
import AclProxy from './acl_proxy';
|
||||
|
||||
import EventActions from '../actions/event_actions';
|
||||
|
||||
import UserActions from '../actions/user_actions';
|
||||
import UserStore from '../stores/user_store';
|
||||
|
||||
import WhitelabelActions from '../actions/whitelabel_actions';
|
||||
import WhitelabelStore from '../stores/whitelabel_store';
|
||||
|
||||
import AclProxy from './acl_proxy';
|
||||
import HeaderNotifications from './header_notification';
|
||||
|
||||
import HeaderNotificationDebug from './header_notification_debug';
|
||||
|
||||
import NavRoutesLinks from './nav_routes_links';
|
||||
|
||||
import { mergeOptions } from '../utils/general_utils';
|
||||
import { getLangText } from '../utils/lang_utils';
|
||||
|
||||
import { constructHead } from '../utils/dom_utils';
|
||||
|
||||
|
||||
let Header = React.createClass({
|
||||
propTypes: {
|
||||
routes: React.PropTypes.arrayOf(React.PropTypes.object)
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
return mergeOptions(
|
||||
WhitelabelStore.getState(),
|
||||
UserStore.getState()
|
||||
);
|
||||
currentUser: React.PropTypes.object.isRequired,
|
||||
routes: React.PropTypes.arrayOf(React.PropTypes.object).isRequired,
|
||||
whitelabel: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
componentDidMount() {
|
||||
UserStore.listen(this.onChange);
|
||||
UserActions.fetchCurrentUser.defer();
|
||||
|
||||
WhitelabelStore.listen(this.onChange);
|
||||
WhitelabelActions.fetchWhitelabel.defer();
|
||||
|
||||
// react-bootstrap 0.25.1 has a bug in which it doesn't
|
||||
// close the mobile expanded navigation after a click by itself.
|
||||
// To get rid of this, we set the state of the component ourselves.
|
||||
@ -62,13 +40,11 @@ let Header = React.createClass({
|
||||
},
|
||||
|
||||
componentWillUnmount() {
|
||||
UserStore.unlisten(this.onChange);
|
||||
WhitelabelStore.unlisten(this.onChange);
|
||||
//history.unlisten(this.onRouteChange);
|
||||
},
|
||||
|
||||
getLogo() {
|
||||
const { whitelabel } = this.state;
|
||||
const { whitelabel } = this.props;
|
||||
|
||||
if (whitelabel.head) {
|
||||
constructHead(whitelabel.head);
|
||||
@ -80,19 +56,19 @@ let Header = React.createClass({
|
||||
<img className="img-brand" src={whitelabel.logo} alt="Whitelabel brand"/>
|
||||
</Link>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<span>
|
||||
<Link className="icon-ascribe-logo" to="/collection"/>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<span>
|
||||
<Link className="icon-ascribe-logo" to="/collection"/>
|
||||
</span>
|
||||
);
|
||||
},
|
||||
|
||||
getPoweredBy() {
|
||||
return (
|
||||
<AclProxy
|
||||
aclObject={this.state.whitelabel}
|
||||
aclObject={this.props.whitelabel}
|
||||
aclName="acl_view_powered_by">
|
||||
<li>
|
||||
<a className="pull-right ascribe-powered-by" href="https://www.ascribe.io/" target="_blank">
|
||||
@ -104,10 +80,6 @@ let Header = React.createClass({
|
||||
);
|
||||
},
|
||||
|
||||
onChange(state) {
|
||||
this.setState(state);
|
||||
},
|
||||
|
||||
onMenuItemClick() {
|
||||
/*
|
||||
This is a hack to make the dropdown close after clicking on an item
|
||||
@ -143,59 +115,61 @@ let Header = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
const { currentUser, routes } = this.props;
|
||||
let account;
|
||||
let signup;
|
||||
let navRoutesLinks;
|
||||
if (this.state.currentUser.username){
|
||||
|
||||
if (currentUser.username) {
|
||||
account = (
|
||||
<DropdownButton
|
||||
ref='dropdownbutton'
|
||||
eventKey="1"
|
||||
title={this.state.currentUser.username}>
|
||||
title={currentUser.username}>
|
||||
<LinkContainer
|
||||
to="/settings"
|
||||
onClick={this.onMenuItemClick}>
|
||||
<MenuItem
|
||||
eventKey="2">
|
||||
<MenuItem eventKey="2">
|
||||
{getLangText('Account Settings')}
|
||||
</MenuItem>
|
||||
</LinkContainer>
|
||||
<AclProxy
|
||||
aclObject={this.state.currentUser.acl}
|
||||
aclObject={currentUser.acl}
|
||||
aclName="acl_view_settings_contract">
|
||||
<LinkContainer
|
||||
to="/contract_settings"
|
||||
onClick={this.onMenuItemClick}>
|
||||
<MenuItem
|
||||
eventKey="2">
|
||||
<MenuItem eventKey="2">
|
||||
{getLangText('Contract Settings')}
|
||||
</MenuItem>
|
||||
</LinkContainer>
|
||||
</AclProxy>
|
||||
<MenuItem divider />
|
||||
<LinkContainer
|
||||
to="/logout">
|
||||
<MenuItem
|
||||
eventKey="3">
|
||||
<LinkContainer to="/logout">
|
||||
<MenuItem eventKey="3">
|
||||
{getLangText('Log out')}
|
||||
</MenuItem>
|
||||
</LinkContainer>
|
||||
</DropdownButton>
|
||||
);
|
||||
navRoutesLinks = <NavRoutesLinks routes={this.props.routes} userAcl={this.state.currentUser.acl} navbar right/>;
|
||||
}
|
||||
else {
|
||||
|
||||
navRoutesLinks = (
|
||||
<NavRoutesLinks
|
||||
routes={routes}
|
||||
userAcl={currentUser.acl}
|
||||
navbar
|
||||
right />
|
||||
);
|
||||
} else {
|
||||
account = (
|
||||
<LinkContainer
|
||||
to="/login">
|
||||
<LinkContainer to="/login">
|
||||
<NavItem>
|
||||
{getLangText('LOGIN')}
|
||||
</NavItem>
|
||||
</LinkContainer>
|
||||
);
|
||||
signup = (
|
||||
<LinkContainer
|
||||
to="/signup">
|
||||
<LinkContainer to="/signup">
|
||||
<NavItem>
|
||||
{getLangText('SIGNUP')}
|
||||
</NavItem>
|
||||
@ -211,13 +185,12 @@ let Header = React.createClass({
|
||||
toggleNavKey={0}
|
||||
fixedTop={true}
|
||||
className="hidden-print">
|
||||
<CollapsibleNav
|
||||
eventKey={0}>
|
||||
<CollapsibleNav eventKey={0}>
|
||||
<Nav navbar left>
|
||||
{this.getPoweredBy()}
|
||||
</Nav>
|
||||
<Nav navbar right>
|
||||
<HeaderNotificationDebug show={false}/>
|
||||
<HeaderNotificationDebug show={false} />
|
||||
{account}
|
||||
{signup}
|
||||
</Nav>
|
||||
|
@ -54,8 +54,7 @@ let PRApp = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
const { children, history, routes } = this.props;
|
||||
const { currentUser, whitelabel } = this.state;
|
||||
const { children, currentUser, history, routes, whitelabel } = this.props;
|
||||
const subdomain = getSubdomain();
|
||||
|
||||
// Add the current user and whitelabel settings to all child routes
|
||||
@ -69,10 +68,16 @@ let PRApp = React.createClass({
|
||||
let style = {};
|
||||
let header;
|
||||
if (currentUser && currentUser.email && history.isActive(`/pieces/${getCookie(currentUser.email)}`)) {
|
||||
header = <Hero currentUser={currentUser} />;
|
||||
header = (<Hero currentUser={currentUser} />);
|
||||
style = { paddingTop: '0 !important' };
|
||||
} else if(currentUser && (currentUser.is_admin || currentUser.is_jury || currentUser.is_judge)) {
|
||||
header = <Header routes={routes} />;
|
||||
header = (
|
||||
<Header
|
||||
currentUser={currentUser}
|
||||
routes={routes}
|
||||
whitelabel={whitelabel}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
style = { paddingTop: '0 !important' };
|
||||
}
|
||||
|
@ -53,8 +53,7 @@ let PrizeApp = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
const { history, routes, children } = this.props;
|
||||
const { currentUser, whitelabel } = this.state;
|
||||
const { children, currentUser, history, routes, whitelabel } = this.props;
|
||||
const subdomain = getSubdomain();
|
||||
|
||||
// The second element of routes is always the active component object, where we can
|
||||
@ -64,9 +63,14 @@ let PrizeApp = React.createClass({
|
||||
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')) {
|
||||
header = <Hero />;
|
||||
header = (<Hero />);
|
||||
} else {
|
||||
header = <Header routes={routes}/>;
|
||||
header = (
|
||||
<Header
|
||||
currentUser={currentUser}
|
||||
routes={routes}
|
||||
whitelabel={whitelabel} />
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -52,8 +52,7 @@ let WalletApp = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
const { history, routes, children } = this.props;
|
||||
const { currentUser, whitelabel } = this.state;
|
||||
const { children, currentUser, history, routes, whitelabel } = this.props;
|
||||
const subdomain = getSubdomain();
|
||||
|
||||
// The second element of routes is always the active component object, where we can
|
||||
@ -66,7 +65,12 @@ let WalletApp = React.createClass({
|
||||
&& (['cyland', 'ikonotv', 'lumenus', '23vivi']).indexOf(subdomain) > -1) {
|
||||
header = (<div className="hero"/>);
|
||||
} else {
|
||||
header = (<Header routes={routes} />);
|
||||
header = (
|
||||
<Header
|
||||
currentUser={currentUser}
|
||||
routes={routes}
|
||||
whitelabel={whitelabel} />
|
||||
);
|
||||
}
|
||||
|
||||
// In react-router 1.0, Routes have no 'name' property anymore. To keep functionality however,
|
||||
|
Loading…
Reference in New Issue
Block a user