Add extensions to history

Author: dondonz

packages/graphiql-react/src/execution.tsx

@@ -192,7 +192,7 @@ export function ExecutionContextProvider({
     history?.addToHistory({
       query,
       variables: variablesString,
-      // dz todo when adding extensions to history
+      extensions: extensionsString,
       headers: headersString,
       operationName: opName,
     });

packages/graphiql-react/src/history/context.tsx

@@ -8,11 +8,12 @@ export type HistoryContextType = {
   /**
    * Add an operation to the history.
    * @param operation The operation that was executed, consisting of the query,
-   * variables, headers, and operation name.
+   * variables, extensions, headers, and operation name.
    */
   addToHistory(operation: {
     query?: string;
     variables?: string;
+    extensions?: string;
     headers?: string;
     operationName?: string;
   }): void;
@@ -29,6 +30,7 @@ export type HistoryContextType = {
     args: {
       query?: string;
       variables?: string;
+      extensions?: string;
       headers?: string;
       operationName?: string;
       label?: string;
@@ -50,6 +52,7 @@ export type HistoryContextType = {
   toggleFavorite(args: {
     query?: string;
     variables?: string;
+    extensions?: string;
     headers?: string;
     operationName?: string;
     label?: string;
@@ -58,7 +61,7 @@ export type HistoryContextType = {
   /**
    * Delete an operation from the history.
    * @param args The operation that was executed, consisting of the query,
-   * variables, headers, and operation name.
+   * variables, extensions, headers, and operation name.
    * @param clearFavorites This is only if you press the 'clear' button
    */
   deleteFromHistory(args: QueryStoreItem, clearFavorites?: boolean): void;

packages/graphiql-toolkit/src/storage/history.ts

@@ -28,6 +28,7 @@ export class HistoryStore {
   private shouldSaveQuery(
     query?: string,
     variables?: string,
+    extensions?: string,
     headers?: string,
     lastQuerySaved?: QueryStoreItem,
   ) {
@@ -71,13 +72,15 @@ export class HistoryStore {
   updateHistory = ({
     query,
     variables,
+    extensions,
     headers,
     operationName,
   }: QueryStoreItem) => {
     if (
       !this.shouldSaveQuery(
         query,
         variables,
+        extensions,
         headers,
         this.history.fetchRecent(),
       )
@@ -87,6 +90,7 @@ export class HistoryStore {
     this.history.push({
       query,
       variables,
+      extensions,
       headers,
       operationName,
     });
@@ -98,6 +102,7 @@ export class HistoryStore {
   toggleFavorite({
     query,
     variables,
+    extensions,
     headers,
     operationName,
     label,
@@ -106,6 +111,7 @@ export class HistoryStore {
     const item: QueryStoreItem = {
       query,
       variables,
+      extensions,
       headers,
       operationName,
       label,
@@ -126,6 +132,7 @@ export class HistoryStore {
     {
       query,
       variables,
+      extensions,
       headers,
       operationName,
       label,
@@ -136,6 +143,7 @@ export class HistoryStore {
     const item = {
       query,
       variables,
+      extensions,
       headers,
       operationName,
       label,
@@ -149,14 +157,15 @@ export class HistoryStore {
   }
 
   deleteHistory = (
-    { query, variables, headers, operationName, favorite }: QueryStoreItem,
+    { query, variables, extensions, headers, operationName, favorite }: QueryStoreItem,
     clearFavorites = false,
   ) => {
     function deleteFromStore(store: QueryStore) {
       const found = store.items.find(
         x =>
           x.query === query &&
           x.variables === variables &&
+          x.extensions === extensions &&
           x.headers === headers &&
           x.operationName === operationName,
       );

packages/graphiql-toolkit/src/storage/query.ts

@@ -3,6 +3,7 @@ import { StorageAPI } from './base';
 export type QueryStoreItem = {
   query?: string;
   variables?: string;
+  extensions?: string;
   headers?: string;
   operationName?: string;
   label?: string;
@@ -29,6 +30,7 @@ export class QueryStore {
       x =>
         x.query === item.query &&
         x.variables === item.variables &&
+        x.extensions === item.extensions &&
         x.headers === item.headers &&
         x.operationName === item.operationName,
     );
@@ -40,6 +42,7 @@ export class QueryStore {
       if (
         found.query === item.query &&
         found.variables === item.variables &&
+        found.extensions === item.extensions &&
         found.headers === item.headers &&
         found.operationName === item.operationName
       ) {
@@ -53,6 +56,7 @@ export class QueryStore {
       x =>
         x.query === item.query &&
         x.variables === item.variables &&
+        x.extensions === item.extensions &&
         x.headers === item.headers &&
         x.operationName === item.operationName,
     );
@@ -67,6 +71,7 @@ export class QueryStore {
       x =>
         x.query === item.query &&
         x.variables === item.variables &&
+        x.extensions === item.extensions &&
         x.headers === item.headers &&
         x.operationName === item.operationName,
     );