Feature/1000 linked proposal dropdown (#1007)

* initial commit 1002 * fmt * test for comparing local feed with production * add events committee feed components + by-sort component * fmt * compare links in prod and local * test: update events test * add events committee feed components + by-sort component * fmt * test: update events test * test: comment spec * test: included some test from pr 982 * revert commit * feat: simpleMDE to new api * fmt * feat: linkedproposaldropdown to new api * fmt * test: proposal autolink --------- Co-authored-by: Peter Salomonsen <[email protected]>
NEAR-DevHub · Dec 8, 2024 · 6469ac4 · 6469ac4
1 parent d57811f
commit 6469ac4
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 270 deletions.
diff --git a/instances/devhub.near/widget/devhub/components/molecule/SimpleMDE.jsx b/instances/devhub.near/widget/devhub/components/molecule/SimpleMDE.jsx
@@ -203,7 +203,6 @@ function extractNumbers(str) {
 
 function searchCacheApi(searchProposalId) {
   let searchInput = encodeURI(searchProposalId);
-
   let searchUrl = "${cacheUrl}/proposals/search/" + searchInput;
 
   return asyncFetch(searchUrl, {

diff --git a/instances/devhub.near/widget/devhub/entity/proposal/Editor.jsx b/instances/devhub.near/widget/devhub/entity/proposal/Editor.jsx
@@ -974,6 +974,7 @@ const LinkedProposalsComponent = useMemo(() => {
       <Widget
         src="${REPL_DEVHUB}/widget/devhub.entity.proposal.LinkedProposalsDropdown"
         props={{
+          instance: "${REPL_DEVHUB}",
           onChange: setLinkedProposals,
           linkedProposals: linkedProposals,
         }}

diff --git a/instances/devhub.near/widget/devhub/entity/proposal/LinkedProposalsDropdown.jsx b/instances/devhub.near/widget/devhub/entity/proposal/LinkedProposalsDropdown.jsx
@@ -1,24 +1,15 @@
 const { href } = VM.require("${REPL_DEVHUB}/widget/core.lib.url");
 href || (href = () => {});
 
+const instance = props.instance ?? "";
+
+const { cacheUrl, contract } = VM.require(`${instance}/widget/config.data`);
+
 const linkedProposals = props.linkedProposals;
 const onChange = props.onChange;
 const [selectedProposals, setSelectedProposals] = useState(linkedProposals);
 const [proposalsOptions, setProposalsOptions] = useState([]);
-const [searchProposalId, setSearchProposalId] = useState("");
-const QUERYAPI_ENDPOINT = `https://near-queryapi.api.pagoda.co/v1/graphql`;
-const queryName = "${REPL_PROPOSAL_FEED_INDEXER_QUERY_NAME}";
-const query = `query GetLatestSnapshot($offset: Int = 0, $limit: Int = 10, $where: ${queryName}_bool_exp = {}) {
-${queryName}(
-  offset: $offset
-  limit: $limit
-  order_by: {proposal_id: desc}
-  where: $where
-) {
-  name
-  proposal_id
-}
-}`;
+const [textAfterHash, setTextAfterHash] = useState("");
 
 useEffect(() => {
   if (JSON.stringify(linkedProposals) !== JSON.stringify(selectedProposals)) {
@@ -32,73 +23,43 @@ useEffect(() => {
   }
 }, [selectedProposals]);
 
-function separateNumberAndText(str) {
-  const numberRegex = /\d+/;
-
-  if (numberRegex.test(str)) {
-    const number = str.match(numberRegex)[0];
-    const text = str.replace(numberRegex, "").trim();
-    return { number: parseInt(number), text };
-  } else {
-    return { number: null, text: str.trim() };
-  }
-}
+function searchCacheApi(input) {
+  let searchInput = encodeURI(input);
+  let searchUrl = `${cacheUrl}/proposals/search/${searchInput}`;
 
-const buildWhereClause = () => {
-  let where = {};
-  const { number, text } = separateNumberAndText(searchProposalId);
-
-  if (number) {
-    where = { proposal_id: { _eq: number }, ...where };
-  }
-
-  if (text) {
-    where = { name: { _ilike: `%${text}%` }, ...where };
-  }
-
-  return where;
-};
-
-function fetchGraphQL(operationsDoc, operationName, variables) {
-  return asyncFetch(QUERYAPI_ENDPOINT, {
-    method: "POST",
-    headers: { "x-hasura-role": "${REPL_INDEXER_HASURA_ROLE}" },
-    body: JSON.stringify({
-      query: operationsDoc,
-      variables: variables,
-      operationName: operationName,
-    }),
+  return asyncFetch(searchUrl, {
+    method: "GET",
+    headers: {
+      accept: "application/json",
+    },
+  }).catch((error) => {
+    console.log("Error searching cache api", error);
   });
 }
 
-const fetchProposals = () => {
-  const FETCH_LIMIT = 30;
-  const variables = {
-    limit: FETCH_LIMIT,
-    offset: 0,
-    where: buildWhereClause(),
-  };
-  fetchGraphQL(query, "GetLatestSnapshot", variables).then(async (result) => {
-    if (result.status === 200) {
-      if (result.body.data) {
-        const proposalsData = result.body.data[queryName];
+function searchProposals(input) {
+  if (state.loading) return;
+  State.update({ loading: true });
 
-        const data = [];
-        for (const prop of proposalsData) {
-          data.push({
-            label: "# " + prop.proposal_id + " : " + prop.name,
-            value: prop.proposal_id,
-          });
-        }
-        setProposalsOptions(data);
-      }
+  searchCacheApi(input).then((result) => {
+    let proposalsData = result.body.records;
+
+    const data = [];
+    for (const prop of proposalsData) {
+      data.push({
+        label: "# " + prop.proposal_id + " : " + prop.name,
+        value: prop.proposal_id,
+      });
     }
+    setProposalsOptions(data);
   });
-};
+}
 
 useEffect(() => {
-  fetchProposals();
-}, [searchProposalId]);
+  if (textAfterHash.trim()) {
+    searchProposals(textAfterHash);
+  }
+}, [textAfterHash]);
 
 return (
   <>
@@ -108,7 +69,7 @@ return (
           <a
             className="text-decoration-underline flex-1"
             href={href({
-              widgetSrc: "${REPL_DEVHUB}/widget/app",
+              widgetSrc: `${contract}/widget/app`,
               params: {
                 page: "proposal",
                 id: proposal.value,
@@ -128,7 +89,7 @@ return (
               setSelectedProposals(updatedLinkedProposals);
             }}
           >
-            <i class="bi bi-trash3-fill"></i>
+            <i className="bi bi-trash3-fill"></i>
           </div>
         </div>
       );
@@ -137,7 +98,7 @@ return (
     <Widget
       src="${REPL_DEVHUB}/widget/devhub.components.molecule.DropDownWithSearch"
       props={{
-        selectedValue: "",
+        selectedValue: selectedProposals,
         onChange: (v) => {
           if (!selectedProposals.some((item) => item.value === v.value)) {
             setSelectedProposals([...selectedProposals, v]);
@@ -149,7 +110,7 @@ return (
         defaultLabel: "Search proposals",
         searchByValue: true,
         onSearch: (value) => {
-          setSearchProposalId(value);
+          setTextAfterHash(value);
         },
       }}
     />

diff --git a/instances/events-committee.near/widget/devhub/entity/proposal/Editor.jsx b/instances/events-committee.near/widget/devhub/entity/proposal/Editor.jsx
@@ -910,7 +910,11 @@ const ConsentComponent = useMemo(() => {
                 src={
                   "${REPL_DEVHUB}/widget/devhub.entity.proposal.AcceptedTerms"
                 }
-                props={{ proposalId: proposalId, portal: "Events Committee" }}
+                props={{
+                  ...props,
+                  proposalId: proposalId,
+                  portal: "Events Committee",
+                }}
               />
               and commit to honoring it
             </>
@@ -973,8 +977,9 @@ const LinkedProposalsComponent = useMemo(() => {
         Link any relevant proposals (e.g. previous milestones).
       </div>
       <Widget
-        src="${REPL_EVENTS}/widget/devhub.entity.proposal.LinkedProposalsDropdown"
+        src="${REPL_DEVHUB}/widget/devhub.entity.proposal.LinkedProposalsDropdown"
         props={{
+          instance: "${REPL_EVENTS}",
           onChange: setLinkedProposals,
           linkedProposals: linkedProposals,
         }}

diff --git a/instances/events-committee.near/widget/devhub/entity/proposal/LinkedProposalsDropdown.jsx b/instances/events-committee.near/widget/devhub/entity/proposal/LinkedProposalsDropdown.jsx