From 2da9090b339986a045618c741be35002e230fe48 Mon Sep 17 00:00:00 2001 From: Pranshu Gupta Date: Wed, 10 Apr 2024 00:13:30 +0530 Subject: [PATCH] UserType fix part 2 (#1894) * add tests * add tests * fix type and remove userType * remove userType * remove userType * fix type and userType * code cov * Fix async issue in Events.test.tsx * code cov for Users --- .../OrganizationScreen.test.tsx | 2 - .../OrganizationSidebar.test.tsx | 2 - .../SecuredRouteForUser.test.tsx | 3 +- .../OrganizationDashboard.test.tsx | 7 ++- .../OrganizationPeople/MockDataTypes.ts | 2 - .../OrganizationPeople.test.tsx | 17 ------ src/screens/UserPortal/Chat/Chat.test.tsx | 3 - src/screens/UserPortal/Events/Events.test.tsx | 8 ++- src/screens/UserPortal/Events/Events.tsx | 9 ++- src/screens/UserPortal/People/People.test.tsx | 4 -- src/screens/UserPortal/People/People.tsx | 17 +++++- src/screens/Users/Users.test.tsx | 25 ++++++++- src/screens/Users/Users.tsx | 55 ++++++++----------- 13 files changed, 82 insertions(+), 72 deletions(-) diff --git a/src/components/OrganizationScreen/OrganizationScreen.test.tsx b/src/components/OrganizationScreen/OrganizationScreen.test.tsx index a75c1ed422..ef6552c301 100644 --- a/src/components/OrganizationScreen/OrganizationScreen.test.tsx +++ b/src/components/OrganizationScreen/OrganizationScreen.test.tsx @@ -74,8 +74,6 @@ const clickToggleMenuBtn = (toggleButton: HTMLElement): void => { describe('Testing LeftDrawer in OrganizationScreen', () => { test('Testing LeftDrawer in page functionality', async () => { - setItem('UserType', 'SUPERADMIN'); - render( diff --git a/src/components/UserPortal/OrganizationSidebar/OrganizationSidebar.test.tsx b/src/components/UserPortal/OrganizationSidebar/OrganizationSidebar.test.tsx index f588bb98c6..950e913352 100644 --- a/src/components/UserPortal/OrganizationSidebar/OrganizationSidebar.test.tsx +++ b/src/components/UserPortal/OrganizationSidebar/OrganizationSidebar.test.tsx @@ -65,7 +65,6 @@ const MOCKS = [ image: null, email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, { _id: '64001660a711c62d5b4076a3', @@ -74,7 +73,6 @@ const MOCKS = [ image: 'mockImage', email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, ], }, diff --git a/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx b/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx index b87e12a409..93b71b14f1 100644 --- a/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx +++ b/src/components/UserPortal/SecuredRouteForUser/SecuredRouteForUser.test.tsx @@ -10,7 +10,6 @@ describe('SecuredRouteForUser', () => { test('renders the route when the user is logged in', () => { // Set the 'IsLoggedIn' value to 'TRUE' in localStorage to simulate a logged-in user and do not set 'AdminFor' so that it remains undefined. setItem('IsLoggedIn', 'TRUE'); - //setItem('UserType', 'USER'); render( @@ -59,7 +58,7 @@ describe('SecuredRouteForUser', () => { }); }); - test('renders the route when the user is logged in and userType is ADMIN', () => { + test('renders the route when the user is logged in and user is ADMIN', () => { // Set the 'IsLoggedIn' value to 'TRUE' in localStorage to simulate a logged-in user and set 'AdminFor' to simulate ADMIN of some Organization. setItem('IsLoggedIn', 'TRUE'); setItem('AdminFor', [ diff --git a/src/screens/OrganizationDashboard/OrganizationDashboard.test.tsx b/src/screens/OrganizationDashboard/OrganizationDashboard.test.tsx index f45b37b187..e377826a73 100644 --- a/src/screens/OrganizationDashboard/OrganizationDashboard.test.tsx +++ b/src/screens/OrganizationDashboard/OrganizationDashboard.test.tsx @@ -15,6 +15,7 @@ import OrganizationDashboard from './OrganizationDashboard'; import { EMPTY_MOCKS, ERROR_MOCKS, MOCKS } from './OrganizationDashboardMocks'; import React from 'react'; const { setItem } = useLocalStorage(); +import type { InterfaceQueryOrganizationEventListItem } from 'utils/interfaces'; async function wait(ms = 100): Promise { await act(() => { @@ -45,7 +46,6 @@ jest.mock('react-router-dom', () => ({ beforeEach(() => { setItem('FirstName', 'John'); setItem('LastName', 'Doe'); - setItem('UserType', 'SUPERADMIN'); setItem( 'UserImage', 'https://api.dicebear.com/5.x/initials/svg?seed=John%20Doe', @@ -179,7 +179,10 @@ describe('Organisation Dashboard Page', () => { const mockSetState = jest.spyOn(React, 'useState'); jest.doMock('react', () => ({ ...jest.requireActual('react'), - useState: (initial: any) => [initial, mockSetState], + useState: (initial: InterfaceQueryOrganizationEventListItem[]) => [ + initial, + mockSetState, + ], })); await act(async () => { render( diff --git a/src/screens/OrganizationPeople/MockDataTypes.ts b/src/screens/OrganizationPeople/MockDataTypes.ts index 78088f51e8..c12bb05531 100644 --- a/src/screens/OrganizationPeople/MockDataTypes.ts +++ b/src/screens/OrganizationPeople/MockDataTypes.ts @@ -7,7 +7,6 @@ type User = { image: string | null; _id: string; email: string; - userType: string; createdAt: string; joinedOrganizations: { __typename: string; @@ -30,7 +29,6 @@ type Edge = { image?: string | null; email?: string; createdAt?: string; - userType?: string; user?: Edge; }; export type TestMock = { diff --git a/src/screens/OrganizationPeople/OrganizationPeople.test.tsx b/src/screens/OrganizationPeople/OrganizationPeople.test.tsx index f0fbcfa4be..e458766666 100644 --- a/src/screens/OrganizationPeople/OrganizationPeople.test.tsx +++ b/src/screens/OrganizationPeople/OrganizationPeople.test.tsx @@ -46,7 +46,6 @@ const createMemberMock = ( image: null, email: 'member@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ], }, @@ -65,7 +64,6 @@ const createMemberMock = ( image: null, email: 'member@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, }, ], @@ -99,7 +97,6 @@ const createAdminMock = ( image: null, email: 'admin@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, }, ], @@ -120,7 +117,6 @@ const createAdminMock = ( image: null, email: 'admin@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', lol: true, }, }, @@ -152,7 +148,6 @@ const createUserMock = ( image: 'tempUrl', _id: '64001660a711c62d5b4076a2', email: 'adidacreator1@gmail.com', - userType: 'SUPERADMIN', createdAt: '2023-03-02T03:22:08.101Z', joinedOrganizations: [ { @@ -170,7 +165,6 @@ const createUserMock = ( image: 'tempUrl', _id: '6402030dce8e8406b8f07b0e', email: 'adi1@gmail.com', - userType: 'USER', createdAt: '2023-03-03T14:24:13.084Z', joinedOrganizations: [ { @@ -279,7 +273,6 @@ const MOCKS: TestMock[] = [ image: null, email: 'member@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ], }, @@ -297,7 +290,6 @@ const MOCKS: TestMock[] = [ image: null, email: 'member@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ], }, @@ -325,7 +317,6 @@ const MOCKS: TestMock[] = [ image: null, email: 'admin@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ], }, @@ -344,7 +335,6 @@ const MOCKS: TestMock[] = [ image: null, email: 'admin@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', lol: true, }, ], @@ -373,7 +363,6 @@ const MOCKS: TestMock[] = [ image: 'tempUrl', _id: '64001660a711c62d5b4076a2', email: 'adidacreator1@gmail.com', - userType: 'SUPERADMIN', createdAt: '2023-03-02T03:22:08.101Z', joinedOrganizations: [ { @@ -391,7 +380,6 @@ const MOCKS: TestMock[] = [ image: 'tempUrl', _id: '6402030dce8e8406b8f07b0e', email: 'adi1@gmail.com', - userType: 'USER', createdAt: '2023-03-03T14:24:13.084Z', joinedOrganizations: [ { @@ -437,7 +425,6 @@ const MOCKS: TestMock[] = [ image: null, _id: '65378abd85008f171cf2990d', email: 'testadmin1@example.com', - userType: 'ADMIN', createdAt: '2023-04-13T04:53:17.742Z', joinedOrganizations: [ { @@ -612,7 +599,6 @@ describe('Organization People Page', () => { image: null, email: 'member@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ]); @@ -630,7 +616,6 @@ describe('Organization People Page', () => { image: 'tempUrl', _id: '64001660a711c62d5b4076a2', email: 'adidacreator1@gmail.com', - userType: 'SUPERADMIN', createdAt: '2023-03-02T03:22:08.101Z', joinedOrganizations: [ { @@ -648,7 +633,6 @@ describe('Organization People Page', () => { image: 'tempUrl', _id: '6402030dce8e8406b8f07b0e', email: 'adi1@gmail.com', - userType: 'USER', createdAt: '2023-03-03T14:24:13.084Z', joinedOrganizations: [ { @@ -668,7 +652,6 @@ describe('Organization People Page', () => { image: null, email: 'admin@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'USER', }, ]); diff --git a/src/screens/UserPortal/Chat/Chat.test.tsx b/src/screens/UserPortal/Chat/Chat.test.tsx index c92c4fa67b..b090266acf 100644 --- a/src/screens/UserPortal/Chat/Chat.test.tsx +++ b/src/screens/UserPortal/Chat/Chat.test.tsx @@ -33,7 +33,6 @@ const MOCKS = [ image: null, email: 'noble1@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, { _id: '64001660a711c62d5b4076a3', @@ -42,7 +41,6 @@ const MOCKS = [ image: 'mockImage', email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, ], }, @@ -68,7 +66,6 @@ const MOCKS = [ image: null, email: 'john@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, ], }, diff --git a/src/screens/UserPortal/Events/Events.test.tsx b/src/screens/UserPortal/Events/Events.test.tsx index 7f4c3dd6c1..00a2e0aca5 100644 --- a/src/screens/UserPortal/Events/Events.test.tsx +++ b/src/screens/UserPortal/Events/Events.test.tsx @@ -18,6 +18,9 @@ import { LocalizationProvider } from '@mui/x-date-pickers'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { ThemeProvider } from 'react-bootstrap'; import { createTheme } from '@mui/material'; +import useLocalStorage from 'utils/useLocalstorage'; + +const { setItem, getItem } = useLocalStorage(); jest.mock('react-toastify', () => ({ toast: { @@ -273,7 +276,10 @@ describe('Testing Events Screen [User Portal]', () => { , ); - + setItem('SuperAdmin', true); // testing userRole as Superadmin + await wait(); + setItem('SuperAdmin', false); + setItem('AdminFor', ['123']); // testing userRole as Admin await wait(); }); diff --git a/src/screens/UserPortal/Events/Events.tsx b/src/screens/UserPortal/Events/Events.tsx index effec6b4af..08c730a759 100644 --- a/src/screens/UserPortal/Events/Events.tsx +++ b/src/screens/UserPortal/Events/Events.tsx @@ -119,7 +119,14 @@ export default function events(): JSX.Element { const [create] = useMutation(CREATE_EVENT_MUTATION); const userId = getItem('id') as string; - const userRole = getItem('UserType') as string; + + const superAdmin = getItem('SuperAdmin'); + const adminFor = getItem('AdminFor'); + const userRole = superAdmin + ? 'SUPERADMIN' + : adminFor?.length > 0 + ? 'ADMIN' + : 'USER'; const createEvent = async ( e: ChangeEvent, diff --git a/src/screens/UserPortal/People/People.test.tsx b/src/screens/UserPortal/People/People.test.tsx index 393bcc4c30..a233c20015 100644 --- a/src/screens/UserPortal/People/People.test.tsx +++ b/src/screens/UserPortal/People/People.test.tsx @@ -34,7 +34,6 @@ const MOCKS = [ image: null, email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, { _id: '64001660a711c62d5b4076a3', @@ -43,7 +42,6 @@ const MOCKS = [ image: 'mockImage', email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, ], }, @@ -71,7 +69,6 @@ const MOCKS = [ image: null, email: 'noble@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'Admin', }, ], }, @@ -98,7 +95,6 @@ const MOCKS = [ image: null, email: 'john@gmail.com', createdAt: '2023-03-02T03:22:08.101Z', - userType: 'User', }, ], }, diff --git a/src/screens/UserPortal/People/People.tsx b/src/screens/UserPortal/People/People.tsx index 058a3ce170..a36d7e1ed6 100644 --- a/src/screens/UserPortal/People/People.tsx +++ b/src/screens/UserPortal/People/People.tsx @@ -24,6 +24,15 @@ interface InterfaceOrganizationCardProps { sno: string; } +interface InterfaceMember { + firstName: string; + lastName: string; + image: string; + _id: string; + email: string; + userType: string; +} + export default function people(): JSX.Element { const { t } = useTranslation('translation', { keyPrefix: 'userOrganizations', @@ -76,9 +85,11 @@ export default function people(): JSX.Element { }); }; - const handleSearchByEnter = (e: any): void => { + const handleSearchByEnter = ( + e: React.KeyboardEvent, + ): void => { if (e.key === 'Enter') { - const { value } = e.target; + const { value } = e.currentTarget; handleSearch(value); } }; @@ -197,7 +208,7 @@ export default function people(): JSX.Element { ) : /* istanbul ignore next */ members - ).map((member: any, index) => { + ).map((member: InterfaceMember, index) => { const name = `${member.firstName} ${member.lastName}`; const cardProps: InterfaceOrganizationCardProps = { diff --git a/src/screens/Users/Users.test.tsx b/src/screens/Users/Users.test.tsx index 6e88617b3b..59e16a7878 100644 --- a/src/screens/Users/Users.test.tsx +++ b/src/screens/Users/Users.test.tsx @@ -15,7 +15,7 @@ import Users from './Users'; import { EMPTY_MOCKS, MOCKS, MOCKS2 } from './UsersMocks'; import useLocalStorage from 'utils/useLocalstorage'; -const { setItem } = useLocalStorage(); +const { setItem, removeItem } = useLocalStorage(); const link = new StaticMockLink(MOCKS, true); const link2 = new StaticMockLink(EMPTY_MOCKS, true); @@ -32,6 +32,7 @@ beforeEach(() => { setItem('id', '123'); setItem('SuperAdmin', true); setItem('FirstName', 'John'); + setItem('AdminFor', [{ name: 'adi', _id: '1234', image: '' }]); setItem('LastName', 'Doe'); }); @@ -59,7 +60,9 @@ describe('Testing Users screen', () => { test(`Component should be rendered properly when user is not superAdmin and or userId does not exists in localstorage`, async () => { - setItem('SuperAdmin', false); + setItem('AdminFor', ['123']); + removeItem('SuperAdmin'); + await wait(); setItem('id', ''); render( @@ -72,7 +75,25 @@ describe('Testing Users screen', () => { , ); + await wait(); + }); + test(`Component should be rendered properly when userId does not exists in localstorage`, async () => { + removeItem('AdminFor'); + removeItem('SuperAdmin'); + await wait(); + removeItem('id'); + render( + + + + + + + + + , + ); await wait(); }); diff --git a/src/screens/Users/Users.tsx b/src/screens/Users/Users.tsx index f56406b8d0..1158658532 100644 --- a/src/screens/Users/Users.tsx +++ b/src/screens/Users/Users.tsx @@ -34,25 +34,17 @@ const Users = (): JSX.Element => { const [searchByName, setSearchByName] = useState(''); const [sortingOption, setSortingOption] = useState('newest'); const [filteringOption, setFilteringOption] = useState('cancel'); - const userType = getItem('SuperAdmin') + const superAdmin = getItem('SuperAdmin'); + const adminFor = getItem('AdminFor'); + const userRole = superAdmin ? 'SUPERADMIN' - : getItem('AdminFor') + : adminFor?.length > 0 ? 'ADMIN' : 'USER'; + const loggedInUserId = getItem('id'); - const { - data: usersData, - loading: loading, - fetchMore, - refetch: refetchUsers, - }: { - data?: { users: InterfaceQueryUserListItem[] }; - loading: boolean; - fetchMore: any; - refetch: any; - error?: ApolloError; - } = useQuery(USER_LIST, { + const { data, loading, fetchMore, refetch } = useQuery(USER_LIST, { variables: { first: perPageResult, skip: 0, @@ -63,22 +55,22 @@ const Users = (): JSX.Element => { }); const { data: dataOrgs } = useQuery(ORGANIZATION_CONNECTION_LIST); - const [displayedUsers, setDisplayedUsers] = useState(usersData?.users || []); + const [displayedUsers, setDisplayedUsers] = useState(data?.users || []); // Manage loading more state useEffect(() => { - if (!usersData) { + if (!data) { return; } - if (usersData.users.length < perPageResult) { + if (data.users.length < perPageResult) { setHasMore(false); } - if (usersData && usersData.users) { - let newDisplayedUsers = sortUsers(usersData.users, sortingOption); + if (data && data.users) { + let newDisplayedUsers = sortUsers(data.users, sortingOption); newDisplayedUsers = filterUsers(newDisplayedUsers, filteringOption); setDisplayedUsers(newDisplayedUsers); } - }, [usersData, sortingOption, filteringOption]); + }, [data, sortingOption, filteringOption]); // To clear the search when the component is unmounted useEffect(() => { @@ -100,7 +92,7 @@ const Users = (): JSX.Element => { // Send to orgList page if user is not superadmin useEffect(() => { - if (userType != 'SUPERADMIN') { + if (userRole != 'SUPERADMIN') { window.location.assign('/orglist'); } }, []); @@ -120,16 +112,18 @@ const Users = (): JSX.Element => { resetAndRefetch(); return; } - refetchUsers({ + refetch({ firstName_contains: value, lastName_contains: '', // Later on we can add several search and filter options }); }; - const handleSearchByEnter = (e: any): void => { + const handleSearchByEnter = ( + e: React.KeyboardEvent, + ): void => { if (e.key === 'Enter') { - const { value } = e.target; + const { value } = e.currentTarget; handleSearch(value); } }; @@ -143,7 +137,7 @@ const Users = (): JSX.Element => { }; /* istanbul ignore next */ const resetAndRefetch = (): void => { - refetchUsers({ + refetch({ first: perPageResult, skip: 0, firstName_contains: '', @@ -156,8 +150,7 @@ const Users = (): JSX.Element => { setIsLoadingMore(true); fetchMore({ variables: { - skip: usersData?.users.length || 0, - userType: 'ADMIN', + skip: data?.users.length || 0, filter: searchByName, }, updateQuery: ( @@ -256,7 +249,7 @@ const Users = (): JSX.Element => {
{
{isLoading == false && - usersData && + data && displayedUsers.length === 0 && searchByName.length > 0 ? (
@@ -357,7 +350,7 @@ const Users = (): JSX.Element => { {t('noResultsFoundFor')} "{searchByName}"
- ) : isLoading == false && usersData && displayedUsers.length === 0 ? ( + ) : isLoading == false && data && displayedUsers.length === 0 ? (

{t('noUserFound')}

@@ -400,7 +393,7 @@ const Users = (): JSX.Element => { - {usersData && + {data && displayedUsers.map( (user: InterfaceQueryUserListItem, index: number) => { return (