Skip to content

Commit

Permalink
Merge pull request #416 from Real-Dev-Squad/develop
Browse files Browse the repository at this point in the history
Sync dev to main
  • Loading branch information
prakashchoudhary07 authored Jul 23, 2023
2 parents fa78178 + 2cbc2fa commit 74a3f3b
Show file tree
Hide file tree
Showing 16 changed files with 433 additions and 60 deletions.
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
const puppeteer = require('puppeteer');
const { allUsersData } = require('../../mock-data/users');
const { API_BASE_URL } = require('../../constants');
const { discordGroups } = require('../../mock-data/discord-groups');
const { discordGroups } = require('../../mock-data/groups');

const BASE_URL = 'https://api.realdevsquad.com';

Expand Down Expand Up @@ -99,7 +99,7 @@ describe('Discord Groups Page', () => {
interceptedRequest.continue();
}
});
await page.goto('http://localhost:8000/discord-groups');
await page.goto('http://localhost:8000/groups');
await page.waitForNetworkIdle();
});

Expand Down Expand Up @@ -133,7 +133,7 @@ describe('Discord Groups Page', () => {
'.group-role',
(list) => list.length,
);
expect(groupListLength).toBe(1);
expect(groupListLength).toBe(3);
});

test('Should not display an error message if the role name contains "group"', async () => {
Expand Down Expand Up @@ -165,4 +165,28 @@ describe('Discord Groups Page', () => {
await createGroupBtn.click();
await expect(alertMessage).toContain("Roles cannot contain 'group'.");
});

test('Filter groups based on search input', async () => {
const searchInput = await page.$('#search-groups');
await searchInput.type('DSA');

const filteredGroupNames = await page.$$eval('.group-role', (elements) => {
return elements
.map((element) => element.querySelector('.group-name').textContent)
.filter((name) => name.includes('DSA'));
});

expect(filteredGroupNames).toEqual(
expect.arrayContaining(['group-DSA', 'group-DSA-Coding-Group']),
);
});

test('should update the URL when a group role is clicked', async () => {
await page.$$eval('.group-role', (elements) => {
elements[1].click();
});
const url = await page.url();
const searchParams = decodeURIComponent(url.split('?')[1]);
expect(searchParams).toMatch('group-DSA');
});
});
118 changes: 118 additions & 0 deletions __tests__/standup/standup.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
const puppeteer = require('puppeteer');
const API_BASE_URL = 'https://staging-api.realdevsquad.com';
const { user } = require('../../mock-data/users');
const { standup } = require('../../mock-data/standup');

