fix(configuration): add query param configuration for rpc url

fixes #56

README.md

@@ -69,6 +69,13 @@ By default, multi-geth service will run ETC mainnet. Jade Service runner conveni
                     └── keystore
 ```
 
+## Configuration
+
+### Configure rpc via url
+
+https://explorer.jade.builders/?rpcUrl=https://services.jade.builders/multi-geth/kotti/1.9.2
+
+
 ### Configure default urls via environment variables
 
 Override eth url

src/hooks/useMultiGeth.ts

@@ -9,6 +9,7 @@ function useMultiGeth(
   serviceRunnerUrl: string,
   version: string,
   env: string,
+  queryUrlOverride?: string,
 ): [ERPC, Dispatch<string>] {
   const [erpc, setErpc] = React.useState();
   const [urlOverride, setUrlOverride] = useState(process.env.REACT_APP_ETH_RPC_URL);
@@ -24,7 +25,7 @@ function useMultiGeth(
       await serviceRunner.startService(serviceName, version, env);
       let parsedUrl;
       try {
-        parsedUrl = new URL(urlOverride || `${serviceRunnerUrl}/${serviceName}/${env}/${version}`);
+        parsedUrl = new URL(queryUrlOverride || urlOverride || `${serviceRunnerUrl}/${serviceName}/${env}/${version}`);
       } catch (e) {
         return;
       }
@@ -49,7 +50,7 @@ function useMultiGeth(
       }
     };
     runAsync();
-  }, [serviceRunner, serviceRunnerUrl, version, env, urlOverride]);
+  }, [serviceRunner, serviceRunnerUrl, version, env, urlOverride, queryUrlOverride]);
   return [erpc, setUrlOverride];
 }
 

src/hooks/useQueryParams.ts

@@ -0,0 +1,27 @@
+import { useState } from "react";
+import * as qs from "qs";
+
+const useQueryParams = () => {
+  const parse = () => {
+    return qs.parse(window.location.search, {
+      ignoreQueryPrefix: true,
+      depth: 100,
+      decoder(str) {
+        if (/^(\d+|\d*\.\d+)$/.test(str)) {
+          return parseFloat(str);
+        }
+        if (str === "false") {
+          return false;
+        }
+        if (str === "true") {
+          return true;
+        }
+        return decodeURIComponent(str);
+      },
+    });
+  };
+  const [query] = useState(parse());
+  return [query];
+};
+
+export default useQueryParams;

src/stores/useMultiGethStore.ts

@@ -1,8 +1,10 @@
 import { createStore } from "reusable";
 import useMultiGeth from "../hooks/useMultiGeth";
 import useServiceRunnerStore from "./useServiceRunnerStore";
+import useQueryParams from "../hooks/useQueryParams";
 
 export default createStore(() => {
   const [serviceRunner, serviceRunnerUrl] = useServiceRunnerStore();
-  return useMultiGeth(serviceRunner, serviceRunnerUrl, "1.9.2", "mainnet");
+  const [queryParams] = useQueryParams();
+  return useMultiGeth(serviceRunner, serviceRunnerUrl, "1.9.2", "mainnet", queryParams.rpcUrl);
 });