You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.6 KiB
54 lines
1.6 KiB
import React, { FC } from 'react'
|
|
import noop from 'lodash/noop'
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
|
import { faUser, faArrowRight } from '@fortawesome/free-solid-svg-icons'
|
|
|
|
import CreateUserForm from '../create-user-form'
|
|
|
|
export interface Props {
|
|
userId?: string
|
|
name?: string
|
|
email?: string
|
|
password?: string
|
|
agree?: boolean
|
|
next?: (userId: string, name: string, email: string, password: string, agree: boolean) => void
|
|
}
|
|
|
|
const CreateUserStep: FC<Props> = ({
|
|
userId = '',
|
|
name = '',
|
|
email = '',
|
|
password = '',
|
|
agree = false,
|
|
next = noop,
|
|
}) => (
|
|
<div className="centered-content">
|
|
<div className="centered-content-icon has-background-primary">
|
|
<span className="icon is-large has-text-white">
|
|
<FontAwesomeIcon icon={faUser} size="2x" />
|
|
</span>
|
|
</div>
|
|
|
|
<CreateUserForm />
|
|
<hr />
|
|
|
|
<nav className="level">
|
|
<div className="level-left">
|
|
<p className="level-item"></p>
|
|
</div>
|
|
|
|
<div className="level-right">
|
|
<p className="level-item">
|
|
<button className="button is-success" onClick={() => next(userId, name, email, password, agree)}>
|
|
<span>Community</span>
|
|
<span className="icon is-small">
|
|
<FontAwesomeIcon icon={faArrowRight} />
|
|
</span>
|
|
</button>
|
|
</p>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
)
|
|
|
|
export default CreateUserStep
|