Merge pull request #777 from Real-Dev-Squad/develop

Sync Dev to main

Author: iamitprakash

__tests__/groups/group.test.js

@@ -202,9 +202,13 @@ describe('Discord Groups Page', () => {
     const groupTitle = await groupCreationModal.$(
       `.input__field[name="title"]`,
     );
+    const groupDescription = await groupCreationModal.$(
+      `.input__field[name="description"]`,
+    );
     const submitBtn = await groupCreationModal.$('.submit__button');
 
     expect(groupTitle).toBeTruthy();
+    expect(groupDescription).toBeTruthy();
     expect(submitBtn).toBeTruthy();
   });
 

groups/createElements.js

@@ -109,7 +109,7 @@ const createGroupCreationModal = (onClose = () => {}, onSubmit = () => {}) => {
           </span>
         </div>
         <form class="form">
-            <div class="input">
+            <div class="input" id="title">
               <label for="title" class="input__label">@group</label>
               <div class="input__container">
                 <input
@@ -123,28 +123,40 @@ const createGroupCreationModal = (onClose = () => {}, onSubmit = () => {}) => {
                 </button>
               </div>
             </div>
+            <div class="input" id="description">
+              <label for="description" class="input__label">Description</label>
+              <div class="input__container">
+                <textarea
+                  class="input__field"
+                  name="description"
+                  placeholder="This group is for..." 
+                ></textarea>
+              </div>
+            </div>
 
             <div class="spacer"></div>
             <button type="submit" class="submit__button submit__button--disabled button">Create</button>
         </form>
     `;
-  const inputField = modalElement.querySelector('.input__field');
+  const titleField = modalElement.querySelector('#title .input__field');
+  const descriptionField = modalElement.querySelector(
+    '#description .input__field',
+  );
   const submitButton = modalElement.querySelector('.submit__button');
   modalElement.onclick = (e) => e.stopPropagation();
   modalElement.querySelector('#close-button').onclick = onClose;
   modalElement.querySelector('#clear-input').onclick = () => {
-    inputField.value = '';
+    titleField.value = '';
     toggle({ enabled: false });
   };
 
-  function getInput() {
-    return inputField.value.trim().toLowerCase();
+  function getTitle() {
+    return titleField.value.trim().toLowerCase();
   }
 
-  inputField.addEventListener('input', () => {
-    const inputValue = getInput();
-    const shouldDisableSubmit =
-      inputValue.length === 0 || inputValue.includes('group');
+  titleField.addEventListener('input', () => {
+    const title = getTitle();
+    const shouldDisableSubmit = title.length === 0 || title.includes('group');
 
     toggle({ enabled: !shouldDisableSubmit });
   });
@@ -161,13 +173,17 @@ const createGroupCreationModal = (onClose = () => {}, onSubmit = () => {}) => {
 
   form.onsubmit = (e) => {
     e.preventDefault();
-    const inputValue = getInput();
-    if (inputValue.length === 0 || inputValue.includes('group')) {
+    const title = getTitle();
+    const description = descriptionField.value.trim();
+    if (title.length === 0 || title.includes('group')) {
       throw new Error('Invalid group name');
     }
 
     toggle({ enabled: false });
-    onSubmit(inputField.value).then(() => {
+    onSubmit({
+      title,
+      description,
+    }).then(() => {
       toggle({ enabled: true });
     });
   };

groups/script.js

@@ -72,9 +72,10 @@ const handler = {
         if (value) {
           renderGroupCreationModal({
             onClose: () => (dataStore.isGroupCreationModalOpen = false),
-            onSubmit: (inputValue) => {
+            onSubmit: ({ title, description }) => {
               return createDiscordGroupRole({
-                rolename: inputValue,
+                rolename: title,
+                ...(description && { description }),
               }).then(() => {
                 showToaster('Group created successfully');
                 dataStore.isGroupCreationModalOpen = false;

groups/style.css

@@ -31,10 +31,16 @@
   --color-group-btn-hover: var(--color-secondary-darker);
 }
 
-input:focus {
+input:focus,
+button:focus,
+textarea:focus {
   outline: none;
 }
 
+textarea {
+  resize: none;
+}
+
 .button {
   border: none;
   border-radius: 8px;
@@ -130,7 +136,7 @@ body {
 */
 
 .group-creation-modal {
-  height: 380px;
+  height: 450px;
   width: clamp(300px, 100%, 350px);
   background-color: var(--color-white);
   border-radius: 8px;
@@ -170,11 +176,13 @@ body {
     flex-direction: column;
     flex-grow: 1;
     margin: 1rem 2rem 2rem 2rem;
+    gap: 1rem;
 
     .input {
       display: flex;
       align-items: center;
       gap: 8px;
+      flex-grow: 1;
 
       .input__label {
         font-size: 0.9rem;
@@ -188,36 +196,52 @@ body {
         background: rgb(245, 246, 246);
         border-radius: 8px;
         flex-grow: 1;
+      }
 
-        .input__field {
-          padding-left: 1rem;
-          width: calc(100% - 1rem);
-          box-sizing: border-box;
-          flex-grow: 1;
-          border: none;
-          background-color: transparent;
-        }
+      .input__field {
+        padding: 0.7rem;
+        box-sizing: border-box;
+        flex-grow: 1;
+        border: none;
+        background-color: transparent;
+      }
+
+      .input__field::placeholder {
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 17.5px;
+        text-align: left;
+        color: hsla(220, 9%, 46%, 0.5);
+      }
 
-        .input__field::placeholder {
-          font-size: 14px;
-          font-weight: 400;
-          line-height: 17.5px;
-          text-align: left;
+      #clear-input {
+        padding: 0.7rem 1rem;
+        border: none;
+        display: grid;
+        place-content: center;
+        background-color: transparent;
 
-          color: hsla(220, 9%, 46%, 0.5);
+        img {
+          height: 1.1rem;
         }
+      }
+    }
 
-        #clear-input {
-          padding: 0.7rem 1rem;
-          border: none;
-          display: grid;
-          place-content: center;
-          background-color: transparent;
+    #description {
+      flex-direction: column;
+      align-items: flex-start;
+      gap: 0px;
 
-          img {
-            height: 1.1rem;
-          }
-        }
+      .input__container {
+        width: 100%;
+      }
+
+      .input__label {
+        color: rgb(90, 96, 107);
+      }
+
+      .input__field {
+        height: 100px;
       }
     }
 

identity-service-logs/constants.js

@@ -0,0 +1,43 @@
+export const SUPER_USER = 'super_user';
+export const BORDER_COLOR = {
+  PROFILE_VERIFIED: 'blue',
+  PROFILE_BLOCKED: 'orangered',
+  PROFILE_DIFF_REJECTED: 'red',
+  PROFILE_DIFF_APPROVED: 'green',
+  PROFILE_DIFF_STORED: '#ADD8E6',
+};
+
+export const TYPE_NAME = {
+  PROFILE_VERIFIED: 'PROFILE SERVICE VERIFIED',
+  PROFILE_BLOCKED: 'PROFILE SERVICE BLOCKED',
+  PROFILE_DIFF_REJECTED: 'PROFILE DIFFERENCE REJECTED',
+  PROFILE_DIFF_APPROVED: 'PROFILE DIFFERENCE APPROVED',
+  PROFILE_DIFF_STORED: 'PROFILE DIFFERENCE STORED',
+};
+
+export const TYPE_DESCRIPTION = {
+  PROFILE_VERIFIED: ({ username }) =>
+    `${username}'s profile has been verified and is now officially authenticated.`,
+  PROFILE_BLOCKED: ({ username, reason }) =>
+    `${username}'s profile has been blocked. ${
+      reason ? `Reason provided: "${reason}."` : 'No reason provided!'
+    }`,
+  PROFILE_DIFF_REJECTED: ({ username, adminUserName, profileDiffId, reason }) =>
+    `${adminUserName} rejected a profile update request for ${username}. The request with Profile Diff ID ${profileDiffId} was declined due to: "${
+      reason || ''
+    }"`,
+  PROFILE_DIFF_APPROVED: ({ username, adminUserName, profileDiffId, reason }) =>
+    `${adminUserName} approved a profile update request for ${username}. The changes are now live. The request has a Profile Diff ID ${profileDiffId}. Message: "${
+      reason || ''
+    }"`,
+  PROFILE_DIFF_STORED: ({ username }) =>
+    `${username}'s profile changes have been saved for further review.`,
+};
+
+export const BACKGROUND_COLOR = {
+  PROFILE_VERIFIED: 'rgba(0,0,255,0.2)',
+  PROFILE_BLOCKED: 'rgba(255,69,0,0.2)',
+  PROFILE_DIFF_REJECTED: 'rgba(255,0,0,0.2)',
+  PROFILE_DIFF_APPROVED: 'rgba(0,128,0,0.2)',
+  PROFILE_DIFF_STORED: 'rgb(173,216,230,0.2)',
+};

identity-service-logs/index.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="/images/index.ico" type="image/x-icon" />
+    <title>Identity Service Logs | Real Dev Squad</title>
+    <link rel="stylesheet" href="/global.css" />
+    <link rel="stylesheet" href="/identity-service-logs/style.css" />
+    <script src="/helpers/loadENV.js"></script>
+    <script src="/constants.js"></script>
+    <script type="module" src="/identity-service-logs/script.js" defer></script>
+  </head>
+
+  <body>
+    <div id="cover-spin"></div>
+    <nav>
+      <h1>Identity Service Logs</h1>
+    </nav>
+
+    <div class="toast">
+      <div class="toast__message"></div>
+    </div>
+
+    <div class="stats">
+      <div>Verified Users: <span id="verified" class="stats-value"></span></div>
+      <div>Blocked Users: <span id="blocked" class="stats-value"></span></div>
+      <div>
+        Total Developers: <span id="developers" class="stats-value"></span>
+      </div>
+      <div>
+        Verified Developers:
+        <span id="verifiedDevelopers" class="stats-value"></span>
+      </div>
+      <div>
+        Blocked Developers:
+        <span id="blockedDevelopers" class="stats-value"></span>
+      </div>
+      <div>
+        Developers Left: <span id="developersLeft" class="stats-value"></span>
+      </div>
+    </div>
+
+    <p id="loader">Loading...</p>
+
+    <footer id="footer">
+      <p class="info-repo">
+        The contents of this website are deployed from this
+        <a
+          href="https://github.com/Real-Dev-Squad/website-dashboard"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          open sourced repo
+        </a>
+      </p>
+    </footer>
+  </body>
+</html>

identity-service-logs/script.js

@@ -0,0 +1,36 @@
+import { SUPER_USER } from './constants.js';
+
+import {
+  getIdentityLogs,
+  getIsSuperUser,
+  fillData,
+  getUserCount,
+} from './utils.js';
+
+const { isSuperUser } = await getIsSuperUser();
+
+if (isSuperUser) {
+  const {
+    verifiedUsersCount,
+    blockedUsersCount,
+    verifiedDeveloperCount,
+    blockedDeveloperCount,
+    developersLeftToVerifyCount,
+    developersCount,
+  } = await getUserCount();
+  document.getElementById('verified').innerText = verifiedUsersCount;
+  document.getElementById('blocked').innerText = blockedUsersCount;
+  document.getElementById('developers').innerText = developersCount;
+  document.getElementById('verifiedDevelopers').innerText =
+    verifiedDeveloperCount;
+  document.getElementById('blockedDevelopers').innerText =
+    blockedDeveloperCount;
+  document.getElementById('developersLeft').innerText =
+    developersLeftToVerifyCount;
+  const { identityLogs, next, prev } = await getIdentityLogs(
+    '/logs?dev=true&type=PROFILE_BLOCKED,PROFILE_VERIFIED,PROFILE_DIFF_REJECTED,PROFILE_DIFF_APPROVED,PROFILE_DIFF_STORED&size=10',
+  );
+  fillData(identityLogs, next, prev);
+} else {
+  document.getElementById('loader').innerHTML = 'You are not authorized !';
+}