Ability to add/update user email

app/components/email-input.js

@@ -0,0 +1,62 @@
+import Component from '@ember/component';
+import { empty } from '@ember/object/computed';
+
+export default Component.extend({
+    type: '',
+    value: '',
+    isEditing: false,
+    user: null,
+    disableSave: empty('user.email'),
+    notValidEmail: false,
+    prevEmail: '',
+    emailIsNull: true,
+
+    actions: {
+        editEmail() {
+            let email = this.get('value');
+            let isEmailNull = function(email) {
+                return (email == null);
+            };
+
+            this.set('emailIsNull', isEmailNull(email));
+            this.set('isEditing', true);
+            this.set('prevEmail', this.get('value'));
+        },
+
+        saveEmail() {
+            let userEmail = this.get('value');
+            let user = this.get('user');
+
+            let emailIsProperFormat = function(userEmail) {
+                let regExp = /^\S+@\S+\.\S+$/;
+                return regExp.test(userEmail);
+            };
+
+            if (!emailIsProperFormat(userEmail)) {
+                this.set('notValidEmail', true);
+                return;
+            }
+
+            user.set('email', userEmail);
+            user.save()
+                .then(() => this.set('serverError', null))
+                .catch(err => {
+                    let msg;
+                    if (err.errors && err.errors[0] && err.errors[0].detail) {
+                        msg = `An error occurred while saving this email, ${err.errors[0].detail}`;
+                    } else {
+                        msg = 'An unknown error occurred while saving this email.';
+                    }
+                    this.set('serverError', msg);
+                });
+
+            this.set('isEditing', false);
+            this.set('notValidEmail', false);
+        },
+
+        cancelEdit() {
+            this.set('isEditing', false);
+            this.set('value', this.get('prevEmail'));
+        }
+    }
+});

app/components/validated-input.js

@@ -0,0 +1,41 @@
+import Ember from 'ember';
+
+const {
+    computed,
+    defineProperty
+} = Ember;
+
+export default Ember.Component.extend({
+    classNames: ['validated-input'],
+    classNameBindings: ['showErrorClass:has-error', 'isValid:has-success'],
+    model: null,
+    value: null,
+    type: 'text',
+    valuePath: '',
+    placeholder: '',
+    validation: null,
+    showValidations: false,
+    didValidate: false,
+
+    notValidating: computed.not('validation.isValidating').readOnly(),
+    hasContent: computed.notEmpty('value').readOnly(),
+    hasWarnings: computed.notEmpty('validation.warnings').readOnly(),
+    isValid: computed.and('hasContent', 'validation.isTruelyValid').readOnly(),
+    shouldDisplayValidations: computed.or('showValidations', 'didValidate', 'hasContent').readOnly(),
+
+    showErrorClass: computed.and('notValidating', 'showErrorMessage', 'hasContent', 'validation').readOnly(),
+    showErrorMessage: computed.and('shouldDisplayValidations', 'validation.isInvalid').readOnly(),
+
+    init() {
+        this._super(...arguments);
+        let valuePath = this.get('valuePath');
+
+        defineProperty(this, 'validation', computed.readOnly(`model.validations.attrs.${valuePath}`));
+        defineProperty(this, 'value', computed.alias(`model.${valuePath}`));
+    },
+
+    focusOut() {
+        this._super(...arguments);
+        this.set('showValidations', true);
+    }
+});

app/styles/me.scss

@@ -16,6 +16,48 @@
             clear: both;
         }
         dd { float: left; margin-left: 10px; }
