disable email input field when using OAuth, direct users to my.ghost.org for login details (#560)

no issue

- disables user email input field when using Ghost OAuth because email addresses are synced from the central identity management system
- adds a link to my.ghost.org account management when using Ghost OAuth and viewing your own user

app/controllers/team/user.js

@@ -43,8 +43,17 @@ export default Controller.extend({
     rolesDropdownIsVisible: and('isNotOwnProfile', 'canAssignRoles', 'isNotOwnersProfile'),
     userActionsAreVisible: or('deleteUserActionIsVisible', 'canMakeOwner'),
 
-    isNotOwnProfile: computed('user.id', 'currentUser.id', function () {
-        return this.get('user.id') !== this.get('currentUser.id');
+    isOwnProfile: computed('user.id', 'currentUser.id', function () {
+        return this.get('user.id') === this.get('currentUser.id');
+    }),
+    isNotOwnProfile: not('isOwnProfile'),
+    showMyGhostLink: and('config.ghostOAuth', 'isOwnProfile'),
+
+    canChangeEmail: computed('config.ghostOAuth', 'isAdminUserOnOwnerProfile', function () {
+        let ghostOAuth = this.get('config.ghostOAuth');
+        let isAdminUserOnOwnerProfile = this.get('isAdminUserOnOwnerProfile');
+
+        return !ghostOAuth && !isAdminUserOnOwnerProfile;
     }),
 
     deleteUserActionIsVisible: computed('currentUser', 'canAssignRoles', 'user', function () {

app/styles/patterns/boxes.css

@@ -2,6 +2,7 @@
 /* ---------------------------------------------------------- */
 
 .gh-box {
+    position: relative;
     padding: 12px 10px 14px 40px;
     border: 1px solid var(--lightgrey);
     border-left-width: 5px;

app/templates/team/user.hbs

@@ -104,12 +104,12 @@
                 {{#gh-form-group errors=user.errors hasValidated=user.hasValidated property="email"}}
                     <label for="user-email">Email</label>
                     {{!-- Administrators only see text of Owner's email address but not input --}}
-                    {{#unless isAdminUserOnOwnerProfile}}
+                    {{#if canChangeEmail}}
                         {{gh-input user.email type="email" id="user-email" name="email" placeholder="Email Address" autocapitalize="off" autocorrect="off" autocomplete="off" focusOut=(action "validate" "email" target=user) update=(action (mut user.email))}}
                         {{gh-error-message errors=user.errors property="email"}}
                     {{else}}
                         <span>{{user.email}}</span>
-                    {{/unless}}
+                    {{/if}}
                     <p>Used for notifications</p>
                 {{/gh-form-group}}
 
@@ -204,5 +204,12 @@
                 </fieldset>
             </form> {{! change password form }}
         {{/if}}
+
+        {{!-- when using Ghost OAuth, users trying to change email/pass need to visit my.ghost.org --}}
+        {{#if showMyGhostLink}}
+            <div class="user-profile">
+                <p class="gh-box gh-box-info"><i class="icon-lock"></i> To change your login details please visit <a href="https://my.ghost.org/account" target="_blank">https://my.ghost.org/account</a></p>
+            </div>
+        {{/if}}
     </div>
 </section>