Feat/configure graph endpoint (#2269)

* feat: make graph endpoint configurable

* update env.example and remove default selection from _app.tsx

* fix: add protocol to env vars (for now)

* add WS host as seperate variable

* fix default value

* formatting and remove devnet from useless dropdown

packages/apps/explorer/.env.example

@@ -0,0 +1,11 @@
+## Config for a local devnet
+KADENA_GRAPH_HOST=http://localhost:4000
+KADENA_GRAPH_WS_HOST=ws://localhost:4000
+
+## Sample config for Testnet
+# KADENA_GRAPH_HOST=https://graph.testnet.kadena.network/graphql
+# KADENA_GRAPH_WS_HOST=wss://graph.testnet.kadena.network/graphql
+
+## Sample config for mainnet
+# KADENA_GRAPH_HOST=https://graph.kadena.network/graphql
+# KADENA_GRAPH_WS_HOST=wss://graph.kadena.network/graphql

packages/apps/explorer/next.config.js

@@ -6,13 +6,9 @@ const nextConfig = {
   reactStrictMode: true,
   swcMinify: true,
   transpilePackages: ['@kadena/react-ui'],
-  async rewrites() {
-    return [
-      {
-        source: '/graph',
-        destination: 'http://localhost:4000/graphql',
-      },
-    ];
+  env: {
+    KADENA_GRAPH_HOST: process.env.KADENA_GRAPH_HOST,
+    KADENA_GRAPH_WS_HOST: process.env.KADENA_GRAPH_WS_HOST,
   },
 };
 

packages/apps/explorer/src/constants/graphHost.ts

@@ -0,0 +1,4 @@
+export const graphHost =
+  process.env.KADENA_GRAPH_HOST || 'http://localhost:4000/graphql';
+export const wsGraphHost =
+  process.env.KADENA_GRAPH_WS_HOST || 'ws://localhost:4000/graphql';

packages/apps/explorer/src/pages/_app.tsx

@@ -2,6 +2,7 @@
 import '@kadena/react-ui/global';
 
 import { MediaContextProvider } from '@/components/layout/media';
+import { graphHost, wsGraphHost } from '@/constants/graphHost';
 import type { NormalizedCacheObject } from '@apollo/client';
 import {
   ApolloClient,
@@ -23,13 +24,16 @@ import React from 'react';
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const { YogaLink } = require('@graphql-yoga/apollo-link');
 
+console.log('graphHost', graphHost);
+console.log('wsGraphHost', wsGraphHost);
+
 const httpLink = new YogaLink({
-  endpoint: '/graph',
+  endpoint: graphHost,
 });
 
 const wsLink = new GraphQLWsLink(
   createClient({
-    url: 'ws://localhost:4000/graphql',
+    url: wsGraphHost,
   }),
 );