feat(#minor); dashboard; add toggle for listing substreams based subg…

…raphs separately (#2338) Co-authored-by: Dhruv Chauhan <dhruv@Dhruvs-MacBook-Pro.local>
messari · Aug 21, 2023 · 39a7842 · 39a7842
1 parent 52ba163
commit 39a7842
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 8 deletions.
diff --git a/dashboard/src/common/DashboardVersion.tsx b/dashboard/src/common/DashboardVersion.tsx
@@ -11,7 +11,7 @@ const DashboardTag = styled("div")`
   z-index: 2;
 `;
 
-export const dashboardVersion = "v2.2.20";
+export const dashboardVersion = "v2.2.21";
 
 export const DashboardVersion = () => {
   return <DashboardTag>{dashboardVersion}</DashboardTag>;

diff --git a/dashboard/src/deployments/DeploymentsPage.tsx b/dashboard/src/deployments/DeploymentsPage.tsx
@@ -100,10 +100,33 @@ function DeploymentsPage({
   const [indexingStatus, setIndexingStatus] = useState<any>(false);
   const [pendingIndexingStatus, setPendingIndexingStatus] = useState<any>(false);
 
+  const [substreamsBasedSubgraphs, setSubstreamsBasedSubgraphs] = useState<{
+    [type: string]: { [proto: string]: { [network: string]: string } };
+  }>({});
+  const [nonSubstreamsBasedSubgraphs, setNonSubstreamsBasedSubgraphs] = useState<{
+    [type: string]: { [proto: string]: { [network: string]: string } };
+  }>({});
+  const [showSubstreamsBasedSubgraphs, setShowSubstreamsBasedSubgraphs] = useState<boolean>(false);
+
   useEffect(() => {
     getData();
   }, []);
 
+  useEffect(() => {
+    let substreamsBasedSubgraphs: any = {};
+    let nonSubstreamsBasedSubgraphs: any = {};
+    Object.keys(protocolsToQuery).forEach((protocolName: string) => {
+      const protocol: { [x: string]: any } = protocolsToQuery[protocolName];
+      if (protocol.base === "substreams") {
+        substreamsBasedSubgraphs[protocolName] = protocolsToQuery[protocolName];
+      } else {
+        nonSubstreamsBasedSubgraphs[protocolName] = protocolsToQuery[protocolName];
+      }
+    });
+    setSubstreamsBasedSubgraphs(substreamsBasedSubgraphs);
+    setNonSubstreamsBasedSubgraphs(nonSubstreamsBasedSubgraphs);
+  }, [protocolsToQuery]);
+
   const navigate = useNavigate();
   window.scrollTo(0, 0);
 
@@ -289,16 +312,29 @@ function DeploymentsPage({
           >
             Protocols To Develop
           </span>
-          <span style={{ padding: "0 30px" }} className="Menu-Options" onClick={() => navigate("version-comparison")}>
+          <span
+            style={{ padding: "0 30px", borderRight: "#6656F8 2px solid" }}
+            className="Menu-Options"
+            onClick={() => navigate("version-comparison")}
+          >
             Version Comparison
           </span>
+          <span
+            style={{ padding: "0 30px" }}
+            className="Menu-Options"
+            onClick={() => {
+              setShowSubstreamsBasedSubgraphs(!showSubstreamsBasedSubgraphs);
+            }}
+          >
+            Show {showSubstreamsBasedSubgraphs ? "Non" : ""} Substreams Based Subgraphs
+          </span>
         </div>
         {devCountTable}
         <DeploymentsTable
           getData={() => getData()}
           decenDepoIndexingStatus={decenDepoIndexingStatus}
           issuesMapping={issuesMapping}
-          protocolsToQuery={protocolsToQuery}
+          protocolsToQuery={showSubstreamsBasedSubgraphs ? substreamsBasedSubgraphs : nonSubstreamsBasedSubgraphs}
           decenDeposToSubgraphIds={decenDeposToSubgraphIds}
           indexingStatusLoaded={indexingStatusLoaded}
           indexingStatusLoadedPending={indexingStatusLoadedPending}

diff --git a/dashboard/src/deployments/ProtocolSection.tsx b/dashboard/src/deployments/ProtocolSection.tsx
@@ -175,7 +175,7 @@ function ProtocolSection({
                       return;
                     }
                     if (!pendingObject?.fatalError) {
-                      navigate(`subgraph?endpoint=messari/${depo.hostedServiceId}&tab=protocol&version=pending`);
+                      navigate(`/subgraph?endpoint=messari/${depo.hostedServiceId}&tab=protocol&version=pending`);
                     } else {
                       window.location.href = "https://okgraph.xyz/?q=" + pendingObject?.subgraph;
                     }
@@ -370,7 +370,7 @@ function ProtocolSection({
                       return;
                     }
                     if (!pendingObject?.fatalError) {
-                      navigate(`subgraph?endpoint=messari/${depo.hostedServiceId}&tab=protocol&version=pending`);
+                      navigate(`/subgraph?endpoint=messari/${depo.hostedServiceId}&tab=protocol&version=pending`);
                     } else {
                       window.location.href = "https://okgraph.xyz/?q=" + pendingObject?.subgraph;
                     }
@@ -681,7 +681,7 @@ function ProtocolSection({
                     return;
                   }
                   if (!decenObject?.fatalError) {
-                    navigate(`subgraph?endpoint=${endpointURL}&tab=protocol`);
+                    navigate(`/subgraph?endpoint=${endpointURL}&tab=protocol`);
                   } else {
                     window.location.href = "https://okgraph.xyz/?q=" + depo.decentralizedNetworkId;
                   }
@@ -950,7 +950,7 @@ function ProtocolSection({
                       return;
                     }
                     if (!currentObject?.fatalError) {
-                      navigate(`subgraph?endpoint=${subgraphUrlBase}messari/${depo.hostedServiceId}&tab=protocol`);
+                      navigate(`/subgraph?endpoint=${subgraphUrlBase}messari/${depo.hostedServiceId}&tab=protocol`);
                     } else {
                       window.location.href = "https://okgraph.xyz/?q=messari/" + depo.hostedServiceId;
                     }
@@ -1148,7 +1148,7 @@ function ProtocolSection({
                     return;
                   }
                   if (!currentObject?.fatalError) {
-                    navigate(`subgraph?endpoint=${subgraphUrlBase}messari/${depo.hostedServiceId}&tab=protocol`);
+                    navigate(`/subgraph?endpoint=${subgraphUrlBase}messari/${depo.hostedServiceId}&tab=protocol`);
                   } else {
                     window.location.href = "https://okgraph.xyz/?q=messari/" + depo.hostedServiceId;
                   }