diff --git a/client/src/components/AddUser.js b/client/src/components/AddUser.js index 0939fe3a8..5fa2a808d 100644 --- a/client/src/components/AddUser.js +++ b/client/src/components/AddUser.js @@ -2,6 +2,8 @@ import React, { Component } from 'react'; import {graphql, compose} from 'react-apollo'; import {getRolesQuery, addUserMutation, getUsersQuery} from '../queries/queries'; +import AddProfileButton from './Material-UI/AddProfileButton'; + class AddUser extends Component { constructor(props){ super(props); @@ -12,7 +14,7 @@ class AddUser extends Component { } submitForm(e){ - console.log(this.state); + e.preventDefault(); this.props.addUserMutation({ variables: { @@ -25,17 +27,18 @@ class AddUser extends Component { render(){ return( -
-
+
+

Choose an Alias that will identify you anonimously across the whole Advanced Algos ecosystem. Choose it carefully, since the the Alias can not be changed later.

-
-
- this.setState({ alias:e.target.value})}/> +
+
+ this.setState({ alias:e.target.value})}/>
- + +
diff --git a/client/src/components/Material-UI/AddProfileButton.js b/client/src/components/Material-UI/AddProfileButton.js new file mode 100644 index 000000000..5a875e2ca --- /dev/null +++ b/client/src/components/Material-UI/AddProfileButton.js @@ -0,0 +1,30 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { withStyles } from '@material-ui/core/styles'; +import Button from '@material-ui/core/Button'; + +const styles = theme => ({ + button: { + margin: theme.spacing.unit, + }, + input: { + display: 'none', + }, +}); + +function AddProfileButton(props) { + const { classes } = props; + return ( +
+ +
+ ); +} + +AddProfileButton.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(AddProfileButton);