From d841d0e69c2e7dbe1475c166065f1ed25272c232 Mon Sep 17 00:00:00 2001
From: Felipe <84182706+felipe-rod123@users.noreply.github.com>
Date: Thu, 28 Sep 2023 15:37:25 -0300
Subject: [PATCH] fix review

---
 .../admin/users/UsersTable/UsersTable.tsx     | 83 +++++++++----------
 .../admin/users/UsersTable/UsersTableRow.tsx  | 11 +--
 .../admin/users/hooks/useFilterActiveUsers.ts |  5 +-
 .../users/hooks/useFilterPendingUsers.ts      |  5 +-
 .../admin/users/hooks/useFilterUsersByRole.ts |  5 +-
 .../rocketchat-i18n/i18n/en.i18n.json         |  4 +
 6 files changed, 55 insertions(+), 58 deletions(-)

diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx
index 7e24e60317eb..2dcc0b941073 100644
--- a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx
+++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx
@@ -86,15 +86,21 @@ const UsersTable = ({ reload, tab, onReload }: UsersTableProps): ReactElement |
 
 	const headers = useMemo(
 		() => [
+			<GenericTableHeaderCell key='name' direction={sortDirection} active={sortBy === 'name'} onClick={setSort} sort='name' w='x140'>
+				{t('Name')}
+			</GenericTableHeaderCell>,
 			mediaQuery && (
-				<GenericTableHeaderCell key='name' direction={sortDirection} active={sortBy === 'name'} onClick={setSort} sort='name'>
-					{t('Name')}
+				<GenericTableHeaderCell
+					key='username'
+					direction={sortDirection}
+					active={sortBy === 'username'}
+					onClick={setSort}
+					sort='username'
+					w='x140'
+				>
+					{t('Username')}
 				</GenericTableHeaderCell>
 			),
-
-			<GenericTableHeaderCell key='username' direction={sortDirection} active={sortBy === 'username'} onClick={setSort} sort='username'>
-				{t('Username')}
-			</GenericTableHeaderCell>,
 			mediaQuery && (
 				<GenericTableHeaderCell
 					key='email'
@@ -113,14 +119,7 @@ const UsersTable = ({ reload, tab, onReload }: UsersTableProps): ReactElement |
 				</GenericTableHeaderCell>
 			),
 			tab === 'all' && (
-				<GenericTableHeaderCell
-					w='x200'
-					key='status'
-					direction={sortDirection}
-					active={sortBy === 'status'}
-					onClick={setSort}
-					sort='status'
-				>
+				<GenericTableHeaderCell key='status' direction={sortDirection} active={sortBy === 'status'} onClick={setSort} sort='status'>
 					{t('Registration_status')}
 				</GenericTableHeaderCell>
 			),
@@ -132,7 +131,7 @@ const UsersTable = ({ reload, tab, onReload }: UsersTableProps): ReactElement |
 			),
 
 			tab === 'pending' && (
-				<GenericTableHeaderCell key='action' direction={sortDirection} active={sortBy === 'name'} onClick={setSort} sort='name' w='x320'>
+				<GenericTableHeaderCell key='action' direction={sortDirection} active={sortBy === 'name'} onClick={setSort} sort='name'>
 					{t('Pending_action')}
 				</GenericTableHeaderCell>
 			),
@@ -152,50 +151,44 @@ const UsersTable = ({ reload, tab, onReload }: UsersTableProps): ReactElement |
 				</GenericTable>
 			)}
 
-			{/* TODO: finish error state -> improve tab verification and add translations */}
-			{!isLoading && !isSuccess && tab !== 'all' && tab !== 'active' && (
-				<GenericTable>
-					<GenericTableHeader>{headers}</GenericTableHeader>
-					<GenericTableBody>
+			<GenericTable>
+				<GenericTableHeader>{headers}</GenericTableHeader>
+				<GenericTableBody>
+					{!isLoading && !isSuccess && tab !== 'all' && tab !== 'active' && (
 						<States>
 							<StatesIcon name='user' />
-							<StatesTitle>No deactivated users</StatesTitle>
-							<StatesSubtitle>Deactivated users appear here</StatesSubtitle>
+							<StatesTitle>{tab === 'pending' ? t('No_pending_users') : t('No_deactivated_users')}</StatesTitle>
+							<StatesSubtitle>{tab === 'pending' ? t('Users_who_are_pending') : t('Deactivated_users_appear_here')}</StatesSubtitle>
 						</States>
-					</GenericTableBody>
-				</GenericTable>
-			)}
+					)}
 
