diff --git a/frontend/src/pages/sys-admin/index.js b/frontend/src/pages/sys-admin/index.js
index dcfafaf817..6edc36e534 100644
--- a/frontend/src/pages/sys-admin/index.js
+++ b/frontend/src/pages/sys-admin/index.js
@@ -249,8 +249,9 @@ class SysAdmin extends React.Component {
               <AdminLoginLogs path="login" />
             </AdminLogs>
             <UsersLayout path={`${siteRoot}sys/users/*`} {...commonProps} />
+            <UsersLayout path={`${siteRoot}sys/users/admins`} {...commonProps} />
             <SearchUsers path={siteRoot + 'sys/search-users'} {...commonProps} />
-            <UserLayout path={`${siteRoot}sys/user/:email/`} {...commonProps} >
+            <UserLayout path={`${siteRoot}sys/users/:email/`} {...commonProps} >
               <User path="/" />
               <UserOwnedRepos path="owned-libraries" />
               <UserSharedRepos path="shared-libraries" />
diff --git a/frontend/src/pages/sys-admin/user-link.js b/frontend/src/pages/sys-admin/user-link.js
index 7c3e5d3fc7..84c41e56b7 100644
--- a/frontend/src/pages/sys-admin/user-link.js
+++ b/frontend/src/pages/sys-admin/user-link.js
@@ -11,7 +11,7 @@ const propTypes = {
 class UserLink extends Component {
 
   render() {
-    return <Link to={`${siteRoot}sys/user/${encodeURIComponent(this.props.email)}/`}>{this.props.name}</Link>;
+    return <Link to={`${siteRoot}sys/users/${encodeURIComponent(this.props.email)}/`}>{this.props.name}</Link>;
   }
 }
 
diff --git a/frontend/src/pages/sys-admin/users/index.css b/frontend/src/pages/sys-admin/users/index.css
new file mode 100644
index 0000000000..e7d70f783f
--- /dev/null
+++ b/frontend/src/pages/sys-admin/users/index.css
@@ -0,0 +1,3 @@
+.sys-admin-user-layout>div {
+  width: 100%;
+}
diff --git a/frontend/src/pages/sys-admin/users/index.js b/frontend/src/pages/sys-admin/users/index.js
index f4f1257eb3..30ee03f9f6 100644
--- a/frontend/src/pages/sys-admin/users/index.js
+++ b/frontend/src/pages/sys-admin/users/index.js
@@ -10,9 +10,14 @@ import AdminUsers from './admin-users';
 import LDAPImportedUsers from './ldap-imported-users';
 import LDAPUsers from './ldap-users';
 import UserNav from './user-nav';
+import toaster from '../../../components/toast';
+import { Utils } from '../../../utils/utils';
+import { systemAdminAPI } from '../../../utils/system-admin-api';
 import { eventBus } from '../../../components/common/event-bus';
 import { EVENT_BUS_TYPE } from '../../../components/common/event-bus-type';
 
+import './index.css';
+
 const UsersLayout = ({ ...commonProps }) => {
   const [sortBy, setSortBy] = useState('');
   const [sortOrder, setSortOrder] = useState('asc');
@@ -169,6 +174,17 @@ const UserLayout = ({ email, children, ...commonProps }) => {
     curTab = 'groups';
   }
 
+  useEffect(() => {
+    if (curTab !== 'info' && username === '') {
+      systemAdminAPI.sysAdminGetUser(decodeURIComponent(email)).then((res) => {
+        setUsername(res.data.name);
+      }).catch((error) => {
+        toaster.danger(Utils.getErrorMsg(error, true));
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   useEffect(() => {
     const unsubscribeUsername = eventBus.subscribe(EVENT_BUS_TYPE.SYNC_USERNAME, (username) => {
       setUsername(username);
@@ -183,7 +199,7 @@ const UserLayout = ({ email, children, ...commonProps }) => {
     <>
       <MainPanelTopbar {...commonProps} />
       <UserNav currentItem={curTab} email={email} userName={username} />
-      <div className="w-100 h-100 d-flex overflow-auto">{children}</div>
+      <div className="sys-admin-user-layout w-100 h-100 d-flex overflow-auto">{children}</div>
     </>
   );
 };
diff --git a/frontend/src/pages/sys-admin/users/user-nav.js b/frontend/src/pages/sys-admin/users/user-nav.js
index 89ff9dd4c0..b1ab407b56 100644
--- a/frontend/src/pages/sys-admin/users/user-nav.js
+++ b/frontend/src/pages/sys-admin/users/user-nav.js
@@ -53,7 +53,7 @@ class Nav extends React.Component {
                 key={index}
                 ref={el => this.itemRefs[index] = el}
               >
-                <Link to={`${siteRoot}sys/user/${encodeURIComponent(email)}/${item.urlPart}`} className={`nav-link m-0 ${currentItem == item.name ? ' active' : ''}`}>{item.text}</Link>
+                <Link to={`${siteRoot}sys/users/${encodeURIComponent(email)}/${item.urlPart}`} className={`nav-link m-0 ${currentItem == item.name ? ' active' : ''}`}>{item.text}</Link>
               </li>
             );
           })}