Vulcan/packages/nova-base-components/lib/users/UsersAccountForm.jsx

104 lines
3 KiB
React
Raw Normal View History

import React, { PropTypes, Component } from 'react';
2016-04-21 15:08:43 +09:00
import { Button, FormControl } from 'react-bootstrap';
import { Accounts } from 'meteor/std:accounts-ui';
//import { client } from 'meteor/nova:base-apollo';
2016-04-19 16:14:41 +09:00
const UsersAccountForm = () => {
return (
<Accounts.ui.LoginForm />
)
};
2016-04-19 16:14:41 +09:00
module.exports = UsersAccountForm;
export default UsersAccountForm;
// customize Accounts.ui
Accounts.ui.config({
passwordSignupFields: 'USERNAME_AND_EMAIL',
onSignedInHook: () => {},
onSignedOutHook: () => {}, //client.resetStore()
});
class AccountsButton extends Accounts.ui.Button {
2016-04-04 11:30:14 +09:00
render () {
const {label, href, type, disabled, className, onClick} = this.props;
if (type === 'link') {
return <a href={ href } className={ className } onClick={ onClick }>{ label }</a>;
}
2016-04-04 11:30:14 +09:00
return <Button
bsStyle="primary"
className={ className }
type={ type } 
disabled={ disabled }
onClick={ onClick }>{ label }
</Button>;
}
}
class AccountsField extends Accounts.ui.Field {
2016-08-25 09:54:02 +09:00
// see https://github.com/studiointeract/accounts-ui/issues/60
triggerUpdate () {
const { onChange } = this.props
if (this.input) {
onChange({ target: { value: this.input.value } })
}
}
render() {
const { id, hint, label, type = 'text', onChange, className = "field", defaultValue = "" } = this.props;
const { mount = true } = this.state;
return mount ? (
<div className={ className }>
2016-04-21 15:08:43 +09:00
<FormControl id={ id } type={ type } onChange={ onChange } placeholder={ hint } defaultValue={ defaultValue } />
</div>
) : null;
}
}
// class AccountsSocialButtons extends Accounts.ui.SocialButtons {
// render () {
// let { oauthServices = {}, className = "social_buttons" } = this.props;
// return(
// <div className={ className }>
// {Object.keys(oauthServices)
// .filter(service => oauthServices[service].disabled) // filter services registered but not enabled
// .map((id, i) => <Accounts.ui.Button {...oauthServices[id]} key={i} />)}
// </div>
// );
// }
// }
// class AccountsPasswordOrService extends Accounts.ui.PasswordOrService {
// render () {
// let {
// oauthServices = {},
// className,
// style = {}
// } = this.props;
// let { hasPasswordService } = this.state;
// let labels = Object.keys(oauthServices)
// .filter(service => oauthServices[service].disabled) // filter services registered but not enabled
// .map(service => oauthServices[service].label);
// if (labels.length > 2) {
// labels = [];
// }
// if (hasPasswordService && labels.length > 0) {
// return (
// <div style={ style } className={ className }>
// { `${T9n.get('or use')} ${ labels.join(' / ') }` }
// </div>
// );
// }
// return null;
// }
// }
Accounts.ui.Button = AccountsButton;
Accounts.ui.Field = AccountsField;
// Accounts.ui.SocialButtons = AccountsSocialButtons;
// Accounts.ui.PasswordOrService = AccountsPasswordOrService;