mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	fix: hide content if showing authentication modal
This commit is contained in:
		
							parent
							
								
									0a2672270e
								
							
						
					
					
						commit
						e66a4de026
					
				@ -1,54 +1,43 @@
 | 
			
		||||
import React, { PureComponent } from 'react';
 | 
			
		||||
import { connect } from 'react-redux';
 | 
			
		||||
import PropTypes from 'prop-types';
 | 
			
		||||
import { Layout, Content, Footer, Grid, Cell } from 'react-mdl';
 | 
			
		||||
import { Route, Redirect, Switch } from 'react-router-dom';
 | 
			
		||||
import styles from './styles.scss';
 | 
			
		||||
import ErrorContainer from './error/error-container';
 | 
			
		||||
import Header from './menu/header';
 | 
			
		||||
import AuthenticationContainer from './user/authentication-container';
 | 
			
		||||
 | 
			
		||||
import ShowApiDetailsContainer from './api/show-api-details-container';
 | 
			
		||||
import Features from '../page/features';
 | 
			
		||||
 | 
			
		||||
import { FooterMenu } from './menu/footer';
 | 
			
		||||
import { routes } from './menu/routes';
 | 
			
		||||
import styles from './styles.scss';
 | 
			
		||||
import AuthenticationContainer from './user/authentication-container';
 | 
			
		||||
import MainLayout from './layout/main';
 | 
			
		||||
 | 
			
		||||
export default class App extends PureComponent {
 | 
			
		||||
class App extends PureComponent {
 | 
			
		||||
    static propTypes = {
 | 
			
		||||
        location: PropTypes.object.isRequired,
 | 
			
		||||
        match: PropTypes.object.isRequired,
 | 
			
		||||
        history: PropTypes.object.isRequired,
 | 
			
		||||
        user: PropTypes.object,
 | 
			
		||||
    };
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
        if (this.props.user.authDetails) {
 | 
			
		||||
            return <AuthenticationContainer history={this.props.history} />;
 | 
			
		||||
        }
 | 
			
		||||
        return (
 | 
			
		||||
            <div className={styles.container}>
 | 
			
		||||
                <AuthenticationContainer history={this.props.history} />
 | 
			
		||||
                <Layout fixedHeader>
 | 
			
		||||
                    <Header location={this.props.location} />
 | 
			
		||||
                    <Content className="mdl-color--grey-50" style={{ display: 'flex', flexDirection: 'column' }}>
 | 
			
		||||
                        <Grid noSpacing className={styles.content} style={{ flex: 1 }}>
 | 
			
		||||
                            <Cell col={12}>
 | 
			
		||||
                                <Switch>
 | 
			
		||||
                                    <Route
 | 
			
		||||
                                        exact
 | 
			
		||||
                                        path="/"
 | 
			
		||||
                                        render={() => <Redirect to="/features" component={Features} />}
 | 
			
		||||
                                    />
 | 
			
		||||
                                    {routes.map(route => (
 | 
			
		||||
                                        <Route key={route.path} path={route.path} component={route.component} />
 | 
			
		||||
                                    ))}
 | 
			
		||||
                                </Switch>
 | 
			
		||||
                                <ErrorContainer />
 | 
			
		||||
                            </Cell>
 | 
			
		||||
                        </Grid>
 | 
			
		||||
                        <Footer size="mega">
 | 
			
		||||
                            <FooterMenu />
 | 
			
		||||
                            <ShowApiDetailsContainer />
 | 
			
		||||
                        </Footer>
 | 
			
		||||
                    </Content>
 | 
			
		||||
                </Layout>
 | 
			
		||||
                <MainLayout {...this.props}>
 | 
			
		||||
                    <Switch>
 | 
			
		||||
                        <Route exact path="/" render={() => <Redirect to="/features" component={Features} />} />
 | 
			
		||||
                        {routes.map(route => (
 | 
			
		||||
                            <Route key={route.path} path={route.path} component={route.component} />
 | 
			
		||||
                        ))}
 | 
			
		||||
                    </Switch>
 | 
			
		||||
                </MainLayout>
 | 
			
		||||
            </div>
 | 
			
		||||
        );
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const mapStateToProps = state => ({
 | 
			
		||||
    user: state.user.toJS(),
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
export default connect(mapStateToProps)(App);
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										35
									
								
								frontend/src/component/layout/main.jsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										35
									
								
								frontend/src/component/layout/main.jsx
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,35 @@
 | 
			
		||||
import React, { PureComponent } from 'react';
 | 
			
		||||
import PropTypes from 'prop-types';
 | 
			
		||||
import { Layout, Content, Footer, Grid, Cell } from 'react-mdl';
 | 
			
		||||
 | 
			
		||||
import styles from '../styles.scss';
 | 
			
		||||
import ErrorContainer from '../error/error-container';
 | 
			
		||||
import Header from '../menu/header';
 | 
			
		||||
import ShowApiDetailsContainer from '../api/show-api-details-container';
 | 
			
		||||
import { FooterMenu } from '../menu/footer';
 | 
			
		||||
 | 
			
		||||
export default class App extends PureComponent {
 | 
			
		||||
    static propTypes = {
 | 
			
		||||
        location: PropTypes.object.isRequired,
 | 
			
		||||
    };
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
        return (
 | 
			
		||||
            <Layout fixedHeader>
 | 
			
		||||
                <Header location={this.props.location} />
 | 
			
		||||
                <Content className="mdl-color--grey-50" style={{ display: 'flex', flexDirection: 'column' }}>
 | 
			
		||||
                    <Grid noSpacing className={styles.content} style={{ flex: 1 }}>
 | 
			
		||||
                        <Cell col={12}>
 | 
			
		||||
                            {this.props.children}
 | 
			
		||||
                            <ErrorContainer />
 | 
			
		||||
                        </Cell>
 | 
			
		||||
                    </Grid>
 | 
			
		||||
                    <Footer size="mega">
 | 
			
		||||
                        <FooterMenu />
 | 
			
		||||
                        <ShowApiDetailsContainer />
 | 
			
		||||
                    </Footer>
 | 
			
		||||
                </Content>
 | 
			
		||||
            </Layout>
 | 
			
		||||
        );
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
		Reference in New Issue
	
	Block a user