From e881f18e3147395b99f2741c02fb3bb037a070ba Mon Sep 17 00:00:00 2001
From: Max Chopart <max.chopart@gmail.com>
Date: Thu, 14 Dec 2023 12:03:33 +0100
Subject: [PATCH] [New #49] Handling user management with keycloak Resolves #12

---
 js/components/user/User.js           | 63 +++++++++++++---------------
 js/components/user/UserController.js |  1 +
 2 files changed, 29 insertions(+), 35 deletions(-)

diff --git a/js/components/user/User.js b/js/components/user/User.js
index a1c6a0e1..a47574eb 100644
--- a/js/components/user/User.js
+++ b/js/components/user/User.js
@@ -89,33 +89,23 @@ class User extends React.Component {
         });
     };
 
-    _passwordChangeButton() {
+    _passwordChange() {
         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.onPasswordChange}>{this.i18n('user.password-change')}</Button>;
         }
     }
 
-    _externalEditUserButton() {
+    _redirectToKeycloak() {
         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.onKeycloakRedirect}>
-                {this.i18n('user.edit')}
-            </Button>;
+                           onClick={handlers.onKeycloakRedirect}>{this.i18n('user.edit')}</Button>;
         }
     }
 
@@ -212,13 +202,15 @@ 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={isUsingOidcAuth()}
+                                             disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username
+                                                 || 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={isUsingOidcAuth()}
+                                             disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username
+                                                 || isUsingOidcAuth()}
                                              value={user.lastName} labelWidth={3} inputWidth={8}
                                              onChange={this._onChange}/>
                         </div>
@@ -226,14 +218,14 @@ class User extends React.Component {
                     <div className='row'>
                         <div className='col-12 col-sm-6'>
                             <HorizontalInput type='text' name='username' label={`${this.i18n('user.username')}*`}
-                                             disabled={!user.isNew || isUsingOidcAuth()}
-                                             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={isUsingOidcAuth()}
+                                             disabled={currentUser.role !== ROLE.ADMIN && currentUser.username !== user.username
+                                                 || isUsingOidcAuth()}
                                              value={user.emailAddress} labelWidth={3} inputWidth={8}
                                              onChange={this._onChange}/>
                         </div>
@@ -254,8 +246,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={isUsingOidcAuth() || (currentUser.role !== ROLE.ADMIN)}
-                                             value={isUsingOidcAuth() ? true : user.types && getRole(user)}
+                                             disabled={currentUser.role !== ROLE.ADMIN || isUsingOidcAuth()}
+                                             value={user.types && getRole(user)}
                                              labelWidth={3} inputWidth={8}>
                                 {this._generateRolesOptions()}
                             </HorizontalInput>
@@ -272,20 +264,21 @@ class User extends React.Component {
                     }
                     <div className="buttons-line-height mt-3 text-center">
                         {this._impersonateButton()}
-                        {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>
+                        {isUsingOidcAuth() ?
+                            this._redirectToKeycloak() :
+                            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>
                         }
                         <Button variant='link' size='sm' onClick={handlers.onCancel}>
                             {this.i18n(this.props.backToInstitution ? 'users.back-to-institution' : 'cancel')}
diff --git a/js/components/user/UserController.js b/js/components/user/UserController.js
index c7c8a6c6..af835d44 100644
--- a/js/components/user/UserController.js
+++ b/js/components/user/UserController.js
@@ -168,6 +168,7 @@ class UserController extends React.Component {
             onCancel: this._onCancel,
             onChange: this._onChange,
             onPasswordChange: this._onPasswordChange,
+            onKeycloakRedirect: this._onRedirect,
             generateUsername: this._generateUsername,
             sendInvitation: this._sendInvitation,
             impersonate: this._impersonate,