From b989c2ed9f974395d0fe3738d67e32fc76ccb2c9 Mon Sep 17 00:00:00 2001
From: Leon Aves <leon@fiit.tv>
Date: Fri, 14 Sep 2018 17:34:19 +0100
Subject: [PATCH] Fix MiddlewareApp never properly applying settings passed as
 props.

---
 .../src/components/MiddlewareApp.tsx                      | 8 ++++++++
 .../src/components/PlaygroundWrapper.tsx                  | 2 +-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/graphql-playground-react/src/components/MiddlewareApp.tsx b/packages/graphql-playground-react/src/components/MiddlewareApp.tsx
index 7edf74845..febd492c1 100644
--- a/packages/graphql-playground-react/src/components/MiddlewareApp.tsx
+++ b/packages/graphql-playground-react/src/components/MiddlewareApp.tsx
@@ -1,6 +1,8 @@
 import * as React from 'react'
 import { Provider } from 'react-redux'
 import createStore from '../state/createStore'
+import { getSettings } from '../state/workspace/reducers'
+import { setSettingsString } from '../state/general/actions'
 import PlaygroundWrapper, { PlaygroundWrapperProps } from './PlaygroundWrapper'
 
 const store = createStore()
@@ -8,6 +10,12 @@ const store = createStore()
 export default class MiddlewareApp extends React.Component<
   PlaygroundWrapperProps
 > {
+  componentDidMount() {
+    const initialSettings = getSettings(store.getState())
+    const mergedSettings = { ...initialSettings, ...this.props.settings }
+    const settingsString = JSON.stringify(mergedSettings, null, 2)
+    store.dispatch(setSettingsString(settingsString))
+  }
   render() {
     return (
       <Provider store={store}>
diff --git a/packages/graphql-playground-react/src/components/PlaygroundWrapper.tsx b/packages/graphql-playground-react/src/components/PlaygroundWrapper.tsx
index 9d4c2f3f9..297658820 100644
--- a/packages/graphql-playground-react/src/components/PlaygroundWrapper.tsx
+++ b/packages/graphql-playground-react/src/components/PlaygroundWrapper.tsx
@@ -522,7 +522,7 @@ class PlaygroundWrapper extends React.Component<
 
 const mapStateToProps = (state, ownProps) => {
   const theme = ownProps.theme || getTheme(state, ownProps.settings)
-  const settings = ownProps.settings || getSettings(state)
+  const settings = getSettings(state)
   return { theme, settings }
 }