Feature/885 relevant users infrastructure portal (#887)

* sync proposal.spec between events and devhub * feat: add deploy and signer account for events portal * edit playwright.config exclude proposal folder for events com but still test comments * add relevant mentions to events committee portal * feat: add relevant users to infrastructure committee * revert earlier changes to tests
NEAR-DevHub · Jul 23, 2024 · fbac81e · fbac81e
1 parent 226968c
commit fbac81e
Show file tree

Hide file tree

Showing 14 changed files with 161 additions and 108 deletions.
diff --git a/instances/events-committee.near/bos.config.json b/instances/events-committee.near/bos.config.json
@@ -1,5 +1,9 @@
 {
   "account": "events-committee.near",
+  "accounts": {
+    "deploy": "events-committee.near",
+    "signer": "events-committee.near"
+  },
   "aliasPrefix": "REPL",
   "aliasesContainsPrefix": true,
   "aliases": ["./aliases.mainnet.json"]

diff --git a/instances/events-committee.near/widget/devhub/components/molecule/Compose.jsx b/instances/events-committee.near/widget/devhub/components/molecule/Compose.jsx
@@ -29,6 +29,7 @@ const Compose = ({
   showProposalIdAutoComplete,
   onChangeKeyup,
   handler,
+  sortedRelevantUsers,
 }) => {
   State.init({
     data: data,
@@ -97,6 +98,7 @@ const Compose = ({
                 showProposalIdAutoComplete: showProposalIdAutoComplete,
                 autoFocus: state.autoFocus,
                 onChangeKeyup: onChangeKeyup,
+                sortedRelevantUsers,
               }}
             />
           </>

diff --git a/instances/events-committee.near/widget/devhub/components/molecule/SimpleMDE.jsx b/instances/events-committee.near/widget/devhub/components/molecule/SimpleMDE.jsx
@@ -11,17 +11,16 @@ const onChangeKeyup = props.onChangeKeyup ?? (() => {}); // in case where we wan
 const height = props.height ?? "390";
 const className = props.className ?? "w-100";
 const embeddCSS = props.embeddCSS;
+const sortedRelevantUsers = props.sortedRelevantUsers || [];
 
 State.init({
   iframeHeight: height,
   message: props.data,
 });
 
-const profilesData = Social.get("*/profile/name", "final");
-const followingData = Social.get(
-  `${context.accountId}/graph/follow/**`,
-  "final"
-);
+const profilesData = Social.get("*/profile/name", "final") ?? {};
+const followingData =
+  Social.get(`${context.accountId}/graph/follow/**`, "final") ?? {};
 
 // SIMPLEMDE CONFIG //
 const fontFamily = props.fontFamily ?? "sans-serif";
@@ -139,7 +138,13 @@ function getSuggestedAccounts(term) {
   let results = [];
 
   term = (term || "").replace(/\W/g, "").toLowerCase();
-  const limit = 5;
+  let limit = 5;
+  if (term.length < 2) {
+   results = [${sortedRelevantUsers
+     .map((u) => "{accountId:'" + u + "', score: 60}")
+     .join(",")}];
+    limit = ${5 + sortedRelevantUsers.length};
+  }
 
   const profiles = Object.entries(profilesData);
 

diff --git a/instances/events-committee.near/widget/devhub/entity/proposal/CommentsAndLogs.jsx b/instances/events-committee.near/widget/devhub/entity/proposal/CommentsAndLogs.jsx
@@ -317,7 +317,7 @@ const parseProposalKeyAndValue = (key, modifiedValue, originalValue) => {
         <span>
           accepted
           <Widget
-            src={"${REPL_EVENTS}/widget/devhub.entity.proposal.AcceptedTerms"}
+            src={"${REPL_DEVHUB}/widget/devhub.entity.proposal.AcceptedTerms"}
             props={{ proposalId: proposalId }}
           />
         </span>

diff --git a/instances/events-committee.near/widget/devhub/entity/proposal/ComposeComment.jsx b/instances/events-committee.near/widget/devhub/entity/proposal/ComposeComment.jsx
@@ -17,7 +17,7 @@ const ComposeEmbeddCSS = `
     max-height: 300px !important;
   }
 `;
-const notifyAccountId = props.notifyAccountId;
+const notifyAccountId = props.notifyAccountId ?? [];
 const accountId = context.accountId;
 const item = props.item;
 const [allowGetDraft, setAllowGetDraft] = useState(true);

diff --git a/instances/events-committee.near/widget/devhub/entity/proposal/Proposal.jsx b/instances/events-committee.near/widget/devhub/entity/proposal/Proposal.jsx
@@ -294,6 +294,12 @@ const item = {
   path: `${REPL_EVENTS_CONTRACT}/post/main`,
   blockHeight,
 };
+const comments = Social.index("comment", item, { subscribe: true }) ?? [];
+
+const commentAuthors = [
+  ...new Set(comments.map((comment) => comment.accountId)),
+];
+
 const proposalURL = getLinkUsingCurrentGateway(
   `${REPL_EVENTS}/widget/app?page=proposal&id=${proposal.id}&timestamp=${snapshot.timestamp}`
 );
@@ -451,6 +457,7 @@ const CheckBox = ({ value, isChecked, label, disabled, onClick }) => {
   return (
     <div className="d-flex gap-2 align-items-center">
       <input
+        data-testid={label}
         class="form-check-input"
         type="checkbox"
         value={value}
@@ -916,6 +923,12 @@ return (
                     item: item,
                     notifyAccountId: authorId,
                     id: proposal.id,
+                    sortedRelevantUsers: [
+                      authorId,
+                      snapshot.supervisor,
+                      snapshot.requested_sponsor,
+                      ...commentAuthors,
+                    ].filter((user) => user !== accountId),
                   }}
                 />
               </div>

diff --git a/instances/infrastructure-committee.near/widget/components/molecule/Compose.jsx b/instances/infrastructure-committee.near/widget/components/molecule/Compose.jsx
@@ -29,6 +29,7 @@ const Compose = ({
   showProposalIdAutoComplete,
   onChangeKeyup,
   handler,
+  sortedRelevantUsers,
 }) => {
   State.init({
     data: data,
@@ -97,6 +98,7 @@ const Compose = ({
                 showProposalIdAutoComplete: showProposalIdAutoComplete,
                 autoFocus: state.autoFocus,
                 onChangeKeyup: onChangeKeyup,
+                sortedRelevantUsers,
               }}
             />
           </>

diff --git a/instances/infrastructure-committee.near/widget/components/molecule/ComposeComment.jsx b/instances/infrastructure-committee.near/widget/components/molecule/ComposeComment.jsx
@@ -220,10 +220,11 @@ const Compose = useMemo(() => {
         embeddCSS: ComposeEmbeddCSS,
         handler: handler,
         showProposalIdAutoComplete: true,
+        sortedRelevantUsers: props.sortedRelevantUsers,
       }}
     />
   );
-}, [draftComment, handler]);
+}, [draftComment, handler, props.sortedRelevantUsers]);
 
 return (
   <div className="d-flex gap-2">

diff --git a/instances/infrastructure-committee.near/widget/components/molecule/SimpleMDE.jsx b/instances/infrastructure-committee.near/widget/components/molecule/SimpleMDE.jsx
@@ -11,6 +11,7 @@ const onChangeKeyup = props.onChangeKeyup ?? (() => {}); // in case where we wan
 const height = props.height ?? "390";
 const className = props.className ?? "w-100";
 const embeddCSS = props.embeddCSS;
+const sortedRelevantUsers = props.sortedRelevantUsers || [];
 
 State.init({
   iframeHeight: height,
@@ -159,7 +160,13 @@ function getSuggestedAccounts(term) {
   let results = [];
 
   term = (term || "").replace(/\W/g, "").toLowerCase();
-  const limit = 5;
+   let limit = 5;
+  if (term.length < 2) {
+   results = [${sortedRelevantUsers
+     .map((u) => "{accountId:'" + u + "', score: 60}")
+     .join(",")}];
+    limit = ${5 + sortedRelevantUsers.length};
+  }
 
   const profiles = Object.entries(profilesData);
 

diff --git a/instances/infrastructure-committee.near/widget/components/proposals/Proposal.jsx b/instances/infrastructure-committee.near/widget/components/proposals/Proposal.jsx
@@ -357,6 +357,12 @@ const item = {
   path: `${REPL_INFRASTRUCTURE_COMMITTEE_CONTRACT}/post/main`,
   blockHeight,
 };
+const comments = Social.index("comment", item, { subscribe: true }) ?? [];
+
+const commentAuthors = [
+  ...new Set(comments.map((comment) => comment.accountId)),
+];
+
 const proposalURL = getLinkUsingCurrentGateway(
   `${REPL_INFRASTRUCTURE_COMMITTEE}/widget/app?page=proposal&id=${proposal.id}&timestamp=${snapshot.timestamp}`
 );
@@ -895,6 +901,11 @@ return (
                     item: item,
                     notifyAccountIds: [authorId],
                     proposalId: proposal.id,
+                    sortedRelevantUsers: [
+                      authorId,
+                      snapshot.requested_sponsor,
+                      ...commentAuthors,
+                    ].filter((user) => user !== accountId),
                   }}
                 />
               </div>

diff --git a/playwright-tests/tests/events/proposals.spec.js b/playwright-tests/tests/events/proposals.spec.js
@@ -1,9 +1,6 @@
 import { test as base, expect } from "@playwright/test";
 import { modifySocialNearGetRPCResponsesInsteadOfGettingWidgetsFromBOSLoader } from "../../util/bos-loader.js";
-import {
-  pauseIfVideoRecording,
-  waitForSelectorToBeVisible,
-} from "../../testUtils.js";
+import { pauseIfVideoRecording } from "../../testUtils.js";
 import {
   setCommitWritePermissionDontAskAgainCacheValues,
   setDontAskAgainCacheValues,
@@ -14,7 +11,6 @@ import {
   encodeResultJSON,
 } from "../../util/transaction.js";
 import { mockRpcRequest } from "../../util/rpcmock.js";
-import { mockSocialIndexResponses } from "../../util/socialapi.js";
 
 const test = base.extend({
   // Define an option and provide a default value.
@@ -27,7 +23,27 @@ test.afterEach(
   async ({ page }) => await page.unrouteAll({ behavior: "ignoreErrors" })
 );
 
-test.describe("Wallet is connected, but not KYC verified", () => {
+let acceptedTermsVersion = 122927956;
+async function getCurrentBlockHeight(page) {
+  // set current block height for accepted terms and conditions
+  await page.route(`http://localhost:20000/`, async (route) => {
+    const request = route.request();
+    const requestPostData = request.postDataJSON();
+    if (
+      requestPostData?.method === "block" &&
+      requestPostData?.params?.finality === "optimistic"
+    ) {
+      const response = await route.fetch();
+      const json = await response.json();
+      json.result.header.height = acceptedTermsVersion;
+      await route.fulfill({ response, json });
+    } else {
+      await route.continue();
+    }
+  });
+}
+
+test.describe.skip("Wallet is connected, but not KYC verified", () => {
   test.use({
     storageState:
       "playwright-tests/storage-states/wallet-connected-not-kyc-verified-account.json",
@@ -170,85 +186,6 @@ test.describe("Don't ask again enabled", () => {
     await page.waitForTimeout(1000);
     await pauseIfVideoRecording(page);
   });
-  test("should add comment on a proposal", async ({ page, account }) => {
-    await page.goto(`/${account}/widget/app?page=proposal&id=5`);
-    const widgetSrc = `${account}/widget/devhub.entity.proposal.ComposeComment`;
-
-    const delay_milliseconds_between_keypress_when_typing = 0;
-    const commentArea = await page
-      .frameLocator("iframe")
-      .locator(".CodeMirror textarea");
-    await commentArea.focus();
-    const text = "Comment testing";
-    await commentArea.pressSequentially(text, {
-      delay: delay_milliseconds_between_keypress_when_typing,
-    });
-    await commentArea.blur();
-    await pauseIfVideoRecording(page);
-
-    const accountId = "petersalomonsen.near";
-    await setCommitWritePermissionDontAskAgainCacheValues({
-      page,
-      widgetSrc,
-      accountId: accountId,
-    });
-
-    await mockTransactionSubmitRPCResponses(
-      page,
-      async ({ route, request, transaction_completed, last_receiver_id }) => {
-        const postData = request.postDataJSON();
-        const args_base64 = postData.params?.args_base64;
-        if (transaction_completed && args_base64) {
-          const args = atob(args_base64);
-          if (
-            postData.params.account_id === "social.near" &&
-            postData.params.method_name === "get" &&
-            args === `{"keys":["${accountId}/post/**"]}`
-          ) {
-            const response = await route.fetch();
-            const json = await response.json();
-            const resultObj = decodeResultJSON(json.result.result);
-            resultObj[accountId].post.main = JSON.stringify({
-              text: text,
-            });
-            json.result.result = encodeResultJSON(resultObj);
-            await route.fulfill({ response, json });
-            return;
-          } else {
-            await route.continue();
-          }
-        } else {
-          await route.continue();
-        }
-      }
-    );
-    const commentButton = await page.getByRole("button", { name: "Comment" });
-    await expect(commentButton).toBeAttached();
-    await commentButton.scrollIntoViewIfNeeded();
-    await commentButton.click();
-    await expect(
-      await page.frameLocator("iframe").locator(".CodeMirror")
-    ).toContainText(text);
-
-    const loadingIndicator = await page.locator(".comment-btn-spinner");
-    await expect(loadingIndicator).toBeAttached();
-    await loadingIndicator.waitFor({ state: "detached", timeout: 30000 });
-    await expect(loadingIndicator).not.toBeVisible();
-    const transaction_successful_toast = await page.getByText(
-      "Comment Submitted Successfully",
-      { exact: true }
-    );
-    await expect(transaction_successful_toast).toBeVisible();
-
-    await expect(transaction_successful_toast).not.toBeAttached();
-    await expect(
-      await page.frameLocator("iframe").locator(".CodeMirror")
-    ).not.toContainText(text);
-    await expect(
-      await page.frameLocator("iframe").locator(".CodeMirror")
-    ).toContainText("Add your comment here...");
-    await pauseIfVideoRecording(page);
-  });
 });
 
 test.describe.skip('Moderator with "Don\'t ask again" enabled', () => {
@@ -401,6 +338,7 @@ test.describe("Wallet is connected", () => {
     account,
   }) => {
     test.setTimeout(120000);
+    await getCurrentBlockHeight(page);
     await page.goto(`/${account}/widget/app?page=create-proposal`);
 
     const delay_milliseconds_between_keypress_when_typing = 0;
@@ -510,21 +448,21 @@ test.describe("Wallet is connected", () => {
     await pauseIfVideoRecording(page);
   });
 
-  test.skip("should show relevant users in mention autocomplete", async ({
+  test("should show relevant users in mention autocomplete", async ({
     page,
     account,
   }) => {
-    await page.goto(`/${account}/widget/app?page=proposal&id=112`);
+    await page.goto(`/${account}/widget/app?page=proposal&id=2`);
 
     await page.waitForSelector(`iframe`, {
       state: "visible",
     });
 
-    const comment = page.getByRole("link", { name: "geforcy.near" });
+    const comment = page.getByRole("link", { name: "toronto-sc.near" }).first();
     await comment.waitFor();
     await comment.scrollIntoViewIfNeeded();
 
-    const heading = page.getByRole("heading", { name: "Relevant Mentions" });
+    const heading = page.getByText("Add a comment");
     await heading.waitFor();
     await heading.scrollIntoViewIfNeeded();
 
@@ -549,10 +487,10 @@ test.describe("Wallet is connected", () => {
     );
     const liLocators = await liFrameLocators.owner().all();
     const expected = [
-      "thomasguntenaar.near", // author,
-      "theori.near", // supervisor,
-      "neardevdao.near", //  requested_sponsor,
-      "geforcy.near", // comment author,
+      "toronto-sc.near",
+      "yarotska.near",
+      "events-committee.near",
+      "nneoma.near",
     ];
     let mentionSuggestions = [];
     for (let i = 0; i < liLocators.length; i++) {
@@ -598,6 +536,7 @@ test.describe("Wallet is connected", () => {
     account,
   }) => {
     test.setTimeout(120000);
+    await getCurrentBlockHeight(page);
     await page.goto(`/${account}/widget/app?page=create-proposal`);
     await page.route(
       "https://near-queryapi.api.pagoda.co/v1/graphql",
@@ -707,7 +646,6 @@ test.describe("Wallet is connected", () => {
         delay: delay_milliseconds_between_keypress_when_typing,
       }
     );
-
     await pauseIfVideoRecording(page);
 
     await page