describe('Standup Page', () => {
let browser;
let page;
jest.setTimeout(60000);

beforeAll(async () => {
browser = await puppeteer.launch({
headless: true,
ignoreHTTPSErrors: true,
args: ['--incognito', '--disable-web-security'],
devtools: false,
});
page = await browser.newPage();

await page.setRequestInterception(true);

page.on('request', (interceptedRequest) => {
const url = interceptedRequest.url();

if (url === `${API_BASE_URL}/users/sunny`) {
interceptedRequest.respond({
status: 200,
contentType: 'application/json',
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
body: JSON.stringify(user),
});
} else if (
url === `${API_BASE_URL}/progresses?userId=YleviOe1SsOML8eitV9W`
) {
interceptedRequest.respond({
status: 200,
contentType: 'application/json',
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
body: JSON.stringify(standup),
});
} else {
interceptedRequest.continue();
}
});
await page.goto('http://localhost:8000/standup');
await page.waitForNetworkIdle();
});

afterAll(async () => {
await browser.close();
});

it('should display the table when the search button is clicked', async () => {
const userInput = await page.$('#user-search-input');
const searchButton = await page.$('#search-button');

await userInput.type('sunny');
await searchButton.click();
await page.waitForSelector('#table-container');
const table = await page.$('.user-standup-table');
expect(table).toBeTruthy();
});

it('should display the loader when the search button is clicked', async () => {
const userInput = await page.$('#user-search-input');
const searchButton = await page.$('#search-button');

await userInput.type('sunny');
await searchButton.click();
await page.waitForSelector('#table-container');
const loader = await page.$('.loader');
expect(loader).toBeTruthy();
});

it('should update the URL with the query parameter when the user writes a name', async () => {
const userInput = await page.$('#user-search-input');
const searchButton = await page.$('#search-button');
await userInput.click({ clickCount: 3 });
await userInput.press('Backspace');
await userInput.type('sunny');
await searchButton.click();
await page.waitForTimeout(1000);
const updatedUrl = page.url();
expect(updatedUrl).toContain('q=user:sunny');
});

it('should update the URL with the query parameter when the user writes multiple names', async () => {
const userInput = await page.$('#user-search-input');
const searchButton = await page.$('#search-button');
await userInput.click({ clickCount: 3 });
await userInput.press('Backspace');
await userInput.type('sunny,pratiyush');
await searchButton.click();
await page.waitForTimeout(1000);
const updatedUrl = page.url();
expect(updatedUrl).toContain('q=user:sunny+user:pratiyush');
});

it('should update the URL with the query parameter when the user writes duplicate names', async () => {
const userInput = await page.$('#user-search-input');
const searchButton = await page.$('#search-button');
await userInput.click({ clickCount: 3 });
await userInput.press('Backspace');
await userInput.type('sunny,sunny,pratiyush');
await searchButton.click();
await page.waitForTimeout(1000);
const updatedUrl = page.url();
expect(updatedUrl).toContain('q=user:sunny+user:pratiyush');
});
});
File renamed without changes.
12 changes: 10 additions & 2 deletions discord-groups/index.html → groups/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@
<link rel="icon" href="/images/index.ico" type="image/x-icon" />
<title>Discord Groups | Real Dev Squad</title>
<link rel="stylesheet" href="/global.css" />
<link rel="stylesheet" href="/discord-groups/style.css" />
<link rel="stylesheet" href="/groups/style.css" />
<script src="/constants.js"></script>
<script type="module" src="/discord-groups/script.js" defer></script>
<script type="module" src="/groups/script.js" defer></script>
</head>
<body>
<h3 class="not-verified-tag hidden">
Expand All @@ -23,6 +23,14 @@ <h3 class="not-verified-tag hidden">
</nav>
<div class="manage-groups">
<aside class="groups">
<div class="groups-search">
<input
type="text"
class="groups-search-input"
id="search-groups"
placeholder="Search for groups"
/>
</div>
<ul class="groups-list"></ul>
</aside>
<main>
Expand Down
38 changes: 38 additions & 0 deletions discord-groups/script.js → groups/script.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,9 @@ groupsData?.forEach((item) => {
group.appendChild(createdBy);
group.setAttribute('id', item.roleid);
group.classList.add('group-role');
if (window.location.search.slice(1) === item.rolename) {
group.classList.add('active-group');
}
groupRoles.appendChild(group);
});