-			{isSuccess && !!data && !!filteredUsers && data.count > 0 && (
-				<>
-					<GenericTable>
-						<GenericTableHeader>{headers}</GenericTableHeader>
-						<GenericTableBody>
-							{/* TODO: fix user type */}
+					{isSuccess && !!data && !!filteredUsers && data.count > 0 && (
+						<>
 							{filteredUsers.map((user) => (
 								<UsersTableRow
 									key={user._id}
 									onClick={handleClickOrKeyDown}
 									mediaQuery={mediaQuery}
-									user={user as any}
+									user={user}
 									tab={tab}
 									refetchUsers={refetch}
 									onReload={onReload}
 								/>
 							))}
-						</GenericTableBody>
-					</GenericTable>
-					<Pagination
-						divider
-						current={current}
-						itemsPerPage={itemsPerPage}
-						count={data?.total || 0}
-						onSetItemsPerPage={setItemsPerPage}
-						onSetCurrent={setCurrent}
-						{...paginationProps}
-					/>
-				</>
-			)}
+						</>
+					)}
+				</GenericTableBody>
+			</GenericTable>
+			<Pagination
+				divider
+				current={current}
+				itemsPerPage={itemsPerPage}
+				count={data?.total || 0}
+				onSetItemsPerPage={setItemsPerPage}
+				onSetCurrent={setCurrent}
+				{...paginationProps}
+			/>
+
 			{isSuccess && data?.count === 0 && <GenericNoResults />}
 			{isError && (
 				<States>
diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTableRow.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTableRow.tsx
index 0e3733105cb2..3a3c36a07971 100644
--- a/apps/meteor/client/views/admin/users/UsersTable/UsersTableRow.tsx
+++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTableRow.tsx
@@ -13,7 +13,7 @@ import UserAvatar from '../../../../components/avatar/UserAvatar';
 import ActionsMenu from './ActionsMenu';
 
 type UsersTableRowProps = {
-	user: Pick<IUser, '_id' | 'username' | 'name' | 'status' | 'emails' | 'active' | 'avatarETag' | 'roles'>;
+	user: Pick<IUser, '_id' | 'username' | 'name' | 'status' | 'roles' | 'emails' | 'active' | 'avatarETag' | 'lastLogin'>;
 	onClick: (id: IUser['_id'], e: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => void;
 	mediaQuery: boolean;
 	refetchUsers: ReturnType<typeof useQuery>['refetch'];
@@ -92,15 +92,6 @@ const UsersTableRow = ({ user, onClick, mediaQuery, refetchUsers, onReload, tab
 				>
 					<Box display='flex' flexDirection='row' alignContent='flex-end'>
 						{active ? t('User_first_log_in') : t('Activation')}
-						{/* {active ? (
-							<Button small secondary mi='x32'>
-								{t('Resend_welcome_email')}
-							</Button>
-						) : (
-							<Button small primary mi='x32'>
-								{t('Activate')}
-							</Button>
-						)} */}
 					</Box>
 				</GenericTableCell>
 			)}
diff --git a/apps/meteor/client/views/admin/users/hooks/useFilterActiveUsers.ts b/apps/meteor/client/views/admin/users/hooks/useFilterActiveUsers.ts
index ab42e925fa36..762042638353 100644
--- a/apps/meteor/client/views/admin/users/hooks/useFilterActiveUsers.ts
+++ b/apps/meteor/client/views/admin/users/hooks/useFilterActiveUsers.ts
@@ -1,6 +1,9 @@
 import type { IUser } from '@rocket.chat/core-typings';
 
-export const useFilterActiveUsers = (users: Partial<IUser>[] | undefined, tab: string) => {
+export const useFilterActiveUsers = (
+	users: Pick<IUser, '_id' | 'username' | 'name' | 'status' | 'roles' | 'emails' | 'active' | 'avatarETag' | 'lastLogin'>[] | undefined,
+	tab: string,
+) => {
 	if (!users || tab !== 'active') return [];
 
 	return users.filter((currentUser) => currentUser.active);
diff --git a/apps/meteor/client/views/admin/users/hooks/useFilterPendingUsers.ts b/apps/meteor/client/views/admin/users/hooks/useFilterPendingUsers.ts
index 54c5051bb7d6..4cab19242463 100644
--- a/apps/meteor/client/views/admin/users/hooks/useFilterPendingUsers.ts
+++ b/apps/meteor/client/views/admin/users/hooks/useFilterPendingUsers.ts
@@ -1,6 +1,9 @@
 import type { IUser } from '@rocket.chat/core-typings';
 
-export const useFilterPendingUsers = (users: Partial<IUser>[] | undefined, tab: string) => {
+export const useFilterPendingUsers = (
+	users: Pick<IUser, '_id' | 'username' | 'name' | 'status' | 'roles' | 'emails' | 'active' | 'avatarETag' | 'lastLogin'>[] | undefined,
+	tab: string,
+) => {
 	if (!users || tab !== 'pending') return [];
 
 	return users.filter((currentUser) => currentUser.active === false || !currentUser.lastLogin);
diff --git a/apps/meteor/client/views/admin/users/hooks/useFilterUsersByRole.ts b/apps/meteor/client/views/admin/users/hooks/useFilterUsersByRole.ts
index 926fce0e0c70..41a2509b74d3 100644
--- a/apps/meteor/client/views/admin/users/hooks/useFilterUsersByRole.ts
+++ b/apps/meteor/client/views/admin/users/hooks/useFilterUsersByRole.ts
@@ -1,6 +1,9 @@
 import type { IUser } from '@rocket.chat/core-typings';
 
-export const useFilterUsersByRole = (users: Partial<IUser>[], selectedRoles: string[]) => {
+export const useFilterUsersByRole = (
+	users: Pick<IUser, '_id' | 'username' | 'name' | 'status' | 'roles' | 'emails' | 'active' | 'avatarETag' | 'lastLogin'>[],
+	selectedRoles: string[],
+) => {
 	if (!users.length || !selectedRoles.length || selectedRoles.includes('all')) return users;
 
 	return users.filter((currentUser) => {
diff --git a/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json b/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
index c7b4a0fa096e..9fc4b2052ee7 100644
--- a/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -6058,5 +6058,9 @@
   "User_first_log_in": "User first log in",
   "Resend_welcome_email": "Resend welcome email",
   "Activation": "Activation",
+  "No_pending_users": "No pending users",
+  "No_deactivated_users": "No deactivated users",
+  "Users_who_are_pending": "Users who are pending activation or have been manually created but haven't logged in yet appear here.",
+  "Deactivated_users_appear_here": "Deactivated users appear here.",
   "Theme_Appearence": "Theme Appearence"
 }