Skip to content

Conversation

@kieckhafer
Copy link
Member

@kieckhafer kieckhafer commented Aug 25, 2017

Resolves issue #2740
Resolves issue #2493
Resolves issue #2778

Move some account related components from Move accounts package from /client/modules/accounts into /imports/plugins/core/accounts. Follow up task in #2746 .

Add email update fields to profile page

Pull up ReactionAvatar component from client project into the core

Follow-up tasks:
Email copy for new email: #2778

@kieckhafer kieckhafer changed the title [WIP] Moving accounts package into /imports [WIP] Moving accounts package into /imports Aug 25, 2017
@kieckhafer kieckhafer requested a review from spencern August 25, 2017 20:34
@kieckhafer kieckhafer changed the title [WIP] Moving accounts package into /imports Moving accounts package into /imports Aug 25, 2017
@kieckhafer kieckhafer changed the title Moving accounts package into /imports [WIP] Moving accounts package into /imports, adding email update to profile Aug 28, 2017
@aaronjudd aaronjudd requested review from aaronjudd and jshimko and removed request for spencern August 29, 2017 00:21
@kieckhafer kieckhafer changed the title [WIP] Moving accounts package into /imports, adding email update to profile Moving accounts package into /imports, adding email update to profile Aug 31, 2017
sendUpdatedVerificationEmail(user._id);

// Sync users and accounts collections
syncUsersAndAccounts();
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure this is the best way to sync users and accounts... any input would be appreciated

* @param {String} email - user email
* @returns {Boolean} - returns boolean
*/
export function updateEmailAddress(email) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After a bit of research, this seems to be the way people update email addresses on Meteor, first by adding a new one, then removing the old one. There is no callback on meteor's Accounts.addEmail, so I think you kind of have to send it back tot he client and do it this way.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seems sensible to me.

@kieckhafer kieckhafer requested review from aaronjudd and removed request for aaronjudd and jshimko August 31, 2017 21:28
@aaronjudd aaronjudd removed their request for review September 5, 2017 18:56
@aaronjudd
Copy link
Contributor

bitHound - Dependencies — 1 failing dependency.

Copy link
Contributor

@jshimko jshimko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've already fixed everything, so I really only added all of these comments for reference. I'm pushing up my changes now. Give them a look/test. If everything works for you, I'm good to go on my end.


this.state = {
email: props.email,
newEmail: false,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this.state.newEmail isn't used anywhere.

};

this.handleFieldChange = this.handleFieldChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These bindings aren't needed because you defined those as arrow functions (accomplishes the same thing).


componentWillReceiveProps() {
this.setState({ showSpinner: false });
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this needed? I don't see how it does anything.

const { email } = this.state;

Meteor.call("accounts/validation/email", email, false, (result, error) => {
if (error.error) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All server communication or data fetching should always be in a container. This should just be passed in as an event handler prop. The UI component shouldn't need to know/care about how something gets done. It just handles the state of the UI.


Meteor.call("accounts/updateEmailAddress", email, (err) => {
if (err) {
Alerts.toast(i18next.t("accountsUI.error.emailAlreadyExists", { err: error.message }), "error");
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wrong error object here in the Alert. Should be err because error is from the upper scope.

import { Reaction } from "/client/api";
import { i18next } from "/client/api";
import * as Collections from "/lib/collections";
import UpdateEmail from "/imports/plugins/core/accounts/client/components/email/updateEmail";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be a registered component so it can be overridden.

*/
Template.accountProfile.helpers({

UpdateEmail() {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In both of these, the data fetching logic should be in a container, not the Blaze template.

import classnames from "classnames/dedupe";
import { registerComponent } from "@reactioncommerce/reaction-components";

class ReactionAvatar extends Component {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any component that only has a render function should be a simple stateless function. None of the React lifecycle methods or state handling are being used, so a Component class adds unnecessary overhead.
This also depends on an email being passed in, so it should have a container wrapping it (currently being done by a Blaze template)

}

// make sure we have a valid address
if (!address || !_.includes(_.map(user.emails || [], "address"), address)) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

_.includes should be Array.includes (I know you likely copied this from the other email verification function that I wrote. Just trying to be do it right moving forward. :))

* @param {String} email - user email
* @returns {Boolean} - returns boolean
*/
export function updateEmailAddress(email) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seems sensible to me.

@kieckhafer
Copy link
Member Author

@aaronjudd The react-measure v2.0 upgrade is a breaking change for us, something that I think would require a bit of a rewrite of the MediaGallery that's currently on the PDP. It might be better to hold off on updating just to get rid of that warning if we are planning on doing an overall update to MediaGallery: #2792 (comment)

@kieckhafer
Copy link
Member Author

kieckhafer commented Sep 7, 2017

react-measure has been updated to 2.0.

Would love to get this merged quickly please so we're able to pull the changes into a client project.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants