From f2a78ac058bd63cf23545c5e8b743f4d401cabae Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 13 Sep 2024 16:49:01 +0530 Subject: [PATCH 1/2] feat(web-devtools): shift-gql-request-to-server-side --- web-devtools/codegen.ts | 2 +- .../src/{utils => actions}/getGraphqlUrl.ts | 9 ++++----- web-devtools/src/actions/gqlFetcher.ts | 16 ++++++++++++++++ web-devtools/src/context/GraphqlBatcher.tsx | 6 ++---- 4 files changed, 23 insertions(+), 10 deletions(-) rename web-devtools/src/{utils => actions}/getGraphqlUrl.ts (52%) create mode 100644 web-devtools/src/actions/gqlFetcher.ts diff --git a/web-devtools/codegen.ts b/web-devtools/codegen.ts index 33bd47263..a34ac7d4e 100644 --- a/web-devtools/codegen.ts +++ b/web-devtools/codegen.ts @@ -1,6 +1,6 @@ import type { CodegenConfig } from "@graphql-codegen/cli"; -import { getGraphqlUrl } from "./src/utils/getGraphqlUrl"; +import { getGraphqlUrl } from "./src/actions/getGraphqlUrl"; const config: CodegenConfig = { overwrite: true, diff --git a/web-devtools/src/utils/getGraphqlUrl.ts b/web-devtools/src/actions/getGraphqlUrl.ts similarity index 52% rename from web-devtools/src/utils/getGraphqlUrl.ts rename to web-devtools/src/actions/getGraphqlUrl.ts index e2ee34b6e..cc37b86df 100644 --- a/web-devtools/src/utils/getGraphqlUrl.ts +++ b/web-devtools/src/actions/getGraphqlUrl.ts @@ -1,3 +1,4 @@ +"use server"; import { arbitrumSepolia, arbitrum } from "wagmi/chains"; import { DEFAULT_CHAIN } from "../consts/chains"; @@ -5,12 +6,10 @@ import { DEFAULT_CHAIN } from "../consts/chains"; export const getGraphqlUrl = (isDisputeTemplate = false, chainId: number = DEFAULT_CHAIN) => { const CHAINID_TO_DISPUTE_TEMPLATE_SUBGRAPH: { [key: number]: string } = { [arbitrumSepolia.id]: - process.env.NEXT_PUBLIC_DRT_ARBSEPOLIA_SUBGRAPH ?? - "Environment variable NEXT_PUBLIC_DRT_ARBSEPOLIA_SUBGRAPH not set.", + process.env.DRT_ARBSEPOLIA_SUBGRAPH ?? "Environment variable NEXT_PUBLIC_DRT_ARBSEPOLIA_SUBGRAPH not set.", [arbitrum.id]: - process.env.NEXT_PUBLIC_DRT_ARBMAINNET_SUBGRAPH ?? - "Environment variable NEXT_PUBLIC_DRT_ARBMAINNET_SUBGRAPH not set.", + process.env.ARBMAINNET_SUBGRAPH ?? "Environment variable NEXT_PUBLIC_DRT_ARBMAINNET_SUBGRAPH not set.", }; - const coreUrl = process.env.NEXT_PUBLIC_CORE_SUBGRAPH ?? "Environment variables NEXT_PUBLIC_CORE_SUBGRAPH not set."; + const coreUrl = process.env.CORE_SUBGRAPH ?? "Environment variables NEXT_PUBLIC_CORE_SUBGRAPH not set."; return isDisputeTemplate ? CHAINID_TO_DISPUTE_TEMPLATE_SUBGRAPH[chainId] : coreUrl; }; diff --git a/web-devtools/src/actions/gqlFetcher.ts b/web-devtools/src/actions/gqlFetcher.ts new file mode 100644 index 000000000..4948b52fc --- /dev/null +++ b/web-devtools/src/actions/gqlFetcher.ts @@ -0,0 +1,16 @@ +"use server"; + +import { TypedDocumentNode } from "@graphql-typed-document-node/core"; +import { request } from "graphql-request"; + +import { getGraphqlUrl } from "./getGraphqlUrl"; + +export const gqlRequest = async ( + document: TypedDocumentNode, + variables: Record, + chainId?: number, + isDisputeTemplate?: boolean +) => { + const url = await getGraphqlUrl(isDisputeTemplate, chainId); + return await request(url, document, variables); +}; diff --git a/web-devtools/src/context/GraphqlBatcher.tsx b/web-devtools/src/context/GraphqlBatcher.tsx index bd7b1572a..3a4d4b051 100644 --- a/web-devtools/src/context/GraphqlBatcher.tsx +++ b/web-devtools/src/context/GraphqlBatcher.tsx @@ -2,10 +2,9 @@ import React, { useMemo, createContext, useContext } from "react"; import { TypedDocumentNode } from "@graphql-typed-document-node/core"; import { create, windowedFiniteBatchScheduler, Batcher } from "@yornaath/batshit"; -import { request } from "graphql-request"; +import { gqlRequest } from "actions/gqlFetcher"; import { debounceErrorToast } from "utils/debounceErrorToast"; -import { getGraphqlUrl } from "utils/getGraphqlUrl"; interface IGraphqlBatcher { graphqlBatcher: Batcher; @@ -23,9 +22,8 @@ const Context = createContext(undefined); const fetcher = async (queries: IQuery[]) => { const promises = queries.map(async ({ id, document, variables, isDisputeTemplate, chainId }) => { - const url = getGraphqlUrl(isDisputeTemplate ?? false, chainId); try { - return request(url, document, variables).then((result) => ({ id, result })); + return await gqlRequest(document, variables, chainId, isDisputeTemplate).then((result) => ({ id, result })); } catch (error) { console.error("Graph error: ", { error }); debounceErrorToast("Graph query error: failed to fetch data."); From 87f492bdeb75384c6a79f73ca63ec31c8f9b7988 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 13 Sep 2024 17:02:54 +0530 Subject: [PATCH 2/2] refactor(web-devtools): update-example-env --- web-devtools/.env.local.example | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web-devtools/.env.local.example b/web-devtools/.env.local.example index 7e7efe9fa..437573466 100644 --- a/web-devtools/.env.local.example +++ b/web-devtools/.env.local.example @@ -1,5 +1,5 @@ # Do not enter sensitive information here. export NEXT_PUBLIC_ALCHEMY_API_KEY= export NEXT_PUBLIC_DEPLOYMENT=devnet -export NEXT_PUBLIC_CORE_SUBGRAPH=https://api.studio.thegraph.com/query/61738/kleros-v2-core-devnet/version/latest -export NEXT_PUBLIC_DRT_ARBSEPOLIA_SUBGRAPH=https://api.studio.thegraph.com/query/61738/kleros-v2-drt-arbisep-devnet/version/latest \ No newline at end of file +export CORE_SUBGRAPH=https://api.studio.thegraph.com/query/61738/kleros-v2-core-devnet/version/latest +export DRT_ARBSEPOLIA_SUBGRAPH=https://api.studio.thegraph.com/query/61738/kleros-v2-drt-arbisep-devnet/version/latest \ No newline at end of file