From 84bfa0051b8280c8f1632dce09f62619476271bd Mon Sep 17 00:00:00 2001 From: Tim Brandin Date: Wed, 5 Apr 2017 23:12:46 +0200 Subject: [PATCH] Replacing dependency on tracker-component with react-meteor-data. --- imports/ui/components/LoginForm.jsx | 55 ++++++++++++++++++----------- main_client.js | 10 +++--- main_server.js | 10 +++--- package.js | 1 + package.json | 6 ++-- 5 files changed, 51 insertions(+), 31 deletions(-) diff --git a/imports/ui/components/LoginForm.jsx b/imports/ui/components/LoginForm.jsx index cc51186..40fad28 100644 --- a/imports/ui/components/LoginForm.jsx +++ b/imports/ui/components/LoginForm.jsx @@ -1,6 +1,6 @@ -import React from 'react'; +import React, { PropTypes, Component } from 'react'; import ReactDOM from 'react-dom'; -import Tracker from 'tracker-component'; +import { createContainer } from 'meteor/react-meteor-data'; import { Accounts } from 'meteor/accounts-base'; import { T9n } from 'meteor/softwarerero:accounts-t9n'; import { KEY_PREFIX } from '../../login_session.js'; @@ -18,7 +18,7 @@ import { capitalize } from '../../helpers.js'; -export class LoginForm extends Tracker.Component { +class LoginForm extends Component { constructor(props) { super(props); let { @@ -71,22 +71,11 @@ export class LoginForm extends Tracker.Component { Session.set(KEY_PREFIX + 'state', null); break; } - + // Add default field values once the form did mount on the client this.setState(prevState => ({ ...this.getDefaultFieldValues(), })); - - // Listen for the user to login/logout. - this.autorun(() => { - - // Add the services list to the user. - this.subscribe('servicesList'); - this.setState({ - user: Accounts.user() - }); - - }); } componentWillReceiveProps(nextProps, nextContext) { @@ -99,9 +88,9 @@ export class LoginForm extends Tracker.Component { } componentDidUpdate(prevProps, prevState) { - if (!prevState.user !== !this.state.user) { + if (!prevProps.user !== !this.props.user) { this.setState({ - formState: this.state.user ? STATES.PROFILE : STATES.SIGN_IN + formState: this.props.user ? STATES.PROFILE : STATES.SIGN_IN }); } } @@ -309,7 +298,8 @@ export class LoginForm extends Tracker.Component { changePasswordPath = Accounts.ui._options.changePasswordPath, profilePath = Accounts.ui._options.profilePath, } = this.props; - const { formState, waiting, user } = this.state; + const { user } = this.props; + const { formState, waiting } = this.state; let loginButtons = []; if (user && formState == STATES.PROFILE) { @@ -457,7 +447,7 @@ export class LoginForm extends Tracker.Component { } showForgotPasswordLink() { - return !this.state.user + return !this.props.user && this.state.formState == STATES.SIGN_IN && _.contains( ["USERNAME_AND_EMAIL", "USERNAME_AND_OPTIONAL_EMAIL", "EMAIL_ONLY"], @@ -662,7 +652,8 @@ export class LoginForm extends Tracker.Component { } oauthSignIn(serviceName) { - const { formState, waiting, user, onSubmitHook } = this.state; + const { user } = this.props; + const { formState, waiting, onSubmitHook } = this.state; //Thanks Josh Owens for this one. function capitalService() { return serviceName.charAt(0).toUpperCase() + serviceName.slice(1); @@ -998,5 +989,29 @@ export class LoginForm extends Tracker.Component { ); } } +LoginForm.propTypes = { + formState: PropTypes.string, + loginPath: PropTypes.string, + signUpPath: PropTypes.string, + resetPasswordPath: PropTypes.string, + profilePath: PropTypes.string, + changePasswordPath: PropTypes.string, +}; +LoginForm.defaultProps = { + formState: null, + loginPath: null, + signUpPath: null, + resetPasswordPath: null, + profilePath: null, + changePasswordPath: null, +}; Accounts.ui.LoginForm = LoginForm; + +export default createContainer(() => { + // Listen for the user to login/logout and the services list to the user. + Meteor.subscribe('servicesList'); + return ({ + user: Accounts.user(), + }); +}, LoginForm); diff --git a/main_client.js b/main_client.js index 68919b9..e73715e 100644 --- a/main_client.js +++ b/main_client.js @@ -3,8 +3,10 @@ import './imports/accounts_ui.js'; import './imports/login_session.js'; import { STATES } from './imports/helpers.js'; import './imports/api/client/loginWithoutPassword.js'; +import LoginForm from './imports/ui/components/LoginForm.jsx'; -import './imports/ui/components/LoginForm.jsx'; - -export { Accounts, STATES }; -export default Accounts; +export { + LoginForm as default, + Accounts, + STATES, +}; diff --git a/main_server.js b/main_server.js index 6dfc35e..10d0d78 100644 --- a/main_server.js +++ b/main_server.js @@ -4,8 +4,10 @@ import './imports/login_session.js'; import { redirect, STATES } from './imports/helpers.js'; import './imports/api/server/loginWithoutPassword.js'; import './imports/api/server/servicesListPublication.js'; +import LoginForm from './imports/ui/components/LoginForm.jsx'; -import './imports/ui/components/LoginForm.jsx'; - -export { Accounts, redirect, STATES }; -export default Accounts; +export { + LoginForm as default, + Accounts, + STATES, +}; diff --git a/package.js b/package.js index cbab22e..35a5d58 100644 --- a/package.js +++ b/package.js @@ -16,6 +16,7 @@ Package.onUse(function(api) { api.use('random'); api.use('email'); api.use('session'); + api.use('react-meteor-data'); api.use('softwarerero:accounts-t9n'); api.use('tmeasday:check-npm-versions@0.3.0'); diff --git a/package.json b/package.json index d96787a..816fe10 100644 --- a/package.json +++ b/package.json @@ -18,8 +18,8 @@ "homepage": "https://github.com/studiointeract/accounts-ui", "dependencies": {}, "peerDependencies": { - "react": ">=0.14.7 || ^15.0.0", - "react-dom": ">=0.14.7 || ^15.0.0", - "tracker-component": "^1.3.16" + "react": "^15.0.0", + "react-dom": "^15.0.0", + "react-addons-pure-render-mixin": "^15.0.0" } }