diff --git a/mock-data/taskRequests/index.js b/mock-data/taskRequests/index.js index 3b5d184d..85c23c03 100644 --- a/mock-data/taskRequests/index.js +++ b/mock-data/taskRequests/index.js @@ -260,7 +260,6 @@ const githubIssue = { performed_via_github_app: null, state_reason: 'completed', }; - const individualTaskDetail = { message: 'task returned successfully', taskData: { @@ -306,7 +305,6 @@ const userInformationTaskCreation = { }, }, }; - const userInformation = { message: 'User returned successfully!', user: { @@ -339,7 +337,29 @@ const userInformation = { created_at: 1698684157040, }, }; - +const superUserData = { + id: 'V4rqL1aDecNGoa1IxiCu', + incompleteUserDetails: false, + discordId: '12345', + roles: { + archived: false, + super_user: true, + }, + linkedin_id: 'kotesh', + last_name: 'Mudila', + yoe: '5', + github_display_name: 'kotesh Mudila', + company_name: 'Juniper networks ', + github_id: 'kotesh-arya', + designation: 'Front end engineer', + twitter_id: 'Codesh_', + first_name: 'Kotesh', + username: 'kotesh', + picture: { + publicId: 'profile/w2XR9Gkid6Kg5xCJ5Elm/rzh3cwff7hh7srvg63mb', + url: 'https://res.cloudinary.com/realdevsquad/image/upload/v1692990078/profile/w2XR9Gkid6Kg5xCJ5Elm/rzh3cwff7hh7srvg63mb.png', + }, +}; const defaultMockResponseHeaders = { status: 200, contentType: 'application/json', @@ -351,6 +371,7 @@ const defaultMockResponseHeaders = { }; const urlMappings = { + 'https://staging-api.realdevsquad.com/users/self': superUserData, 'https://api.realdevsquad.com/taskRequests/dM5wwD9QsiTzi7eG7Oq5': individualTaskReqDetail, 'https://api.realdevsquad.com/taskRequests/dM5wwD9QsiTzi7eG7Oq6': diff --git a/task-requests/details/index.html b/task-requests/details/index.html index 5dc02fbb..49d2fc5b 100644 --- a/task-requests/details/index.html +++ b/task-requests/details/index.html @@ -86,7 +86,10 @@

Requestors

-
diff --git a/task-requests/details/script.js b/task-requests/details/script.js index 413ae81b..027d11b5 100644 --- a/task-requests/details/script.js +++ b/task-requests/details/script.js @@ -4,6 +4,7 @@ const API_BASE_URL = : window.API_BASE_URL; let taskRequest; +let self_user; const taskRequestSkeleton = document.querySelector('.taskRequest__skeleton'); const container = document.querySelector('.container'); @@ -23,6 +24,19 @@ const errorMessage = 'The requested operation could not be completed. Please try again later.'; let taskId; +async function getSelfUser() { + const res = await fetch(`${API_BASE_URL}/users/self`, { + method: 'GET', + credentials: 'include', + headers: { + 'Content-type': 'application/json', + }, + }); + + const self_user = await res.json(); + return self_user; +} + function renderTaskRequestDetails(taskRequest) { taskRequestContainer.append( createCustomElement({ @@ -200,17 +214,26 @@ async function updateTaskRequest(action, userId) { } } -function getActionButton(requestor) { +function getActionButton(requestor, taskRequest) { + const isSuperUser = self_user.roles['super_user']; + if (!isSuperUser) { + return createCustomElement({ + tagName: 'p', + textContent: + taskRequest.status[0].toUpperCase() + + taskRequest.status.slice(1).toLowerCase(), + class: ['requestors__container__list__status'], + }); + } + if (taskRequest?.status === taskRequestStatus.APPROVED) { - if (taskRequest.approvedTo === requestor?.user?.id) { - return createCustomElement({ - tagName: 'p', - textContent: 'Approved', - class: ['requestors__container__list__approved'], - }); - } else { - return ''; - } + return taskRequest.approvedTo === requestor?.user?.id + ? createCustomElement({ + tagName: 'p', + textContent: 'Approved', + class: ['requestors__container__list__status'], + }) + : ''; } return createCustomElement({ tagName: 'button', @@ -279,14 +302,17 @@ async function renderRequestors(taskRequest) { createCustomElement({ tagName: 'div', child: [ - taskRequest.status !== 'DENIED' ? getActionButton(requestor) : '', + taskRequest.status !== 'DENIED' + ? getActionButton(requestor, taskRequest) + : createCustomElement({ + tagName: 'p', + textContent: 'Denied', + class: ['requestors__container__list__status'], + }), ], }), ], }); - const avatarDiv = userDetailsDiv.querySelector( - '.requestors__container__list__userDetails__avatar', - ); requestorsContainer.append(userDetailsDiv); }); } @@ -409,14 +435,17 @@ const renderGithubIssue = async () => { ); }; const renderRejectButton = (taskRequest) => { + if (self_user.roles['super_user']) { + rejectButton.classList.remove('hidden'); + } if (taskRequest?.status !== 'PENDING') { - rejectButton.disabled = true; + rejectButton.classList.add('hidden'); } rejectButton.addEventListener('click', async () => { const res = await updateTaskRequest(TaskRequestAction.REJECT); if (res?.ok) { - rejectButton.disabled = true; + rejectButton.classList.add('hidden'); } }); }; @@ -425,6 +454,7 @@ const renderTaskRequest = async () => { taskContainer.classList.remove('hidden'); try { taskRequest = await fetchTaskRequest(); + self_user = await getSelfUser(); taskRequestSkeleton.classList.add('hidden'); renderRejectButton(taskRequest); renderTaskRequestDetails(taskRequest); diff --git a/task-requests/details/style.css b/task-requests/details/style.css index 6083751f..f5ddd3a2 100644 --- a/task-requests/details/style.css +++ b/task-requests/details/style.css @@ -248,7 +248,7 @@ body { background: #19805e; transition: 0.3s ease-in-out; } -.requestors__container__list__approved { +.requestors__container__list__status { background: transparent; border: none; color: #c3c3c3;