passing in custom storage to keep storage separate per tab

skevy · Oct 2, 2015 · 1e4700b · tinnou · Jan 11, 2016 · 1e4700b
1 parent 93fbe54
commit 1e4700b
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/app/components/App.js b/app/components/App.js
@@ -252,7 +252,7 @@ export default class App extends React.Component {
           }
           <GraphiQL
             key={currentTabKey + currentTab.endpoint + JSON.stringify(currentTab.headers)}
-            storageKeyPrefix={`graphiql:${currentTabKey}`}
+            storage={getStorage(`graphiql:${currentTabKey}`)}
             fetcher={this.graphQLFetcher} />
         </div>
       </div>
@@ -296,3 +296,19 @@ export default class App extends React.Component {
     );
   }
 }
+
+const _storages = {};
+
+function _makeStorage(storageKey) {
+  return {
+    setItem: (key, val) => window.localStorage.setItem(`${storageKey}${key}`, val),
+    getItem: (key) => window.localStorage.getItem(`${storageKey}${key}`)
+  };
+}
+
+function getStorage(storageKey) {
+  if (!_storages[storageKey]) {
+    _storages[storageKey] = _makeStorage(storageKey);
+  }
+  return _storages[storageKey];
+}
diff --git a/package.json b/package.json
@@ -20,7 +20,7 @@
     "url": "https://github.com/skevy/graphiql-app/issues"
   },
   "dependencies": {
-    "graphiql": "^0.3.0",
+    "graphiql": "skevy/graphiql#redbox",
     "graphql": "^0.4.7",
     "isomorphic-fetch": "^2.1.1",
     "lodash": "^3.10.1",