Upgrade to Nikolas version of Master App header
This commit is contained in:
Luis Fernando Molina committed
1 parent
b8c89b9804
commit
b80ab5acf3
14 files changed
+106
-676
No files matched your search
+1
-1
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@advancedalgos/users-client",
|
||||
"description": "Advanced Algos Users client-side web app",
|
||||
"version": "0.0.17",
|
||||
"version": "0.0.18",
|
||||
"main": "src/index.js",
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^3.2.0",
|
||||
|
||||
@@ -1,47 +1,13 @@
|
||||
import React, { Component } from 'react'
|
||||
import UserList from './UserList'
|
||||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
import TopBar from './TopBar'
|
||||
|
||||
class Browse extends Component {
|
||||
|
||||
componentDidMount () {
|
||||
window.dispatchEvent(new Event('load')) // This is a workaround to solve the problem that the slider does not show up
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<React.Fragment>
|
||||
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Users Directory</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />Everyone involved in Advanced Algos is here.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CssBaseline />
|
||||
<TopBar size='medium' title='Users Directory' text='Everyone involved in Advanced Algos is here.' />
|
||||
<UserList />
|
||||
</React.Fragment>
|
||||
)
|
||||
|
||||
@@ -1,52 +0,0 @@
|
||||
import React from 'react'
|
||||
import Button from '@material-ui/core/Button'
|
||||
import Dialog from '@material-ui/core/Dialog'
|
||||
import DialogActions from '@material-ui/core/DialogActions'
|
||||
import DialogContent from '@material-ui/core/DialogContent'
|
||||
import DialogContentText from '@material-ui/core/DialogContentText'
|
||||
import DialogTitle from '@material-ui/core/DialogTitle'
|
||||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
|
||||
class Contact extends React.Component {
|
||||
state = {
|
||||
open: true
|
||||
}
|
||||
|
||||
handleClickOpen = () => {
|
||||
this.setState({ open: true })
|
||||
}
|
||||
|
||||
handleClose = () => {
|
||||
this.setState({ open: false })
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
|
||||
<React.Fragment>
|
||||
<CssBaseline />
|
||||
<Dialog
|
||||
open={this.state.open}
|
||||
onClose={this.handleClose}
|
||||
aria-labelledby='alert-dialog-title'
|
||||
aria-describedby='alert-dialog-description'>
|
||||
<DialogTitle id='alert-dialog-title'>
|
||||
{"Section under development."}
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText id='alert-dialog-description'>
|
||||
The functionality of this section has not been developed yet. We expect to have it for November 2018. Thanks for your understanding.
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={this.handleClose} color='primary' autoFocus>
|
||||
Close
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Contact
|
||||
@@ -1,58 +1,15 @@
|
||||
import React, { Component } from 'react'
|
||||
import { compose } from 'recompose'
|
||||
import { withStyles } from '@material-ui/core/styles'
|
||||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
|
||||
const styles = theme => ({
|
||||
|
||||
})
|
||||
import TopBar from './TopBar'
|
||||
|
||||
class Home extends Component {
|
||||
|
||||
componentDidMount () {
|
||||
window.dispatchEvent(new Event('load')) // This is a workaround to solve the problem that the slider does not show up
|
||||
}
|
||||
|
||||
render () {
|
||||
const { classes } = this.props
|
||||
return (
|
||||
<React.Fragment>
|
||||
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider slider_height_max'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Users Module</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />Responsible for all human users of the Advanced Algos Platform.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<TopBar size='big' title='Users Module' text='Responsible for all human users of the Advanced Algos Platform.' />
|
||||
</React.Fragment>
|
||||
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default compose(
|
||||
withStyles(styles)
|
||||
)(Home)
|
||||
export default Home
|
||||
@@ -1,141 +0,0 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import { withStyles } from '@material-ui/core/styles'
|
||||
import classNames from 'classnames'
|
||||
import AppBar from '@material-ui/core/AppBar'
|
||||
import Toolbar from '@material-ui/core/Toolbar'
|
||||
import Typography from '@material-ui/core/Typography'
|
||||
import Button from '@material-ui/core/Button'
|
||||
|
||||
// icons
|
||||
import UsersIcon from '@material-ui/icons/People'
|
||||
import BrowseIcon from '@material-ui/icons/ImportContacts'
|
||||
import SearchIcon from '@material-ui/icons/Search'
|
||||
import ContactIcon from '@material-ui/icons/ContactMail'
|
||||
import BugReportIcon from '@material-ui/icons/BugReport'
|
||||
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
// components
|
||||
import LoggedInUser from './LoggedInUser'
|
||||
|
||||
const HomeLink = props => <Link to='/users' {...props} />
|
||||
const BrowseLink = props => <Link to='/users/browse' {...props} />
|
||||
const SearchLink = props => <Link to='/users/search' {...props} />
|
||||
|
||||
const styles = theme => ({
|
||||
cssRoot: {
|
||||
color: '#FFFFFF',
|
||||
backgroundColor: theme.palette.secondary,
|
||||
'&:hover': {
|
||||
backgroundColor: theme.palette.dark
|
||||
},
|
||||
whiteSpace: 'nowrap',
|
||||
paddingRight: 2 * theme.spacing.unit,
|
||||
paddingLeft: 2 * theme.spacing.unit
|
||||
},
|
||||
button: {
|
||||
margin: theme.spacing.unit
|
||||
},
|
||||
leftIcon: {
|
||||
marginRight: theme.spacing.unit
|
||||
},
|
||||
iconSmall: {
|
||||
fontSize: 20
|
||||
}
|
||||
})
|
||||
|
||||
class Menu extends Component {
|
||||
|
||||
constructor (props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
authId: null
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
let user = localStorage.getItem('user')
|
||||
let authId
|
||||
|
||||
if (user !== null && user !== undefined && user !== 'undefined') {
|
||||
user = JSON.parse(user)
|
||||
authId = user.authId
|
||||
}
|
||||
|
||||
if (authId !== null && authId !== undefined && authId !== 'undefined') {
|
||||
this.setState({ authId: authId })
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
const { classes, user } = this.props
|
||||
const match = {
|
||||
url: '/users'
|
||||
}
|
||||
|
||||
return (
|
||||
<ul className='sub-menu'>
|
||||
|
||||
<li>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
|
||||
title='Users Module Home'
|
||||
component={HomeLink}
|
||||
to={`${match.url}`}>
|
||||
<UsersIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Home
|
||||
</Button>
|
||||
</li>
|
||||
<li>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Browse the Users Directory'
|
||||
component={BrowseLink}
|
||||
to={`${match.url}/browse`}>
|
||||
<BrowseIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Directory
|
||||
</Button>
|
||||
</li>
|
||||
<li>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Search Users'
|
||||
component={SearchLink}
|
||||
to={`${match.url}/search`}>
|
||||
<SearchIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Search
|
||||
</Button>
|
||||
</li>
|
||||
<li>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Report a Users Module bug'
|
||||
href='https://github.com/AdvancedAlgos/UsersModule/issues/new'
|
||||
>
|
||||
<BugReportIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Report
|
||||
</Button>
|
||||
</li>
|
||||
<LoggedInUser {...this.props} match={match} authId={this.state.authId} />
|
||||
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
Menu.propTypes = {
|
||||
classes: PropTypes.object.isRequired,
|
||||
user: PropTypes.object,
|
||||
match: PropTypes.object
|
||||
}
|
||||
|
||||
export default withStyles(styles)(Menu)
|
||||
@@ -1,150 +0,0 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import { withStyles } from '@material-ui/core/styles'
|
||||
import classNames from 'classnames'
|
||||
import AppBar from '@material-ui/core/AppBar'
|
||||
import Toolbar from '@material-ui/core/Toolbar'
|
||||
import Typography from '@material-ui/core/Typography'
|
||||
import Button from '@material-ui/core/Button'
|
||||
|
||||
// icons
|
||||
import UsersIcon from '@material-ui/icons/People'
|
||||
import BrowseIcon from '@material-ui/icons/ImportContacts'
|
||||
import SearchIcon from '@material-ui/icons/Search'
|
||||
import ContactIcon from '@material-ui/icons/ContactMail'
|
||||
import BugReportIcon from '@material-ui/icons/BugReport'
|
||||
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
// components
|
||||
import LoggedInUser from './LoggedInUser'
|
||||
|
||||
const HomeLink = props => <Link to='/users' {...props} />
|
||||
const BrowseLink = props => <Link to='/users/browse' {...props} />
|
||||
const SearchLink = props => <Link to='/users/search' {...props} />
|
||||
|
||||
const styles = theme => ({
|
||||
root: {
|
||||
flexGrow: 1
|
||||
},
|
||||
flex: {
|
||||
flexGrow: 1,
|
||||
marginLeft: 30
|
||||
},
|
||||
menuButton: {
|
||||
marginLeft: -12,
|
||||
marginRight: 20
|
||||
},
|
||||
cssRoot: {
|
||||
color: '#FFFFFF',
|
||||
backgroundColor: theme.palette.secondary,
|
||||
'&:hover': {
|
||||
backgroundColor: theme.palette.dark
|
||||
},
|
||||
whiteSpace: 'nowrap',
|
||||
paddingRight: 2 * theme.spacing.unit,
|
||||
paddingLeft: 2 * theme.spacing.unit
|
||||
},
|
||||
button: {
|
||||
margin: theme.spacing.unit
|
||||
},
|
||||
leftIcon: {
|
||||
marginRight: theme.spacing.unit
|
||||
},
|
||||
rightIcon: {
|
||||
marginLeft: theme.spacing.unit
|
||||
},
|
||||
iconSmall: {
|
||||
fontSize: 20
|
||||
}
|
||||
})
|
||||
|
||||
class NavBar extends Component {
|
||||
|
||||
constructor (props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
authId: null
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
let user = localStorage.getItem('user')
|
||||
let authId
|
||||
|
||||
if (user !== null && user !== undefined && user !== 'undefined') {
|
||||
user = JSON.parse(user)
|
||||
authId = user.authId
|
||||
}
|
||||
|
||||
if (authId !== null && authId !== undefined && authId !== 'undefined') {
|
||||
this.setState({ authId: authId })
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
const { classes, user, match } = this.props
|
||||
return (
|
||||
<div className={classes.root}>
|
||||
<AppBar position='static' color='secondary'>
|
||||
<Toolbar variant='dense'>
|
||||
<Typography variant='h5' color='inherit' className={classes.flex}>
|
||||
Users
|
||||
</Typography>
|
||||
<LoggedInUser {...this.props} authId={this.state.authId} />
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Browse the Users Directory'
|
||||
component={BrowseLink}
|
||||
to={`${match.url}/browse`}>
|
||||
<BrowseIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Directory
|
||||
</Button>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Search Users'
|
||||
component={SearchLink}
|
||||
to={`${match.url}/search`}>
|
||||
<SearchIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Search
|
||||
</Button>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Report a Users Module bug'
|
||||
href='https://github.com/AdvancedAlgos/UsersModule/issues/new'
|
||||
target='_blank'
|
||||
>
|
||||
<BugReportIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Report
|
||||
</Button>
|
||||
<Button
|
||||
variant='text'
|
||||
size='small'
|
||||
className={classNames(classes.button, classes.cssRoot)}
|
||||
title='Users Module Home'
|
||||
component={HomeLink}
|
||||
to={`${match.url}`}>
|
||||
<UsersIcon className={classNames(classes.leftIcon, classes.iconSmall)} />
|
||||
Home
|
||||
</Button>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
NavBar.propTypes = {
|
||||
classes: PropTypes.object.isRequired,
|
||||
user: PropTypes.object,
|
||||
match: PropTypes.object
|
||||
}
|
||||
|
||||
export default withStyles(styles)(NavBar)
|
||||
|
||||
@@ -313,44 +313,6 @@ class ProfileSheet extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
window.dispatchEvent(new Event('load')) // This is a workaround to solve the problem that the slider does not show up
|
||||
}
|
||||
|
||||
addSlider () {
|
||||
return (
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Profile Sheet</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />Manage here your basic profile info.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
addForm () {
|
||||
const { classes } = this.props
|
||||
return (
|
||||
@@ -545,7 +507,6 @@ class ProfileSheet extends Component {
|
||||
render () {
|
||||
return (
|
||||
<React.Fragment>
|
||||
{this.addSlider()}
|
||||
{this.addForm()}
|
||||
</React.Fragment>
|
||||
)
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import React, { Component } from 'react'
|
||||
import UserSearch from './UserSearch'
|
||||
import {compose} from 'react-apollo'
|
||||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
import Paper from '@material-ui/core/Paper'
|
||||
import TopBar from './TopBar'
|
||||
|
||||
// Materia UI
|
||||
|
||||
@@ -21,45 +21,11 @@ const styles = theme => ({
|
||||
|
||||
class Search extends Component {
|
||||
|
||||
constructor (props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
}
|
||||
}
|
||||
render () {
|
||||
const { classes } = this.props
|
||||
return (
|
||||
<React.Fragment>
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Users Search</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />Find anyone involved in Advanced Algos here.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CssBaseline />
|
||||
<TopBar size='medium' title='Users Search' text='Find anyone involved in Advanced Algos here.' />
|
||||
<Paper className={classes.root}>
|
||||
<UserSearch />
|
||||
</Paper>
|
||||
|
||||
@@ -0,0 +1,42 @@
|
||||
import React from 'react';
|
||||
|
||||
import { Typography } from '@material-ui/core';
|
||||
import { withStyles } from '@material-ui/core/styles';
|
||||
|
||||
import styles from './styles';
|
||||
|
||||
class TopBar extends React.Component {
|
||||
render() {
|
||||
const {
|
||||
classes,
|
||||
size,
|
||||
title,
|
||||
text,
|
||||
} = this.props;
|
||||
if (size === 'big') {
|
||||
return (
|
||||
<div className={classes.rootBig}>
|
||||
<div className={classes.captions}>
|
||||
<Typography className={classes.title} variant='headline' align='center'>{title}</Typography>
|
||||
<Typography className={classes.text} variant='subheading' align='center'>{text}</Typography>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
if (size === 'medium') {
|
||||
return (
|
||||
<div className={classes.rootMedium}>
|
||||
<div className={classes.captions}>
|
||||
<Typography className={classes.title} variant='headline' align='center'>{title}</Typography>
|
||||
<Typography className={classes.text} variant='subheading' align='center'>{text}</Typography>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div className={classes.rootSmall} />
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withStyles(styles)(TopBar);
|
||||
@@ -0,0 +1,39 @@
|
||||
const styles = () => ({
|
||||
rootBig: {
|
||||
backgroundImage: 'url(https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg)',
|
||||
width: '100%',
|
||||
height: '100vh',
|
||||
},
|
||||
rootMedium: {
|
||||
backgroundImage: 'url(https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg)',
|
||||
width: '100%',
|
||||
height: '50vh',
|
||||
},
|
||||
rootSmall: {
|
||||
backgroundImage: 'url(https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg)',
|
||||
width: '100%',
|
||||
height: '220px',
|
||||
},
|
||||
captions: {
|
||||
position: 'relative',
|
||||
top: '50%',
|
||||
transform: 'translateY(-50%)',
|
||||
},
|
||||
title: {
|
||||
fontFamily: 'Saira',
|
||||
color: 'white',
|
||||
fontSize: '64px',
|
||||
lineHeight: '78px',
|
||||
fontWeight: 100,
|
||||
},
|
||||
text: {
|
||||
fontFamily: 'Saira',
|
||||
color: 'white',
|
||||
fontSize: '20px',
|
||||
lineHeight: '30px',
|
||||
fontWeight: 600,
|
||||
padding: '20px 0 0.5em 0',
|
||||
},
|
||||
});
|
||||
|
||||
export default styles;
|
||||
@@ -1,11 +1,11 @@
|
||||
import React from 'react'
|
||||
import UserTabs from './UserTabs'
|
||||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
import TopBar from './TopBar'
|
||||
|
||||
const User = () => {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<CssBaseline />
|
||||
<TopBar size='medium' title='Your Profile' text='Manage your profile info, pictures and more.' />
|
||||
<UserTabs />
|
||||
</React.Fragment>
|
||||
)
|
||||
|
||||
@@ -60,44 +60,6 @@ class YourDescendents extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
window.dispatchEvent(new Event('load')) // This is a workaround to solve the problem that the slider does not show up
|
||||
}
|
||||
|
||||
addSlider () {
|
||||
return (
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Your Descendents</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />Explore here generations of people that discovered Advanced Algos because of you.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
addForm () {
|
||||
const { classes } = this.props
|
||||
return (
|
||||
@@ -118,7 +80,6 @@ class YourDescendents extends Component {
|
||||
render () {
|
||||
return (
|
||||
<React.Fragment>
|
||||
{this.addSlider()}
|
||||
{this.addForm()}
|
||||
</React.Fragment>
|
||||
)
|
||||
|
||||
@@ -126,44 +126,6 @@ class YourReferrer extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
window.dispatchEvent(new Event('load')) // This is a workaround to solve the problem that the slider does not show up
|
||||
}
|
||||
|
||||
addSlider () {
|
||||
return (
|
||||
<section id='mainslider' className='fullwidth no_padding_container no_margin_col'>
|
||||
<div className='container'>
|
||||
<div className='row'>
|
||||
<div className='col-sm-12'>
|
||||
<div className='flexslider'>
|
||||
<ul className='slides text-center'>
|
||||
<li>
|
||||
<img src='https://aacorporatesitedevelop.azurewebsites.net/img/photos/connect.jpg' alt='' />
|
||||
<div className='slide_description_wrapper slider_textblock_center'>
|
||||
<div className='slide_description to_animate'>
|
||||
<div data-animation='fadeInUp' align='center'>
|
||||
<div>
|
||||
<div>
|
||||
<h3>Your Referrer</h3>
|
||||
<h4 className='white-text'>
|
||||
<br />It is important to know who introduced you to Advanced Algos.
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
addForm () {
|
||||
const { classes } = this.props
|
||||
return (
|
||||
@@ -176,7 +138,6 @@ class YourReferrer extends Component {
|
||||
render () {
|
||||
return (
|
||||
<React.Fragment>
|
||||
{this.addSlider()}
|
||||
{this.addForm()}
|
||||
</React.Fragment>
|
||||
)
|
||||
|
||||
+15
-95
@@ -1,104 +1,24 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import { Route, BrowserRouter, Switch } from 'react-router-dom'
|
||||
import { hot } from 'react-hot-loader'
|
||||
import React from 'react'
|
||||
import { Route, Switch } from 'react-router-dom'
|
||||
|
||||
import { withStyles } from '@material-ui/core/styles'
|
||||
import { MuiPickersUtilsProvider } from 'material-ui-pickers'
|
||||
import LuxonUtils from 'material-ui-pickers/utils/luxon-utils'
|
||||
|
||||
// Components
|
||||
import Home from './components/Home'
|
||||
import User from './components/User'
|
||||
import Browse from './components/Browse'
|
||||
import Search from './components/Search'
|
||||
import ProfileSheet from './components/ProfileSheet'
|
||||
import ProfileImages from './components/ProfileImages'
|
||||
import YourReferrer from './components/YourReferrer'
|
||||
import YourDescendents from './components/YourDescendents'
|
||||
import UsersMenu from './components/Menu'
|
||||
|
||||
import { getItem } from './utils/local-storage'
|
||||
import {
|
||||
globalStyles
|
||||
} from './theme'
|
||||
const App = () => (
|
||||
<MuiPickersUtilsProvider utils={LuxonUtils}>
|
||||
<Switch>
|
||||
<Route exact path='/users/' component={Home} />
|
||||
<Route path='/users/user' component={User} />
|
||||
<Route path='/users/browse' component={Browse} />
|
||||
<Route path='/users/search' component={Search} />
|
||||
</Switch>
|
||||
</MuiPickersUtilsProvider>
|
||||
)
|
||||
|
||||
class App extends Component {
|
||||
constructor (props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
user: null
|
||||
}
|
||||
}
|
||||
export default App
|
||||
|
||||
async componentDidMount () {
|
||||
let user = await getItem('user')
|
||||
|
||||
if (user !== null && user !== undefined && user !== 'undefined') {
|
||||
user = JSON.parse(user)
|
||||
this.setState({ user: user })
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
const match = {path: '/users'}
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<div className='App'>
|
||||
<Switch>
|
||||
<Route exact path={`${match.path}`} component={Home} />
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/users`}
|
||||
render={props => <Home {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/user`}
|
||||
render={props => <User {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/browse`}
|
||||
render={props => <Browse {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/search`}
|
||||
render={props => <Search {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/profile-sheet`}
|
||||
render={props => <ProfileSheet {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/profile-images`}
|
||||
render={props => <ProfileImages {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/referrer`}
|
||||
render={props => <YourReferrer {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path={`${match.path}/descendents`}
|
||||
render={props => <YourDescendents {...props} auth={this.props.auth} />}
|
||||
/>
|
||||
</Switch>
|
||||
</div>
|
||||
</BrowserRouter>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
App.propTypes = {
|
||||
auth: PropTypes.object
|
||||
}
|
||||
|
||||
const StyledApp = withStyles(globalStyles)(App)
|
||||
export {
|
||||
StyledApp,
|
||||
UsersMenu
|
||||
}
|
||||
export default hot(module)(StyledApp)
|
||||
Reference in new issue
Block a user