67 lines
1.9 KiB
JavaScript
67 lines
1.9 KiB
JavaScript
// eslint-disable-next-line
|
|
const preact = require('preact');
|
|
const { connect } = require('preact-redux');
|
|
|
|
const Login = require('./welcome.login');
|
|
const Register = require('./welcome.register');
|
|
const Help = require('./welcome.help');
|
|
// const About = require('./welcome.about');
|
|
|
|
const addState = connect(
|
|
function receiveState(state) {
|
|
const {
|
|
tutorial,
|
|
} = state;
|
|
|
|
return {
|
|
promptRegister: tutorial === 99, // see events
|
|
};
|
|
},
|
|
);
|
|
|
|
function Welcome(args) {
|
|
|
|
const {
|
|
promptRegister,
|
|
} = args;
|
|
|
|
const page = this.state.page || promptRegister && 'register' || 'login';
|
|
|
|
const pageEl = () => {
|
|
if (page === 'login') return <Login />;
|
|
if (page === 'register') return <Register />;
|
|
if (page === 'help') return <Help />;
|
|
return false;
|
|
};
|
|
|
|
const form = <div>{pageEl()}</div>;
|
|
|
|
return (
|
|
<header>
|
|
<div class="options">
|
|
<button
|
|
class={`login-btn ${page === 'login' ? 'highlight' : ''}`}
|
|
disabled={page === 'login'}
|
|
onClick={() => this.setState({ page: 'login' })}>
|
|
Login
|
|
</button>
|
|
<button
|
|
class={`login-btn ${page === 'register' ? 'highlight' : ''}`}
|
|
disabled={page === 'register'}
|
|
onClick={() => this.setState({ page: 'register' })}>
|
|
Register
|
|
</button>
|
|
<button
|
|
class={`login-btn ${page === 'help' ? 'highlight' : ''}`}
|
|
disabled={page === 'help'}
|
|
onClick={() => this.setState({ page: 'help' })}>
|
|
Help
|
|
</button>
|
|
</div>
|
|
{form}
|
|
</header>
|
|
);
|
|
}
|
|
|
|
module.exports = addState(Welcome);
|