Skip to content

Commit

Permalink
Merge pull request #40 from kbss-cvut/ui-support-keycloack
Browse files Browse the repository at this point in the history 
Disable and hide buttons that require keycloak auth
  • Loading branch information
@blcham
blcham authored Dec 13, 2023
2 parents 257620b + 03bec65 commit 7ffa550
Show file tree
Hide file tree
Showing 4 changed files with 55 additions and 23 deletions.
65 changes: 44 additions & 21 deletions js/components/user/User.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {LoaderCard, LoaderSmall} from "../Loader";
import HelpIcon from "../HelpIcon";
import PropTypes from "prop-types";
import {FaRandom} from 'react-icons/fa';
import {isUsingOidcAuth} from "../../utils/OidcUtils";

class User extends React.Component {
static propTypes = {
Expand Down Expand Up @@ -88,13 +89,33 @@ class User extends React.Component {
});
};

_passwordChange() {
_passwordChangeButton() {
const {user, currentUser, handlers} = this.props;
if (isUsingOidcAuth()) {
return null;
}
if (user.isNew || (currentUser.username !== user.username && currentUser.role !== ROLE.ADMIN)) {
return null;
} else {
return <Button style={{margin: '0 0.3em 0 0'}} variant='primary' size='sm' ref='submit'
onClick={handlers.onPasswordChange}>
{this.i18n('user.password-change')}
</Button>;
}
}

_externalEditUserButton() {
const {user, currentUser, handlers} = this.props;
if (!isUsingOidcAuth()) {
return null;
}
if (user.isNew || (currentUser.username !== user.username && currentUser.role !== ROLE.ADMIN)) {
return null;
} else {
return <Button style={{margin: '0 0.3em 0 0'}} variant='primary' size='sm' ref='submit'
onClick={handlers.onPasswordChange}>{this.i18n('user.password-change')}</Button>;
onClick={handlers.onKeycloakRedirect}>
{this.i18n('user.edit')}
</Button>;
}
}

Expand Down Expand Up @@ -191,27 +212,28 @@ class User extends React.Component {
<div className='row'>
<div className='col-12 col-sm-6'>
<HorizontalInput type='text' name='firstName' label={`${this.i18n('user.first-name')}*`}
disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username}
disabled={isUsingOidcAuth()}
value={user.firstName} labelWidth={3} inputWidth={8}
onChange={this._onChange}/>
</div>
<div className='col-12 col-sm-6'>
<HorizontalInput type='text' name='lastName' label={`${this.i18n('user.last-name')}*`}
disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username}
disabled={isUsingOidcAuth()}
value={user.lastName} labelWidth={3} inputWidth={8}
onChange={this._onChange}/>
</div>
</div>
<div className='row'>
<div className='col-12 col-sm-6'>
<HorizontalInput type='text' name='username' label={`${this.i18n('user.username')}*`}
disabled={!user.isNew} labelWidth={3} inputWidth={8}
disabled={!user.isNew || isUsingOidcAuth()}
labelWidth={3} inputWidth={8}
value={user.username} onChange={this._onChange}
iconRight={user.isNew ? generateButton : null}/>
</div>
<div className='col-12 col-sm-6'>
<HorizontalInput type='email' name='emailAddress' label={`${this.i18n('users.email')}*`}
disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username}
disabled={isUsingOidcAuth()}
value={user.emailAddress} labelWidth={3} inputWidth={8}
onChange={this._onChange}/>
</div>
Expand All @@ -232,8 +254,8 @@ class User extends React.Component {
<div className='col-12 col-sm-6'>
<HorizontalInput type='select' name='role' label={`${this.i18n('user.role')}*`}
onChange={this._onAdminStatusChange}
disabled={currentUser.role !== ROLE.ADMIN}
value={user.types && getRole(user)}
disabled={isUsingOidcAuth() || (currentUser.role !== ROLE.ADMIN)}
value={isUsingOidcAuth() ? true : user.types && getRole(user)}
labelWidth={3} inputWidth={8}>
{this._generateRolesOptions()}
</HorizontalInput>
Expand All @@ -250,19 +272,20 @@ class User extends React.Component {
}
<div className="buttons-line-height mt-3 text-center">
{this._impersonateButton()}
{this._passwordChange()}
{this._saveAndSendEmailButton()}
{(currentUser.role === ROLE.ADMIN || currentUser.username === user.username) &&
<Button variant='success' size='sm' ref='submit' className="d-inline-flex"
disabled={!UserValidator.isValid(user) || userSaved.status === ACTION_STATUS.PENDING}
onClick={() => this._onSave()}
title={this.i18n('required')}>
{this.i18n('save')}
{!UserValidator.isValid(user) &&
<HelpIcon className="align-self-center" text={this.i18n('required')}/>}
{userSaved.status === ACTION_STATUS.PENDING &&
<LoaderSmall/>}
</Button>
{this._passwordChangeButton()}
{this._externalEditUserButton()}
{!isUsingOidcAuth() && this._saveAndSendEmailButton()}
{(currentUser.role === ROLE.ADMIN || currentUser.username === user.username) &&
<Button variant='success' size='sm' ref='submit' className="d-inline-flex"
disabled={!UserValidator.isValid(user) || userSaved.status === ACTION_STATUS.PENDING}
onClick={() => this._onSave()}
title={this.i18n('required')}>
{this.i18n('save')}
{!UserValidator.isValid(user) &&
<HelpIcon className="align-self-center" text={this.i18n('required')}/>}
{userSaved.status === ACTION_STATUS.PENDING &&
<LoaderSmall/>}
</Button>
}
<Button variant='link' size='sm' onClick={handlers.onCancel}>
{this.i18n(this.props.backToInstitution ? 'users.back-to-institution' : 'cancel')}
Expand Down
11 changes: 9 additions & 2 deletions js/components/user/UserController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import {
import * as UserFactory from "../../utils/EntityFactory";
import omit from 'lodash/omit';
import {getRole} from "../../utils/Utils";
import {isUsingOidcAuth} from "../../utils/OidcUtils";
import {isUsingOidcAuth, userProfileLink} from "../../utils/OidcUtils";

class UserController extends React.Component {
constructor(props) {
Expand Down Expand Up @@ -149,6 +149,12 @@ class UserController extends React.Component {
}
};

_onRedirect = () => {
if (isUsingOidcAuth()) {
window.location = userProfileLink();
}
}

render() {
const {
currentUser, userSaved, userLoaded, institutionsLoaded,
Expand All @@ -165,7 +171,8 @@ class UserController extends React.Component {
generateUsername: this._generateUsername,
sendInvitation: this._sendInvitation,
impersonate: this._impersonate,
deleteInvitationOption: this._deleteInvitationOption
deleteInvitationOption: this._deleteInvitationOption,
onKeycloakRedirect: this._onRedirect
};
return <User user={this.state.user} handlers={handlers} backToInstitution={this.institution !== null}
userSaved={userSaved} showAlert={this.state.showAlert} userLoaded={userLoaded}
Expand Down
1 change: 1 addition & 0 deletions js/i18n/cs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@ export default {
'user.delete-invitation-option-error': 'Nepodařilo se smazat možnost pozvání uživatele do studie. {error}',
'user.impersonate': 'Impersonace',
'user.impersonate-error': 'Impersonace se nepodařila. {error}',
'user.edit': 'Upravit profil uživatele',

'institutions.panel-title': 'Instituce',
'institutions.create-institution': 'Vytvořit instituci',
Expand Down
1 change: 1 addition & 0 deletions js/i18n/en.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@ export default {
'user.delete-invitation-option-error': 'Unable to delete option to invite user to study. {error}',
'user.impersonate': 'Impersonate',
'user.impersonate-error': 'Unable to impersonate. {error}',
'user.edit': 'Edit user profile',

'institutions.panel-title': 'Institutions',
'institutions.create-institution': 'Create institution',
Expand Down

0 comments on commit 7ffa550

Please sign in to comment.