+        .align-center {
+            @include align-items(center);
+        }
+        .row {
+            width: 100%;
+            border: 1px solid #d5d3cb;
+            border-bottom-width: 0px;
+            &:last-child { border-bottom-width: 1px; }
+            padding: 10px 20px 10px 0;
+            @include display-flex;
+            background-color: $main-bg-dark;
+            .small-text {
+                font-size: 90%;
+            }
+            .error {
+                color: rgb(216, 0, 41);
+            }
+            .label {
+                @include flex(1);
+                margin-right: 0.4em;
+                font-weight: bold;
+            }
+            .actions {
+                @include display-flex;
+                @include align-items(center);
+            }
+            .space-left {
+                margin-left: 10px;
+            }
+            .space-right {
+                margin-right: 10px;
+            }
+            .no-space-left {
+                margin-left: 0px;
+            }
+            p {
+                width: 80%;
+            }
+            .space-bottom {
+                margin-bottom: 10px;
+            }
+        }
     }
 
     @media only screen and (max-width: 550px) {

app/templates/components/email-input.hbs

@@ -0,0 +1,34 @@
+{{#if isEditing }}
+    <div class='row'>
+        <div class='label'>
+            <dt>Email</dt>
+        </div>
+        <form {{action 'saveEmail' on='submit'}}>
+            {{input type=type value=value placeholder='Email' class='form-control space-bottom'}}
+            {{#if notValidEmail }}
+                <p class='small-text error'>Invalid email format. Please try again.</p>
+            {{/if}}
+            {{#if emailIsNull }}
+                <p class='small-text'> Please add your email address. We will only use
+                it to contact you about your account. We promise we'll never share it!
+                </p>
+            {{/if}}
+            <div class='actions'>
+                <button type='submit' class='small yellow-button space-right' disabled={{disableSave}}>Save</button>
+                <button class='small yellow-button' {{action 'cancelEdit'}}>Cancel</button>
+            </div>
+        </form>
+    </div>
+{{else}}
+    <div class='row align-center'>
+        <div class='label'>
+            <dt>Email</dt>
+        </div>
+        <div class='email'>
+            <dd class='no-space-left'>{{ user.email }}</dd>
+        </div>
+        <div class='actions'>
+            <button class='small yellow-button space-left' {{action 'editEmail'}}>Edit</button>
+        </div>
+    </div>
+{{/if}}

app/templates/components/validated-input.hbs

@@ -0,0 +1,14 @@
+<div class='form-group'>
+    {{input type=type value=value placeholder=placeholder class='form-control' name=valuePath}}
+    {{#if isValid}}
+        <span class='valid-input fa fa-check'></span>
+    {{/if}}
+
+    <div class='input-error'>
+        {{#if showErrorMessage}}
+            <div class='error'>
+                {{v-get model valuePath 'message'}}
+            </div>
+        {{/if}}
+    </div>
+</div>

app/templates/me/index.hbs

@@ -16,8 +16,7 @@
             <dd>{{ model.user.name }}</dd>
             <dt>GitHub Account</dt>
             <dd>{{ model.user.login }}</dd>
-            <dt>Email</dt>
-            <dd>{{ model.user.email }}</dd>
+            {{email-input type='email' value=model.user.email user=model.user}}
         </dl>
     </div>
 </div>

src/lib.rs

@@ -151,6 +151,7 @@ pub fn middleware(app: Arc<App>) -> MiddlewareBuilder {
     api_router.get("/categories/:category_id", C(category::show));
     api_router.get("/category_slugs", C(category::slugs));
     api_router.get("/users/:user_id", C(user::show));
+    api_router.put("/users/:user_id", C(user::update_user));
     api_router.get("/users/:user_id/stats", C(user::stats));
     api_router.get("/teams/:team_id", C(user::show_team));
     let api_router = Arc::new(R404(api_router));

src/owner.rs

@@ -67,7 +67,6 @@ pub struct EncodableOwner {
     pub id: i32,
     pub login: String,
     pub kind: String,
-    pub email: Option<String>,
     pub url: Option<String>,
     pub name: Option<String>,
     pub avatar: Option<String>,
@@ -361,7 +360,6 @@ impl Owner {
         match self {
             Owner::User(User {
                             id,
-                            email,
                             name,
                             gh_login,
                             gh_avatar,
@@ -371,7 +369,6 @@ impl Owner {
                 EncodableOwner {
                     id: id,
                     login: gh_login,
-                    email: email,
                     avatar: gh_avatar,
                     url: Some(url),
                     name: name,
@@ -389,7 +386,6 @@ impl Owner {
                 EncodableOwner {
                     id: id,
                     login: login,
-                    email: None,
                     url: Some(url),
                     avatar: avatar,
                     name: name,

src/tests/krate.rs

@@ -22,7 +22,7 @@ use cargo_registry::owner::EncodableOwner;
 use cargo_registry::schema::versions;
 
 use cargo_registry::upload as u;
-use cargo_registry::user::EncodableUser;
+use cargo_registry::user::EncodablePublicUser;
 use cargo_registry::version::EncodableVersion;
 use cargo_registry::category::Category;
 
@@ -1216,7 +1216,7 @@ fn following() {
 fn owners() {
     #[derive(Deserialize)]
     struct R {
-        users: Vec<EncodableUser>,
+        users: Vec<EncodablePublicUser>,
     }
     #[derive(Deserialize)]
     struct O {