Skip to content

Commit e7d695d

Browse files
iamitprakashiamitprakash
authored
Merge pull request #872 from Real-Dev-Squad/develop
Dev to main merge
2 parents 313c6ea + a246e51 commit e7d695d

File tree

8 files changed

+180
-128
lines changed

8 files changed

+180
-128
lines changed

‎__tests__/users/user-management-home-screen.test.js‎

Lines changed: 27 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -108,40 +108,46 @@ describe('Tests the User Management User Listing Screen', () => {
108108
expect(liList.length).toBeGreaterThan(0);
109109
});
110110

111-
it('checks the search functionality to display queried user', async () => {
111+
it('Checks the search functionality to display queried user', async () => {
112112
await page.type('input[id="user-search"]', 'randhir');
113113
await page.waitForNetworkIdle();
114114
const userList = await page.$('#user-list');
115115
const userCard = await userList.$$('li');
116116
expect(userCard.length).toBeGreaterThan(0);
117117
});
118118

119-
it('checks the next and previous button functionality', async () => {
120-
await page.goto('http://localhost:8000/users');
121-
await page.waitForNetworkIdle();
119+
it('Checks for empty string input once the user removes their input', async () => {
120+
// Find the user list and the user cards
121+
const userList = await page.$('#head_list');
122+
let userCard = await userList.$$('li');
122123

123-
// Get the "next" button and check if it is enabled
124-
const nextBtn = await page.$('#nextButton');
125-
const isNextButtonDisabled = await page.evaluate(
126-
(button) => button.disabled,
127-
nextBtn,
128-
);
129-
expect(isNextButtonDisabled).toBe(false);
124+
await page.click('input[id="user-search"]');
125+
await page.keyboard.down('Control'); // On Mac, use 'Meta' instead of 'Control'
126+
await page.keyboard.press('A');
127+
await page.keyboard.up('Control');
128+
await page.keyboard.press('Backspace');
130129

131-
// Click the "next" button and wait for the page to load
132-
await nextBtn.click();
133130
await page.waitForNetworkIdle();
134131

135-
// Check that the "next" button is still present and the "previous" button is not disabled
136-
const updatedNextButton = await page.$('#nextButton');
137-
expect(updatedNextButton).toBeTruthy();
132+
userCard = await userList.$$('li');
133+
134+
expect(userCard.length).toBeGreaterThan(0);
135+
});
138136

139-
const prevBtn = await page.$('#prevButton');
140-
const isPrevButtonDisabled = await page.evaluate(
141-
(button) => button.disabled,
142-
prevBtn,
137+
it('checks infinite scroll functionality to load more users', async () => {
138+
await page.goto('http://localhost:8000/users');
139+
await page.waitForNetworkIdle();
140+
const userList = await page.$('#user-list');
141+
let initialUserCount = await userList.$$eval('li', (items) => items.length);
142+
expect(initialUserCount).toBeGreaterThan(0);
143+
await page.evaluate(() => {
144+
window.scrollTo(0, document.body.scrollHeight);
145+
});
146+
const updatedUserCount = await userList.$$eval(
147+
'li',
148+
(items) => items.length,
143149
);
144-
expect(isPrevButtonDisabled).toBe(false);
150+
expect(updatedUserCount).toBeGreaterThanOrEqual(initialUserCount);
145151
});
146152

147153
it('Clicking on filter button should display filter modal', async () => {

‎profile-diff-details/assets/default-profile.svg‎

Lines changed: 4 additions & 0 deletions
Loading

‎profile-diff-details/script.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,7 @@ async function setUser(profileDiff) {
122122
type: 'img',
123123
attributes: {
124124
class: 'user_image',
125-
src: user.picture.url,
125+
src: user.picture?.url || 'assets/default-profile.svg',
126126
height: '71px',
127127
width: '71px',
128128
},
@@ -135,7 +135,7 @@ async function setUser(profileDiff) {
135135
class: 'user_name',
136136
},
137137
});
138-
username.innerHTML = `${user.first_name} ${user.last_name}`;
138+
username.innerHTML = `${user.first_name || ''} ${user.last_name || ''}`;
139139
CONTAINER.appendChild(username);
140140

141141
const expandControlContainer = createElement({

‎profile-diffs/script.js‎

Lines changed: 34 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -133,9 +133,18 @@ async function populateProfileDiffs(query = {}, newLink) {
133133
});
134134
}
135135
profileDiffsElement.appendChild(profileDiffsListElement);
136-
for (let data of allProfileDiffs) {
137-
await createProfileDiffCard(data, profileDiffsListElement);
138-
}
136+
137+
// Create all profile diff cards with shimmer effect
138+
allProfileDiffs.forEach((data) => {
139+
const card = createProfileDiffCard(data);
140+
profileDiffsListElement.appendChild(card);
141+
});
142+
143+
// Fetch user details and update cards
144+
allProfileDiffs.forEach(async (data) => {
145+
const user = await getUser(data.userId);
146+
updateProfileDiffCard(data.id, user);
147+
});
139148
} catch (error) {
140149
showToast({ type: 'error', message: 'Something went wrong!' });
141150
} finally {
@@ -177,7 +186,7 @@ function debounce(func, delay) {
177186
};
178187
}
179188

180-
async function createProfileDiffCard(data, profileDiffCardList) {
189+
function createProfileDiffCard(data) {
181190
const time = data.timestamp;
182191
const fireBaseTime = new Date(
183192
time._seconds * 1000 + time._nanoseconds / 1000000,
@@ -195,15 +204,14 @@ async function createProfileDiffCard(data, profileDiffCardList) {
195204

196205
const profileCard = createElement({
197206
type: 'div',
198-
attributes: { class: 'profile-card' },
207+
attributes: { class: 'profile-card', 'data-id': data.id },
199208
});
200209
if (filterStates.status === Status.PENDING) {
201210
profileCard.style.cursor = 'pointer';
202211
profileCard.addEventListener('click', () => {
203212
window.location.href = `/profile-diff-details/?id=${data.id}`;
204213
});
205214
}
206-
profileDiffCardList.appendChild(profileCard);
207215

208216
const profileCardLeft = createElement({
209217
type: 'div',
@@ -251,19 +259,29 @@ async function createProfileDiffCard(data, profileDiffCardList) {
251259
profileCard.appendChild(profileCardLeft);
252260
profileCard.appendChild(profileCardRight);
253261

254-
const user = await getUser(data.userId);
255-
profileCardLeft.classList.remove('shimmer');
262+
return profileCard;
263+
}
264+
265+
function updateProfileDiffCard(cardId, user) {
266+
const card = document.querySelector(`.profile-card[data-id="${cardId}"]`);
267+
if (!card) return;
268+
269+
const profileLeft = card.querySelector('.profile');
270+
const profilePic = card.querySelector('.profile-pic');
271+
const profileName = card.querySelector('.profile-name-shimmer');
272+
const profileUsername = card.querySelector('.profile-username-shimmer');
256273

257-
profileCardPhoto.style.backgroundImage = `url(${user.picture?.url})`;
258-
profileCardPhoto.style.backgroundSize = 'cover';
274+
profileLeft.classList.remove('shimmer');
275+
profilePic.style.backgroundImage = `url(${user.picture?.url})`;
276+
profilePic.style.backgroundSize = 'cover';
259277

260-
profileCardName.classList.remove('profile-name-shimmer');
261-
profileCardName.classList.add('profile-name');
262-
profileCardName.textContent = `${user.first_name} ${user.last_name}`;
278+
profileName.classList.remove('profile-name-shimmer');
279+
profileName.classList.add('profile-name');
280+
profileName.textContent = `${user.first_name} ${user.last_name}`;
263281

264-
profileCardUsername.classList.remove('profile-username-shimmer');
265-
profileCardUsername.classList.add('profile-username');
266-
profileCardUsername.textContent = `${user.username}`;
282+
profileUsername.classList.remove('profile-username-shimmer');
283+
profileUsername.classList.add('profile-username');
284+
profileUsername.textContent = `${user.username}`;
267285
}
268286

269287
const addIntersectionObserver = () => {

‎users/constants.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
const RDS_API_USERS = `${API_BASE_URL}/users`;
22
const RDS_API_SKILLS = `${API_BASE_URL}/tags`;
33
const USER_LIST_ELEMENT = 'user-list';
4+
const HEAD_LIST_ELEMENT = 'head_list';
45
const LOADER_ELEMENT = 'loader';
6+
const USER_LOADER_ELEMENT = 'loader_tag';
57
const TILE_VIEW_BTN = 'tile-view-btn';
68
const TABLE_VIEW_BTN = 'table-view-btn';
79
const USER_SEARCH_ELEMENT = 'user-search';

‎users/index.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,9 @@ <h2>Skills</h2>
6969
</div>
7070
<div id="user-list">
7171
<div id="loader"></div>
72+
<ul id="head_list"></ul>
7273
</div>
74+
<div id="loader_tag" style="display: none"></div>
7375
<div id="pagination" class="remove-element">
7476
<button class="pagination-btn" id="prevButton">&laquo; Previous</button>
7577
<button class="pagination-btn" id="nextButton">Next &raquo;</button>

0 commit comments

Comments
 (0)