Expand Down Expand Up @@ -87,13 +90,19 @@ groupTabs.addEventListener('click', (e) => {
/**
* FOR SELECTING A GROUP
*/
const pathname = window.location.pathname;
const groupRolesList = document.querySelectorAll('.group-role');
groupRoles?.addEventListener('click', function (event) {
groupRolesList.forEach((groupItem) => {
window.history.pushState({}, '', pathname);
groupItem.classList?.remove('active-group');
});
const groupListItem = event.target?.closest('li');
if (groupListItem) {
const newURL = `${window.location.pathname}?${
groupListItem.querySelector('p').textContent
}`;
window.history.pushState({}, '', newURL);
groupListItem.classList.add('active-group');
memberAddRoleBody.roleid = groupListItem.id;
if (IsUserVerified) {
Expand All @@ -102,6 +111,35 @@ groupRoles?.addEventListener('click', function (event) {
}
});

// const paragraphElement = null, paragraphContent = '';
const searchInput = document.getElementById('search-groups');

function debounce(func, delay) {
let timeoutId;
return function (...args) {
timeoutId = setTimeout(() => {
clearTimeout(timeoutId);
func.apply(this, args);
}, delay);
};
}

searchInput.addEventListener('keyup', () => {
loader.classList.remove('hidden');
debounce(() => {
const searchValue = searchInput.value.toUpperCase();
const groupRoles = document.querySelectorAll('.group-role');
groupRoles.forEach((groupRole) => {
const paragraphElement = groupRole.getElementsByTagName('p')[0];
const paragraphContent = paragraphElement.textContent;
const displayValue =
paragraphContent.toUpperCase().indexOf(searchValue) > -1 ? '' : 'none';
groupRole.style.display = displayValue;
loader.classList.add('hidden');
});
}, 1000)();
});

/**
* TO ASSIGN YOURSELF A ROLE
*/
Expand Down
63 changes: 43 additions & 20 deletions discord-groups/style.css → groups/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,15 @@
padding: 0;
}
:root {
--color-groups-tab-background: #1d1283;
--color-active-tabs-color: #87d870;
--color-active-groups-background: #337ad7b0;
--color-buttons-background: #041187;
--color-loader-border: #f3f3f3;
--color-loader-border-top: #3498db;
--color-groups-tab-background: rgb(29, 18, 131);
--color-active-tabs-color: rgb(135, 216, 112);
--color-active-groups-background: rgba(51, 122, 215, 0.69);
--color-buttons-background: rgb(4, 17, 135);
--color-loader-border: rgb(243, 243, 243);
--color-loader-border-top: rgb(52, 152, 219);
--color-list-border: rgba(0, 0, 0, 0.2);
--color-white: rgb(255, 255, 255);
--color-not-verified: rgb(255, 0, 0);
}
.container {
font-family: 'Roboto', sans-serif;
Expand All @@ -34,7 +37,7 @@
.tab {
font-size: larger;
font-weight: bolder;
color: #fff;
color: var(--color-white);
cursor: pointer;
margin: 1.6rem;
padding-bottom: 0.4rem;
Expand Down Expand Up @@ -63,27 +66,48 @@
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 10px;
}

.groups {
overflow: scroll;
display: flex;
flex-direction: column;
align-items: center;
}
.groups::-webkit-scrollbar {
width: 6px;
height: 6px;
.groups-search {
margin: 10px;
height: 4rem;
width: 100%;
position: sticky;
top: 0;
background: var(--color-white);
display: flex;
align-items: center;
justify-content: center;
}
.groups::-webkit-scrollbar-thumb {
background: var(--color-buttons-background);
border-radius: 1.2rem;
.groups-search-input {
height: 2rem;
width: 90%;
padding-left: 2px;
}
.groups-list {
padding: 0.8rem;
list-style: none;
height: 80vh;
height: 66vh;
overflow-y: scroll;
}
.groups-list::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.groups-list::-webkit-scrollbar-thumb {
background: var(--color-buttons-background);
border-radius: 1.2rem;
}
.groups-list li {
padding: 0.8rem;
border: 1px solid rgba(0, 0, 0, 0.2);
border: 1px solid var(--color-list-border);
margin-bottom: 0.6rem;
border-radius: 0.6rem;
}
Expand Down Expand Up @@ -130,7 +154,7 @@
.btn-add-role:not([disabled]),
.btn-create-group {
background: var(--color-buttons-background);
color: #fff;
color: var(--color-white);
border: none;
}

Expand Down Expand Up @@ -169,18 +193,17 @@ NOT VERIFIED TEXT ABOVE
*/

.not-verified-tag {
color: red;
color: var(--color-not-verified);
text-align: center;
}

@media (max-width: 650px) {
.manage-groups {
flex-direction: column-reverse;
padding: 1.2rem;
gap: 1.2rem;
}
.groups-list {
height: 60vh;
height: 54vh;
}
.group-name {
font-size: large;
Expand Down
File renamed without changes.
4 changes: 1 addition & 3 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -45,9 +45,7 @@
<a href="/online-members/online-members.html" class="action-button">
Online Members
</a>
<a class="action-button" href="/discord-groups/index.html">
Discord Groups
</a>
<a class="action-button" href="/groups/index.html"> Discord Groups </a>
<a class="action-button" href="/standup/index.html"> Standup Updates</a>
</section>

Expand Down
Loading

0 comments on commit 74a3f3b

Please sign in to comment.