move all props to one file

NEAR-DevHub · Aug 1, 2024 · 02e1a2e · 02e1a2e
1 parent bad921e
commit 02e1a2e
Show file tree

Hide file tree

Showing 16 changed files with 302 additions and 243 deletions.
diff --git a/instances/devhub.near/widget/app.jsx b/instances/devhub.near/widget/app.jsx
@@ -14,9 +14,10 @@ const { AppLayout } = VM.require(
   "${REPL_DEVHUB}/widget/devhub.components.templates.AppLayout"
 );
 
-const { Theme } = VM.require("${REPL_DEVHUB}/widget/config.css");
+const { CssContainer } = VM.require("${REPL_DEVHUB}/widget/config.css");
+const { Theme } = VM.require("${REPL_DEVHUB}/widget/config.theme");
 
-if (!AppLayout || !Theme) {
+if (!AppLayout || !Theme || !CssContainer) {
   return <p>Loading modules...</p>;
 }
 
@@ -241,8 +242,10 @@ function Page() {
 
 return (
   <Theme>
-    <AppLayout page={page}>
-      <Page />
-    </AppLayout>
+    <CssContainer>
+      <AppLayout page={page}>
+        <Page />
+      </AppLayout>
+    </CssContainer>
   </Theme>
 );
diff --git a/instances/devhub.near/widget/config/css.jsx b/instances/devhub.near/widget/config/css.jsx
@@ -1,6 +1,4 @@
-const Theme = styled.div`
-  --theme-color: rgb(4, 164, 110);
-
+const CssContainer = styled.div`
   .theme-btn {
     background-color: var(--theme-color) !important;
     border: none;
@@ -25,4 +23,4 @@ const Theme = styled.div`
   }
 `;
 
-return { Theme };
+return { CssContainer };
diff --git a/instances/devhub.near/widget/config/data.jsx b/instances/devhub.near/widget/config/data.jsx
@@ -0,0 +1,97 @@
+const proposalFeedAnnouncement = (
+  <div className="text-muted bg-grey text-sm mt-2 p-3 rounded-3">
+    <p className="d-flex gap-3 align-items-center mb-0">
+      <div>
+        <i class="bi bi-info-circle"></i>
+      </div>
+      <div>
+        <span className="fw-bold">
+          Welcome to
+          <a
+            href="?page=community&handle=developer-dao&tab=overview"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            DevDAO’s New Proposal Feed!
+          </a>
+        </span>
+        This dedicated space replaces the
+        <a
+          href="?page=feed"
+          className="text-decoration-underline no-space"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          old activity feed
+        </a>
+        , making it easier to submit and track funding requests from DevDAO, the
+        primary organization behind DevHub. To submit a formal proposal, click
+        New Proposal. See our{" "}
+        <a
+          href="?page=community&handle=developer-dao&tab=funding"
+          className="text-decoration-underline no-space"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          guidelines
+        </a>
+        for details. For discussions and brainstorming, please utilize the
+        relevant{" "}
+        <a
+          href="?page=communities"
+          className="text-decoration-underline no-space"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          communities
+        </a>
+        .
+      </div>
+    </p>
+  </div>
+);
+
+const categoryOptions = [
+  {
+    title: "DevDAO Operations",
+    value: "DevDAO Operations",
+  },
+  {
+    title: "DevDAO Platform",
+    value: "DevDAO Platform",
+  },
+  {
+    title: "Events & Hackathons",
+    value: "Events & Hackathons",
+  },
+  {
+    title: "Engagement & Awareness",
+    value: "Engagement & Awareness",
+  },
+  {
+    title: "Decentralized DevRel",
+    value: "Decentralized DevRel",
+  },
+  {
+    title: "Universities & Bootcamps",
+    value: "Universities & Bootcamps",
+  },
+  {
+    title: "Tooling & Infrastructure",
+    value: "Tooling & Infrastructure",
+  },
+  {
+    title: "Other",
+    value: "Other",
+  },
+];
+
+return {
+  contract: "devhub.near",
+  proposalFeedIndexerQueryName:
+    "polyprogrammist_near_devhub_prod_v1_proposals_with_latest_snapshot",
+  indexerHasuraRole: "polyprogrammist_near",
+  isDevhub: true,
+  proposalFeedAnnouncement,
+  availableCategoryOptions: categoryOptions,
+};
diff --git a/instances/devhub.near/widget/config/theme.jsx b/instances/devhub.near/widget/config/theme.jsx
@@ -0,0 +1,5 @@
+const Theme = styled.div`
+  --theme-color: rgb(4, 164, 110);
+`;
+
+return { Theme };
diff --git a/instances/devhub.near/widget/devhub/entity/proposal/Feed.jsx b/instances/devhub.near/widget/devhub/entity/proposal/Feed.jsx
@@ -3,43 +3,27 @@ const { href } = VM.require("${REPL_DEVHUB}/widget/core.lib.url") || {
 };
 
 const instance = props.instance ?? "";
-const availableCategoryOptions = props.availableCategoryOptions ?? [];
-const announcement = props.announcement ?? <></>;
-
-let contract = "";
-let rfpFeedIndexerQueryName = "";
-let proposalFeedIndexerQueryName = "";
-let indexerHasuraRole = "";
-let isDevhub = false;
-let isInfra = false;
-let isEvents = false;
-
-switch (instance) {
-  case "infrastructure-committee.near": {
-    contract = instance;
-    rfpFeedIndexerQueryName =
-      "polyprogrammist_near_devhub_ic_v1_rfps_with_latest_snapshot";
-    proposalFeedIndexerQueryName =
-      "polyprogrammist_near_devhub_ic_v1_proposals_with_latest_snapshot";
-    indexerHasuraRole = "polyprogrammist_near";
-    isInfra = true;
-    break;
-  }
-  case "events-committee.near": {
-    contract = instance;
-    proposalFeedIndexerQueryName =
-      "thomasguntenaar_near_event_committee_prod_v1_proposals_with_latest_snapshot";
-    indexerHasuraRole = "thomasguntenaar_near";
-    isEvents = true;
-    break;
-  }
-  default: {
-    contract = instance;
-    proposalFeedIndexerQueryName =
-      "polyprogrammist_near_devhub_prod_v1_proposals_with_latest_snapshot";
-    indexerHasuraRole = "polyprogrammist_near";
-    isDevhub = true;
-  }
+
+const {
+  contract,
+  rfpFeedIndexerQueryName,
+  proposalFeedAnnouncement,
+  availableCategoryOptions,
+  proposalFeedIndexerQueryName,
+  indexerHasuraRole,
+  isDevhub,
+  isInfra,
+  isEvents,
+} = VM.require(`${instance}/widget/config.data`);
+
+const loader = (
+  <div className="d-flex justify-content-center align-items-center w-100">
+    <Widget src={"${REPL_DEVHUB}/widget/devhub.components.molecule.Spinner"} />
+  </div>
+);
+
+if (!contract) {
+  return loader;
 }
 
 function isNumber(v) {
@@ -485,14 +469,6 @@ const FeedPage = () => {
     });
   };
 
-  const loader = (
-    <div className="d-flex justify-content-center align-items-center w-100">
-      <Widget
-        src={"${REPL_DEVHUB}/widget/devhub.components.molecule.Spinner"}
-      />
-    </div>
-  );
-
   useEffect(() => {
     const handler = setTimeout(() => {
       fetchProposals();
@@ -537,17 +513,19 @@ const FeedPage = () => {
             }}
           />
           <div className="d-flex gap-4 align-items-center">
-            <Widget
-              src={
-                "${REPL_DEVHUB}/widget/devhub.feature.proposal-search.by-category"
-              }
-              props={{
-                categoryOptions: availableCategoryOptions,
-                onStateChange: (select) => {
-                  State.update({ category: select.value });
-                },
-              }}
-            />
+            {!isInfra && (
+              <Widget
+                src={
+                  "${REPL_DEVHUB}/widget/devhub.feature.proposal-search.by-category"
+                }
+                props={{
+                  categoryOptions: availableCategoryOptions,
+                  onStateChange: (select) => {
+                    State.update({ category: select.value });
+                  },
+                }}
+              />
+            )}
             <Widget
               src={
                 "${REPL_DEVHUB}/widget/devhub.feature.proposal-search.by-stage"
@@ -601,7 +579,7 @@ const FeedPage = () => {
         ) : (
           <div className="card no-border rounded-0 mt-4 py-3 full-width-div">
             <div className="container-xl">
-              {announcement}
+              {proposalFeedAnnouncement}
               <div className="mt-4 border rounded-2">
                 {state.aggregatedCount === 0 ? (
                   <div class="alert alert-danger m-2" role="alert">

diff --git a/instances/devhub.near/widget/devhub/page/proposals.jsx b/instances/devhub.near/widget/devhub/page/proposals.jsx
@@ -1,96 +1,8 @@
-const announcement = (
-  <div className="text-muted bg-grey text-sm mt-2 p-3 rounded-3">
-    <p className="d-flex gap-3 align-items-center mb-0">
-      <div>
-        <i class="bi bi-info-circle"></i>
-      </div>
-      <div>
-        <span className="fw-bold">
-          Welcome to
-          <a
-            href="?page=community&handle=developer-dao&tab=overview"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            DevDAO’s New Proposal Feed!
-          </a>
-        </span>
-        This dedicated space replaces the
-        <a
-          href="?page=feed"
-          className="text-decoration-underline no-space"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          old activity feed
-        </a>
-        , making it easier to submit and track funding requests from DevDAO, the
-        primary organization behind DevHub. To submit a formal proposal, click
-        New Proposal. See our{" "}
-        <a
-          href="?page=community&handle=developer-dao&tab=funding"
-          className="text-decoration-underline no-space"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          guidelines
-        </a>
-        for details. For discussions and brainstorming, please utilize the
-        relevant{" "}
-        <a
-          href="?page=communities"
-          className="text-decoration-underline no-space"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          communities
-        </a>
-        .
-      </div>
-    </p>
-  </div>
-);
-const categoryOptions = [
-  {
-    title: "DevDAO Operations",
-    value: "DevDAO Operations",
-  },
-  {
-    title: "DevDAO Platform",
-    value: "DevDAO Platform",
-  },
-  {
-    title: "Events & Hackathons",
-    value: "Events & Hackathons",
-  },
-  {
-    title: "Engagement & Awareness",
-    value: "Engagement & Awareness",
-  },
-  {
-    title: "Decentralized DevRel",
-    value: "Decentralized DevRel",
-  },
-  {
-    title: "Universities & Bootcamps",
-    value: "Universities & Bootcamps",
-  },
-  {
-    title: "Tooling & Infrastructure",
-    value: "Tooling & Infrastructure",
-  },
-  {
-    title: "Other",
-    value: "Other",
-  },
-];
 return (
   <Widget
     src={"${REPL_DEVHUB}/widget/devhub.entity.proposal.Feed"}
     props={{
       instance: "devhub.near",
-      announcement,
-      availableCategoryOptions: categoryOptions,
     }}
   />
 );
diff --git a/instances/events-committee.near/widget/app.jsx b/instances/events-committee.near/widget/app.jsx
@@ -14,9 +14,10 @@ const { AppLayout } = VM.require(
   "${REPL_EVENTS}/widget/devhub.components.templates.AppLayout"
 );
 
-const { Theme } = VM.require("${REPL_EVENTS}/widget/config.css");
+const { Theme } = VM.require("${REPL_EVENTS}/widget/config.theme");
+const { CssContainer } = VM.require("${REPL_EVENTS}/widget/config.css");
 
-if (!AppLayout || !Theme) {
+if (!AppLayout || !Theme || !CssContainer) {
   return <p>Loading modules...</p>;
 }
 
@@ -92,8 +93,10 @@ function Page() {
 
 return (
   <Theme>
-    <AppLayout page={page}>
-      <Page />
-    </AppLayout>
+    <CssContainer>
+      <AppLayout page={page}>
+        <Page />
+      </AppLayout>
+    </CssContainer>
   </Theme>
 );