add apollo and graph

ceeriil · Mar 24, 2024 · 00b041b · 00b041b
1 parent f16742f
commit 00b041b
Show file tree

Hide file tree

Showing 4 changed files with 86 additions and 13 deletions.
diff --git a/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx b/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx
@@ -1,6 +1,7 @@
 "use client";
 
 import { useEffect, useState } from "react";
+import { ApolloClient, ApolloProvider, InMemoryCache } from "@apollo/client";
 import { RainbowKitProvider, darkTheme, lightTheme } from "@rainbow-me/rainbowkit";
 import { useTheme } from "next-themes";
 import { Toaster } from "react-hot-toast";
@@ -45,16 +46,24 @@ export const ScaffoldEthAppWithProviders = ({ children }: { children: React.Reac
     setMounted(true);
   }, []);
 
+  const subgraphUri = "http://localhost:8000/subgraphs/name/loogie/graphql";
+  const apolloClient = new ApolloClient({
+    uri: subgraphUri,
+    cache: new InMemoryCache(),
+  });
+
   return (
-    <WagmiConfig config={wagmiConfig}>
-      <ProgressBar />
-      <RainbowKitProvider
-        chains={appChains.chains}
-        avatar={BlockieAvatar}
-        theme={mounted ? (isDarkMode ? darkTheme() : lightTheme()) : lightTheme()}
-      >
-        <ScaffoldEthApp>{children}</ScaffoldEthApp>
-      </RainbowKitProvider>
-    </WagmiConfig>
+    <ApolloProvider client={apolloClient}>
+      <WagmiConfig config={wagmiConfig}>
+        <ProgressBar />
+        <RainbowKitProvider
+          chains={appChains.chains}
+          avatar={BlockieAvatar}
+          theme={mounted ? (isDarkMode ? darkTheme() : lightTheme()) : lightTheme()}
+        >
+          <ScaffoldEthApp>{children}</ScaffoldEthApp>
+        </RainbowKitProvider>
+      </WagmiConfig>
+    </ApolloProvider>
   );
 };
diff --git a/packages/nextjs/contracts/deployedContracts.ts b/packages/nextjs/contracts/deployedContracts.ts
@@ -70,6 +70,37 @@ const deployedContracts = {
           name: "ApprovalForAll",
           type: "event",
         },
+        {
+          anonymous: false,
+          inputs: [
+            {
+              indexed: true,
+              internalType: "uint256",
+              name: "tokenId",
+              type: "uint256",
+            },
+            {
+              indexed: false,
+              internalType: "bytes3",
+              name: "color",
+              type: "bytes3",
+            },
+            {
+              indexed: false,
+              internalType: "uint256",
+              name: "chubbiness",
+              type: "uint256",
+            },
+            {
+              indexed: false,
+              internalType: "uint256",
+              name: "mouthLength",
+              type: "uint256",
+            },
+          ],
+          name: "LoogieCreated",
+          type: "event",
+        },
         {
           anonymous: false,
           inputs: [
@@ -1340,7 +1371,7 @@ const deployedContracts = {
   },
   11155111: {
     Loogie: {
-      address: "0xfC6B3408B12A9c1306c86759A289e41aB6e456d5",
+      address: "0x83296AFF01553E6386fAe17d50118E0659f82678",
       abi: [
         {
           inputs: [
@@ -1403,6 +1434,37 @@ const deployedContracts = {
           name: "ApprovalForAll",
           type: "event",
         },
+        {
+          anonymous: false,
+          inputs: [
+            {
+              indexed: true,
+              internalType: "uint256",
+              name: "tokenId",
+              type: "uint256",
+            },
+            {
+              indexed: false,
+              internalType: "bytes3",
+              name: "color",
+              type: "bytes3",
+            },
+            {
+              indexed: false,
+              internalType: "uint256",
+              name: "chubbiness",
+              type: "uint256",
+            },
+            {
+              indexed: false,
+              internalType: "uint256",
+              name: "mouthLength",
+              type: "uint256",
+            },
+          ],
+          name: "LoogieCreated",
+          type: "event",
+        },
         {
           anonymous: false,
           inputs: [
@@ -1972,7 +2034,7 @@ const deployedContracts = {
       },
     },
     LoogieAuction: {
-      address: "0xAaf9f3DF2da0BD047872a57659e49a75045318B8",
+      address: "0x210b3B8cc13720cCbb8208Ab4d328Ff488E49112",
       abi: [
         {
           inputs: [

diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json
@@ -14,13 +14,15 @@
     "vercel:yolo": "vercel --build-env NEXT_PUBLIC_IGNORE_BUILD_ERROR=true"
   },
   "dependencies": {
+    "@apollo/client": "^3.9.9",
     "@ethersproject/providers": "^5.7.2",
     "@heroicons/react": "^2.0.11",
     "@rainbow-me/rainbowkit": "1.3.5",
     "@uniswap/sdk-core": "^4.0.1",
     "@uniswap/v2-sdk": "^3.0.1",
     "blo": "^1.0.1",
     "daisyui": "4.5.0",
+    "graphql": "^16.8.1",
     "next": "^14.0.4",
     "next-themes": "^0.2.1",
     "nprogress": "^0.2.0",

diff --git a/packages/nextjs/scaffold.config.ts b/packages/nextjs/scaffold.config.ts
@@ -11,7 +11,7 @@ export type ScaffoldConfig = {
 
 const scaffoldConfig = {
   // The networks on which your DApp is live
-  targetNetworks: [chains.sepolia],
+  targetNetworks: [chains.hardhat],
 
   // The interval at which your front-end polls the RPC servers for new data
   // it has no effect if you only target the local network (default is 4000)