add general to top level

Author: timsuchanek

packages/graphql-playground-react/src/localDevIndex.tsx

@@ -15,8 +15,59 @@ if (process.env.NODE_ENV !== 'production') {
 ;(window as any)['GraphQLPlayground'] = {
   init(element: HTMLElement, options) {
     ReactDOM.render(
-      <MiddlewareApp setTitle={true} showNewWorkspace={false} {...options} />,
+      <MiddlewareApp
+        setTitle={true}
+        showNewWorkspace={false}
+        {...options}
+        config={config}
+        configString={configString}
+      />,
       element,
     )
   },
 }
+
+const configString = `projects:
+app:
+  schemaPath: "src/schema.graphql"
+  extensions:
+    endpoints:
+      default: "http://localhost:4000"
+database:
+  schemaPath: "src/generated/prisma.graphql"
+  extensions:
+    prisma: database/prisma.yml`
+
+const config = {
+  projects: {
+    app: {
+      schemaPath: 'src/schema.graphql',
+      includes: ['queries/{booking,queries}.graphql'],
+      extensions: {
+        endpoints: {
+          default: 'http://localhost:4000',
+        },
+      },
+    },
+    prisma: {
+      schemaPath: 'src/generated/prisma.graphql',
+      includes: ['database/seed.graphql'],
+      extensions: {
+        prisma: 'database/prisma.yml',
+        'prepare-binding': {
+          output: 'src/generated/prisma.ts',
+          generator: 'prisma-ts',
+        },
+        endpoints: {
+          dev: {
+            url: 'https://eu1.prisma.sh/tim2/prisma-airbnb-example/dev',
+            headers: {
+              Authorization:
+                'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjp7InNlcnZpY2UiOiJwcmlzbWEtYWlyYm5iLWV4YW1wbGVAZGV2Iiwicm9sZXMiOlsiYWRtaW4iXX0sImlhdCI6MTUyMjY4NDkzNiwiZXhwIjoxNTIzMjg5NzM2fQ.1wnkIJrAplDOznjEzLj8sQERL6dcAM0zjqxOGQBXGn0',
+            },
+          },
+        },
+      },
+    },
+  },
+}

packages/graphql-playground-react/src/state/general/selectors.ts

@@ -1,10 +1,6 @@
-import { createSelector } from 'reselect'
-import { getSelectedWorkspace } from '../workspace/reducers'
-
-const makeGeneralSelector = key =>
-  createSelector([getSelectedWorkspace], state => {
-    return state.general.get(key)
-  })
+const makeGeneralSelector = key => state => {
+  return state.general.get(key)
+}
 
 export const getFixedEndpoint = makeGeneralSelector('fixedEndpoint')
 export const getHistoryOpen = makeGeneralSelector('historyOpen')

packages/graphql-playground-react/src/state/sessions/actions.ts

@@ -26,6 +26,7 @@ export const {
   openSettingsTab,
   schemaFetchingSuccess,
   schemaFetchingError,
+  setEndpointUnreachable,
   renewStacks,
   runQuery,
   prettifyQuery,
@@ -122,6 +123,7 @@ export const {
 
   FETCH_SCHEMA: simpleAction(),
   REFETCH_SCHEMA: simpleAction(),
+  SET_ENDPOINT_UNREACHABLE: simpleAction('endpoint'),
   SCHEMA_FETCHING_SUCCESS: (endpoint, tracingSupported) => ({
     endpoint,
     tracingSupported,

packages/graphql-playground-react/src/state/sessions/fetchingSagas.ts

@@ -22,6 +22,7 @@ import {
   setResponseExtensions,
   setCurrentQueryStartTime,
   setCurrentQueryEndTime,
+  setEndpointUnreachable,
 } from './actions'
 import {
   getSelectedSession,
@@ -186,6 +187,10 @@ function* runQuerySaga(action) {
         time: new Date(),
         resultID: cuid(),
       })
+      const errorMessage = extractMessage(error)
+      if (errorMessage === 'Failed to fetch') {
+        yield put(setEndpointUnreachable(session.endpoint))
+      }
       yield put(addResponse(selectedWorkspaceId, session.id, response))
       yield put(addHistoryItem(session))
     }

packages/graphql-playground-react/src/state/sessions/reducers.ts

@@ -299,6 +299,19 @@ const reducer = handleActions(
         })
       return state.set('sessions', newSessions)
     },
+    SET_ENDPOINT_UNREACHABLE: (state, { payload }) => {
+      const newSessions = state.get('sessions').map((session, sessionId) => {
+        if (session.get('endpoint') === payload.endpoint) {
+          return session.merge(
+            Map({
+              endpointUnreachable: true,
+            }),
+          )
+        }
+        return session
+      })
+      return state.set('sessions', newSessions)
+    },
     SCHEMA_FETCHING_ERROR: (state, { payload }) => {
       const newSessions = state.get('sessions').map((session, sessionId) => {
         if (session.get('endpoint') === payload.endpoint) {

packages/graphql-playground-react/src/state/workspace/deserialize.ts

@@ -13,6 +13,7 @@ export function deserializePersistedState(state) {
     selectedWorkspace: state.selectedWorkspace,
     settingsString: state.settingsString,
     appHistory: deserializeAppHistory(state.appHistory),
+    general: deserializeGeneral(state.general),
   }) as any
 }
 
@@ -24,7 +25,6 @@ function deserializeWorkspaces(workspaces) {
         sessions: deserializeSessionsState(workspace.sessions),
         sharing: deserializeSharing(workspace.sharing),
         history: deserializeHistory(workspace.history),
-        general: deserializeGeneral(workspace.general),
       })
     }),
   )

packages/graphql-playground-react/src/state/workspace/reducers.ts

@@ -25,13 +25,11 @@ export class Workspace extends Record({
   sessions: makeSessionState(''),
   sharing: new SharingState(),
   history: OrderedMap(),
-  general: new GeneralState(),
 }) {
   docs: DocsState
   sessions: SessionState
   sharing: SharingState
   history: HistoryState
-  general: GeneralState
 }
 
 export const defaultSettings = {
@@ -48,6 +46,7 @@ export const RootState = Record<any>({
   settingsString: JSON.stringify(defaultSettings, null, 2),
   stateInjected: false,
   appHistory: new AppHistory(),
+  general: new GeneralState(),
 })
 
 const workspaceReducers: Reducer<any> = combineReducers({
@@ -91,6 +90,16 @@ export const rootReducer = (state = new RootState(), action) => {
   if (action.type === 'SELECT_APP_HISTORY_ITEM') {
     return state.set('appHistory', appHistory(state.appHistory, action))
   }
+  const generalActions = {
+    OPEN_HISTORY: true,
+    CLOSE_HISTORY: true,
+    SET_ENDPOINT_DISABLED: true,
+    SET_CONFIG_STRING: true,
+  }
+
+  if (generalActions[action.type]) {
+    return state.set('general', general(state.general, action))
+  }
 
   const selectedWorkspaceId =
     action.payload && action.payload.workspaceId
@@ -113,7 +122,6 @@ export function makeWorkspace(endpoint) {
     sessions: sessionState,
     sharing: new SharingState(),
     history: OrderedMap(),
-    general: new GeneralState(),
   }) as any
 }