return post(url, data);
}
+
+export function getIdentityProviders () {
+ const url = window.baseUrl + '/api/users/identity_providers';
+ return getJSON(url);
+}
import React from 'react';
import { IndexLink } from 'react-router';
+import UserExternalIdentity from './UserExternalIdentity';
import Avatar from '../../../components/shared/avatar';
export default function UserCard ({ user }) {
<h1 id="name" className="display-inline-block">{user.name}</h1>
</IndexLink>
<span id="login" className="note big-spacer-left">{user.login}</span>
+ {!user.local && (
+ <span id="identity-provider" className="big-spacer-left">
+ <UserExternalIdentity user={user}/>
+ </span>
+ )}
</div>
<div id="email" className="little-spacer-top">{user.email}</div>
</section>
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2016 SonarSource SA
+ * mailto:contact AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+import React from 'react';
+
+import { getIdentityProviders } from '../../../api/users';
+
+export default class UserExternalIdentity extends React.Component {
+ state = {
+ loading: true
+ };
+
+ componentDidMount () {
+ this.mounted = true;
+ this.fetchIdentityProviders();
+ }
+
+ componentDidUpdate (nextProps) {
+ if (nextProps.user !== this.props.user) {
+ this.this.fetchIdentityProviders();
+ }
+ }
+
+ componentWillUnmount () {
+ this.mounted = false;
+ }
+
+ fetchIdentityProviders () {
+ this.setState({ loading: true });
+ getIdentityProviders()
+ .then(r => r.identityProviders)
+ .then(providers => {
+ if (this.mounted) {
+ const identityProvider = providers
+ .find(provider => provider.key === this.props.user.externalProvider);
+ this.setState({ loading: false, identityProvider });
+ }
+ })
+ .catch(() => {
+ if (this.mounted) {
+ this.setState({ loading: false });
+ }
+ });
+ }
+
+ render () {
+ const { user } = this.props;
+ const { loading, identityProvider } = this.state;
+
+ if (loading) {
+ return null;
+ }
+
+ if (!identityProvider) {
+ return (
+ <span className="note">
+ {user.externalProvider}{': '}{user.externalIdentity}
+ </span>
+ );
+ }
+
+ return (
+ <div
+ className="identity-provider"
+ style={{ backgroundColor: identityProvider.backgroundColor }}>
+ <img src={window.baseUrl + identityProvider.iconPath} width="14" height="14"/>
+ {' '}
+ {user.externalIdentity}
+ </div>
+ );
+ }
+}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import Marionette from 'backbone.marionette';
+
import Layout from './layout';
import Users from './users';
import HeaderView from './header-view';
import SearchView from './search-view';
import ListView from './list-view';
import ListFooterView from './list-footer-view';
+import { getIdentityProviders } from '../../api/users';
const App = new Marionette.Application();
-const init = function () {
+
+const init = function (providers) {
const options = window.sonarqube;
// Layout
this.layout.searchRegion.show(this.searchView);
// List View
- this.listView = new ListView({ collection: this.users });
+ this.listView = new ListView({ collection: this.users, providers });
this.layout.listRegion.show(this.listView);
// List Footer View
};
App.on('start', function () {
- init.call(App);
+ getIdentityProviders().then(r => init.call(App, r.identityProviders));
});
window.sonarqube.appStarted.then(options => App.start(options));
serializeData () {
const scmAccounts = this.model.get('scmAccounts');
const scmAccountsLimit = scmAccounts.length > this.scmLimit ? this.scmLimit - 1 : this.scmLimit;
+
const groups = this.model.get('groups');
const groupsLimit = groups.length > this.groupsLimit ? this.groupsLimit - 1 : this.groupsLimit;
+
+ const externalProvider = this.model.get('externalProvider');
+ const identityProvider = this.model.get('local') ? null :
+ this.options.providers.find(provider => externalProvider === provider.key);
+
return _.extend(Marionette.ItemView.prototype.serializeData.apply(this, arguments), {
+ identityProvider,
firstScmAccounts: _.first(scmAccounts, scmAccountsLimit),
moreScmAccountsCount: scmAccounts.length - scmAccountsLimit,
firstGroups: _.first(groups, groupsLimit),
'sync': 'hideLoading'
},
+ childViewOptions () {
+ return { providers: this.options.providers };
+ },
+
showLoading () {
this.$el.addClass('new-loading');
},
<strong class="js-user-name">{{name}}</strong>
<span class="js-user-login note little-spacer-left">{{login}}</span>
</div>
- <div class="js-user-email little-spacer-top">{{email}}</div>
+
+ {{#if email}}
+ <div class="js-user-email little-spacer-top">{{email}}</div>
+ {{/if}}
+
+ {{#unless local}}
+ <div class="js-user-identity-provider little-spacer-top">
+ {{#if identityProvider}}
+ <div class="identity-provider" style="background-color: {{identityProvider.backgroundColor}}">
+ <img src="{{link identityProvider.iconPath}}" width="14" height="14"/>
+ {{externalIdentity}}
+ </div>
+ {{else}}
+ {{externalProvider}}: {{externalIdentity}}
+ {{/if}}
+ </div>
+ {{/unless}}
</td>
<td>
<td class="thin nowrap text-right">
<a class="js-user-update icon-edit little-spacer-right" title="Update Details" data-toggle="tooltip" href="#"></a>
- <a class="js-user-change-password icon-lock little-spacer-right" title="Change Password" data-toggle="tooltip"
- href="#"></a>
+ {{#if local}}
+ <a class="js-user-change-password icon-lock little-spacer-right" title="Change Password" data-toggle="tooltip"
+ href="#"></a>
+ {{/if}}
<a class="js-user-deactivate icon-delete" title="Deactivate" data-toggle="tooltip" href="#"></a>
</td>
.flash-heavy.in {
background-color: #ffe456;
}
+
+
+.identity-provider {
+ display: inline-block;
+ line-height: 14px;
+ padding: 3px 5px;
+ border-radius: 3px;
+ font-size: @smallFontSize;
+ color: #fff;
+}
projects / sonarqube.git / commitdiff