Added graphql

src/lib/graphql/apollo.ts

@@ -0,0 +1,59 @@
+import { IncomingMessage, ServerResponse } from 'http'
+import { useMemo } from 'react'
+import {
+  ApolloClient,
+  InMemoryCache,
+  NormalizedCacheObject,
+} from '@apollo/client'
+
+let apolloClient: ApolloClient<NormalizedCacheObject> | undefined
+
+export type ResolverContext = {
+  req?: IncomingMessage
+  res?: ServerResponse
+}
+
+function createIsomorphLink(_: ResolverContext = {}) {
+  if (typeof window === 'undefined') {
+  } else {
+    const { HttpLink } = require('@apollo/client')
+    return new HttpLink({
+      uri: 'http://127.0.0.1:3001/',
+      credentials: 'same-origin',
+    })
+  }
+}
+
+function createApolloClient(context?: ResolverContext) {
+  return new ApolloClient({
+    ssrMode: typeof window === 'undefined',
+    link: createIsomorphLink(context),
+    cache: new InMemoryCache(),
+  })
+}
+
+export function initializeApollo(
+  initialState: any = null,
+  // Pages with Next.js data fetching methods, like `getStaticProps`, can send
+  // a custom context which will be used by `SchemaLink` to server render pages
+  context?: ResolverContext
+) {
+  const _apolloClient = apolloClient ?? createApolloClient(context)
+
+  // If your page has Next.js data fetching methods that use Apollo Client, the initial state
+  // get hydrated here
+  if (initialState) {
+    _apolloClient.cache.restore(initialState)
+  }
+  // For SSG and SSR always create a new Apollo Client
+  if (typeof window === 'undefined') return _apolloClient
+  // Create the Apollo Client once in the client
+  if (!apolloClient) apolloClient = _apolloClient
+
+  return _apolloClient
+}
+
+export function useApollo(initialState: any) {
+  const store = useMemo(() => initializeApollo(initialState), [initialState])
+  return store
+}

src/lib/graphql/documents/getUpcoming.graphql

@@ -0,0 +1,5 @@
+query GetUpcoming {
+  getUpcoming {
+    name
+  }
+}

src/lib/graphql/generated.ts

@@ -0,0 +1,80 @@
+import { gql } from '@apollo/client';
+import * as Apollo from '@apollo/client';
+export type Maybe<T> = T | null;
+export type InputMaybe<T> = Maybe<T>;
+export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
+export type MakeOptional<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]?: Maybe<T[SubKey]> };
+export type MakeMaybe<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]: Maybe<T[SubKey]> };
+const defaultOptions = {} as const;
+/** All built-in and custom scalars, mapped to their actual values */
+export type Scalars = {
+  ID: string;
+  String: string;
+  Boolean: boolean;
+  Int: number;
+  Float: number;
+};
+
+export type Event = {
+  __typename?: 'Event';
+  date: EventDate;
+  description?: Maybe<Array<Scalars['String']>>;
+  id: Scalars['String'];
+  location?: Maybe<Scalars['String']>;
+  name: Scalars['String'];
+};
+
+export type EventDate = {
+  __typename?: 'EventDate';
+  day: Scalars['Int'];
+  hour: Scalars['Int'];
+  minute: Scalars['Int'];
+  month: Scalars['Int'];
+  year: Scalars['Int'];
+};
+
+export type QueryRoot = {
+  __typename?: 'QueryRoot';
+  getUpcoming: Array<Event>;
+};
+
+export type GetUpcomingQueryVariables = Exact<{ [key: string]: never; }>;
+
+
+export type GetUpcomingQuery = { __typename?: 'QueryRoot', getUpcoming: Array<{ __typename?: 'Event', name: string }> };
+
+
+export const GetUpcomingDocument = gql`
+    query GetUpcoming {
+  getUpcoming {
+    name
+  }
+}
+    `;
+
+/**
+ * __useGetUpcomingQuery__
+ *
+ * To run a query within a React component, call `useGetUpcomingQuery` and pass it any options that fit your needs.
+ * When your component renders, `useGetUpcomingQuery` returns an object from Apollo Client that contains loading, error, and data properties
+ * you can use to render your UI.
+ *
+ * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
+ *
+ * @example
+ * const { data, loading, error } = useGetUpcomingQuery({
+ *   variables: {
+ *   },
+ * });
+ */
+export function useGetUpcomingQuery(baseOptions?: Apollo.QueryHookOptions<GetUpcomingQuery, GetUpcomingQueryVariables>) {
+        const options = {...defaultOptions, ...baseOptions}
+        return Apollo.useQuery<GetUpcomingQuery, GetUpcomingQueryVariables>(GetUpcomingDocument, options);
+      }
+export function useGetUpcomingLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<GetUpcomingQuery, GetUpcomingQueryVariables>) {
+          const options = {...defaultOptions, ...baseOptions}
+          return Apollo.useLazyQuery<GetUpcomingQuery, GetUpcomingQueryVariables>(GetUpcomingDocument, options);
+        }
+export type GetUpcomingQueryHookResult = ReturnType<typeof useGetUpcomingQuery>;
+export type GetUpcomingLazyQueryHookResult = ReturnType<typeof useGetUpcomingLazyQuery>;
+export type GetUpcomingQueryResult = Apollo.QueryResult<GetUpcomingQuery, GetUpcomingQueryVariables>;