Extract the dropdown menu from VRF v2 cost calculator

jest.config.js

@@ -6,6 +6,7 @@ module.exports = {
   },
   moduleNameMapper: {
     "\\.(css)$": "<rootDir>/src/__mocks__/styleMock.ts",
+    "^~/(.*)$": "<rootDir>/src/$1",
   },
   transformIgnorePatterns: ["<rootDir>/node_modules/"],
 }

package.json

@@ -44,7 +44,6 @@
     "github-slugger": "^2.0.0",
     "nanostores": "^0.8.1",
     "preact": "^10.16.0",
-    "query-string": "^8.1.0",
     "react-instantsearch-hooks-web": "^6.47.3"
   },
   "devDependencies": {

src/features/data/chains.test.ts

@@ -0,0 +1,22 @@
+import { getNetworkFromQueryString, CHAINS } from "./chains"
+import { expect, test } from "@jest/globals"
+
+describe("getNetworkFromQueryString", () => {
+  test("works with testnet", () => {
+    const queryString = "ethereum-sepolia"
+    const chain = CHAINS.filter((chain) => chain.label === "Ethereum")[0]
+    const chainNetwork = chain.networks.filter((network) => network.name === "Sepolia Testnet")[0]
+    expect(getNetworkFromQueryString(queryString)).toEqual({ chain, chainNetwork })
+  })
+
+  test("works with mainnet", () => {
+    const queryString = "polygon-mainnet"
+    const chain = CHAINS.filter((chain) => chain.label === "Polygon (Matic)")[0]
+    const chainNetwork = chain.networks.filter((network) => network.name === "Polygon Mainnet")[0]
+    expect(getNetworkFromQueryString(queryString)).toEqual({ chain, chainNetwork })
+  })
+  test("return null when invalid queryString", () => {
+    const queryString = "falsy-string"
+    expect(getNetworkFromQueryString(queryString)).toEqual({ chain: null, chainNetwork: null })
+  })
+})