SomeError

src/client/js/components/Admin/Users/UserMenu.jsx

@@ -7,111 +7,119 @@ import AppContainer from '../../../services/AppContainer';
 
 class UserMenu extends React.Component {
 
+  activateUser() {}
 
-  render() {
-    const { t } = this.props;
+  susupendUser() {}
+
+  removeUser() {}
+
+  removeFromAdmin() {}
 
-    // let contentOfStatus;
-    // if (user.status === 1) {}
-
-    // if (user.status === 2) {
-    // }
-
-    // if (user.status === 3) {}
-
-    // if (user.status === 1 || user.status === 5) {
-    //   contentOfStatus = (
-    //     <li className="dropdown-button">
-    //       <a href="javascript:form_removeCompletely_{{ sUserId }}.submit()">
-    //         <i className="icon-fw icon-fire text-danger"></i> { t('Delete') }
-    //       </a>
-    //     </li>
-    //   );
-    // }
-
-    // let adminMenu;
-    // if (user.admin === true) {
-    //   adminMenu = (
-    //     <li>
-    //       { username !== user.username
-    //         ? (
-    //           <li>
-    //             <a href="javascript:form_removeFromAdmin_{{ sUserId }}.submit()">
-    //               <i className="icon-fw icon-user-unfollow"></i> { t('user_management.remove_admin_access') }
-    //             </a>
-    //           </li>
-    //         )
-    //         : (
-    //           <li>
-    //             <a disabled>
-    //               <i className="icon-fw icon-user-unfollow"></i> { t('user_management.remove_admin_access') }
-    //             </a>
-    //             <p className="alert alert-danger m-l-10 m-r-10 p-10">{ t('user_management.cannot_remove') }</p>
-    //           </li>
-    //         )
-    //       }
-    //     </li>
-    //   );
-    // }
+  giveAdminAccess() {}
 
 
+  render() {
+    const { t } = this.props;
+    const users = this.props.users;
+    let contentOfStatus;
+    let adminMenu;
+
+    {this.props.users.forEach((user) => {
+      if (user.status === 1) {
+        contentOfStatus = (
+          <a onClick={this.activateUser}>
+            <i className="icon-fw icon-user-following"></i> { t('user_management.accept') }
+          </a>
+        );
+
+      if (user.status === 2) {
+        contentOfStatus = (
+          <li>
+            { username !== user.username
+              ? (
+                <li>
+                  <a onClick={this.susupendUser}>
+                    <i className="icon-fw icon-user-unfollow"></i> { t('user_management.deactivate_account') }
+                  </a>
+                </li>
+              )
+              : (
+                <li>
+                  <a disabled>
+                    <i className="icon-fw icon-ban"></i> { t('user_management.deactivate_account') }
+                  </a>
+                  <p className="alert alert-danger m-l-10 m-r-10 p-10">{ t('user_management.your_own') }</p>
+                </li>
+              )
+            }
+          </li>
+        );
+
+      if (user.status === 3) {
+        contentOfStatus = (
+          <a onClick={this.activateUser}>
+            <i className="icon-fw icon-action-redo"></i> { t('Undo') }
+          </a>
+        );
+
+      if (user.status === 1 || user.status === 5) {
+        contentOfStatus = (
+          <li className="dropdown-button">
+            <a onClick={this.removeUser}>
+              <i className="icon-fw icon-fire text-danger"></i> { t('Delete') }
+            </a>
+          </li>
+        );
+      }
+
+      if (user.admin === true) {
+        adminMenu = (
+          <li>
+            { username !== user.username
+              ? (
+                <li>
+                  <a onClick={this.removeFromAdmin}>
+                    <i className="icon-fw icon-user-unfollow"></i> { t('user_management.remove_admin_access') }
+                  </a>
+                </li>
+              )
+              : (
+                <li>
+                  <a disabled>
+                    <i className="icon-fw icon-user-unfollow"></i> { t('user_management.remove_admin_access') }
+                  </a>
+                  <p className="alert alert-danger m-l-10 m-r-10 p-10">{ t('user_management.cannot_remove') }</p>
+                </li>
+              )
+            }
+          </li>
+        );
+      }
+
+      else {
+        adminMenu = (
+          <li>
+            <a onClick={this.giveAdminAccess}>
+              <i className="icon-fw icon-magic-wand"></i> { t('user_management.give_admin_access') }
+            </a>
+          </li>
+        );
+      }
+    }}
+
     return (
       <Fragment>
         <div className="btn-group admin-user-menu">
           <button type="button" className="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
             <i className="icon-settings"></i> <span className="caret"></span>
           </button>
-          {/* <div className="modal fade" id="admin-password-reset-modal">
-            <div className="modal-dialog">
-              <div className="modal-content">
-                <div className="modal-header">
-                  <button type="button" className="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-                  <div className="modal-title">{ t('user_management.reset_password')}</div>
-                </div>
-
-                <div className="modal-body">
-                  <p>
-                    { t('user_management.password_never_seen') }<br />
-                    <span className="text-danger">{ t('user_management.send_new_password') }</span>
-                  </p>
-                  <p>
-                    { t('user_management.target_user') }: <code id="admin-password-reset-user"></code>
-                  </p>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div className="modal fade" id="admin-password-reset-modal-done">
-            <div className="modal-dialog">
-              <div className="modal-content">
-
-                <div className="modal-header">
-                  <button type="button" className="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-                  <div className="modal-title">{ t('user_management.reset_password') }</div>
-                </div>
-
-                <div className="modal-body">
-                  <p className="alert alert-danger">Let the user know the new password below and strongly recommend to change another one immediately. </p>
-                  <p>
-                  Reset user: <code id="admin-password-reset-done-user"></code>
-                  </p>
-                  <p>
-                  New password: <code id="admin-password-reset-done-password"></code>
-                  </p>
-                </div>
-                <div className="modal-footer">
-                  <button type="submit" className="btn btn-primary" data-dismiss="modal">OK</button>
-                </div>
-              </div>
-            </div>
-          </div> */}
           <ul className="dropdown-menu" role="menu">
             <li className="dropdown-header">{ t('user_management.edit_menu') }</li>
             <li>
               <a
                 href="#"
-                data-user-id="{{ sUserId }}"
-                data-user-email="{{ sUser.email }}"
+                data-user-id="{{ userId }}"
+                data-user-email="{{ user.email }}"
                 data-target="#admin-password-reset-modal"
                 data-toggle="modal"
               >
@@ -121,12 +129,56 @@ class UserMenu extends React.Component {
             </li>
             <li className="divider"></li>
             <li className="dropdown-header">{ t('status') }</li>
-            {/* <li>{contentOfStatus}</li>
-            <li>{user.status === 2 && adminMenu}</li> */}
+            <li>{contentOfStatus}</li>
+            <li>{user.status === 2 && adminMenu}</li>
           </ul>
         </div>
-      </Fragment>
+        {/* password reset modal */}
+        <div className="modal fade" id="admin-password-reset-modal">
+          <div className="modal-dialog">
+            <div className="modal-content">
+              <div className="modal-header">
+                <button type="button" className="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                <div className="modal-title">{ t('user_management.reset_password')}</div>
+              </div>
 
+              <div className="modal-body">
+                <p>
+                  { t('user_management.password_never_seen') }<br />
+                  <span className="text-danger">{ t('user_management.send_new_password') }</span>
+                </p>
+                <p>
+                  { t('user_management.target_user') }: <code id="admin-password-reset-user"></code>
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div className="modal fade" id="admin-password-reset-modal-done">
+          <div className="modal-dialog">
+            <div className="modal-content">
+
+              <div className="modal-header">
+                <button type="button" className="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                <div className="modal-title">{ t('user_management.reset_password') }</div>
+              </div>
+
+              <div className="modal-body">
+                <p className="alert alert-danger">Let the user know the new password below and strongly recommend to change another one immediately. </p>
+                <p>
+                Reset user: <code id="admin-password-reset-done-user"></code>
+                </p>
+                <p>
+                New password: <code id="admin-password-reset-done-password"></code>
+                </p>
+              </div>
+              <div className="modal-footer">
+                <button type="submit" className="btn btn-primary" data-dismiss="modal">OK</button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </Fragment>
     );
   }
 
@@ -140,6 +192,8 @@ UserMenu.propTypes = {
   t: PropTypes.func.isRequired, // i18next
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
 
+  users: PropTypes.array,
+
 };
 
 export default withTranslation()(UserMenuWrapper);

src/client/js/components/Admin/Users/UserTable.jsx

@@ -57,7 +57,7 @@ class UserTable extends React.Component {
                     { user.lastLoginAt && <span>{dateFnsFormat(new Date(user.lastLoginAt), 'YYYY-MM-DD HH:mm')}</span> }
                   </td>
                   <td>
-                    <UserMenu user={user} />
+                    <UserMenu users={this.props.users} />
                   </td>
                 </tr>
               );