diff --git a/apps/web/package.json b/apps/web/package.json index 3f558a2..01478cb 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -3,10 +3,9 @@ "version": "0.1.0", "private": true, "scripts": { - "dev": "next dev", + "dev": "concurrently \"next dev\" \"pnpm watch\"", "prebuild": "pnpm compile", "build": "next build", - "predev": "pnpm watch", "start": "next start", "lint": "next lint", "compile": "env-cmd graphql-codegen", @@ -36,6 +35,7 @@ "@types/react": "^18", "@types/react-dom": "^18", "autoprefixer": "^10.0.1", + "concurrently": "^8.2.0", "eslint": "^8", "eslint-config-next": "14.0.3", "postcss": "^8", diff --git a/apps/web/src/app/layout.tsx b/apps/web/src/app/layout.tsx index d1d91e8..23f666b 100644 --- a/apps/web/src/app/layout.tsx +++ b/apps/web/src/app/layout.tsx @@ -1,12 +1,7 @@ import type { Metadata } from "next" import "./globals.css" import { GeistSans } from "geist/font/sans" -import { ApolloClient, ApolloProvider, InMemoryCache } from "@apollo/client" - -const apolloClient = new ApolloClient({ - uri: process.env.NEXT_PUBLIC_BEATFORGE_API_URL, - cache: new InMemoryCache(), -}) +import ApolloProvider from "@beatforge/web/app/mods/ApolloProvider" export const metadata: Metadata = { title: "BeatForge", @@ -19,7 +14,7 @@ export default function RootLayout({ }) { return ( - + {children} diff --git a/apps/web/src/app/mods/ApolloProvider.tsx b/apps/web/src/app/mods/ApolloProvider.tsx new file mode 100644 index 0000000..43ac421 --- /dev/null +++ b/apps/web/src/app/mods/ApolloProvider.tsx @@ -0,0 +1,21 @@ +"use client" + +import { + ApolloClient, + InMemoryCache, + ApolloProvider as _ApolloProvider, +} from "@apollo/client" +import { PropsWithChildren } from "react" + +const apolloClient = new ApolloClient({ + uri: `${process.env.NEXT_PUBLIC_BEATFORGE_API_URL}/graphql`, + cache: new InMemoryCache(), +}) + +const ApolloProvider = (props: PropsWithChildren) => { + return ( + <_ApolloProvider client={apolloClient}>{props.children} + ) +} + +export default ApolloProvider diff --git a/apps/web/src/app/mods/page.tsx b/apps/web/src/app/mods/page.tsx new file mode 100644 index 0000000..c5477d2 --- /dev/null +++ b/apps/web/src/app/mods/page.tsx @@ -0,0 +1,25 @@ +"use client" + +import { gql } from "@beatforge/web/__generated__" +import { useQuery } from "@apollo/client" + +const getModsQuery = gql(/* GraphQL */ ` + query GetMods { + mods { + name + id + } + } +`) + +const Mods = () => { + const { data, error } = useQuery(getModsQuery) + return ( +
+

Mods

+ 
{JSON.stringify(data, null, 2)}
+
+ ) +} + +export default Mods diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7fd1960..26cfb74 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -260,6 +260,9 @@ importers: autoprefixer: specifier: ^10.0.1 version: 10.4.15(postcss@8.4.31) + concurrently: + specifier: ^8.2.0 + version: 8.2.0 eslint: specifier: ^8 version: 8.47.0