Reload schema on environment change

packages/altair-app/src/app/modules/altair/components/environment-manager/environment-manager.component.html

@@ -28,7 +28,7 @@
                 (click)="selectEnvironment('base')"
                 [ngClass]="{
                   'environment-manager__list-item--selected':
-                    selectedEnvironmentId === 'base'
+                    selectedEnvironmentId === 'base',
                 }"
               >
                 {{ 'BASE_ENVIRONMENT_TEXT' | translate }}
@@ -56,7 +56,7 @@
                       (dblclick)="setFocusOnEnvironmentTitle()"
                       [ngClass]="{
                         'environment-manager__list-item--selected':
-                          selectedEnvironmentId === item.id
+                          selectedEnvironmentId === item.id,
                       }"
                     >
                       <app-icon name="more-vertical"></app-icon>
@@ -101,7 +101,11 @@
                 <div class="environment-manager__editor-meta-actions">
                   <button
                     class="btn btn--small"
-                    (click)="exportEnvironmentChange.emit(selectedEnvironment)"
+                    (click)="
+                      exportEnvironmentChange.emit(
+                        getExportedEnvironment(selectedEnvironment)
+                      )
+                    "
                   >
                     <app-icon name="file-down"></app-icon>
                     {{ 'EXPORT_TEXT' | translate }}

packages/altair-app/src/app/modules/altair/components/environment-manager/environment-manager.component.ts

@@ -11,6 +11,7 @@ import {
 } from '@angular/core';
 
 import {
+  BaseEnvironmentState,
   EnvironmentsState,
   EnvironmentState,
 } from 'altair-graphql-core/build/types/state/environments.interfaces';
@@ -43,7 +44,7 @@ export class EnvironmentManagerComponent implements OnInit, OnChanges {
   editorExtensions: Extension[] = [json(), linter(jsonParseLinter())];
 
   selectedEnvironmentId = 'base';
-  selectedEnvironment?: EnvironmentState;
+  selectedEnvironment?: EnvironmentState | BaseEnvironmentState;
   editorContent = '{}';
   editorTitle = '';
 
@@ -117,8 +118,22 @@ export class EnvironmentManagerComponent implements OnInit, OnChanges {
 
     if (this.selectedEnvironment) {
       this.editorContent = this.selectedEnvironment.variablesJson;
-      this.editorTitle = this.selectedEnvironment.title;
+      if ('title' in this.selectedEnvironment) {
+        this.editorTitle = this.selectedEnvironment.title;
+      }
+    }
+  }
+
+  getExportedEnvironment(
+    environment?: BaseEnvironmentState | EnvironmentState
+  ): EnvironmentState | undefined {
+    if (!environment) {
+      return;
     }
+    return {
+      title: 'Environment',
+      ...environment,
+    };
   }
 
   setFocusOnEnvironmentTitle() {

packages/altair-app/src/app/modules/altair/containers/window/window.component.spec.ts

@@ -43,6 +43,12 @@ describe('WindowComponent', () => {
         activeCollection: undefined,
         list: [],
       },
+      environments: {
+        base: {
+          variablesJson: '{}',
+        },
+        subEnvironments: [],
+      },
     });
     const providers = [
       {

packages/altair-app/src/app/modules/altair/containers/window/window.component.ts

@@ -8,7 +8,7 @@ import {
   withLatestFrom,
 } from 'rxjs/operators';
 import { Component, Input, OnInit } from '@angular/core';
-import { Store, select } from '@ngrx/store';
+import { Store, createSelector, select } from '@ngrx/store';
 
 import * as fromRoot from '../../store';
 
@@ -329,6 +329,28 @@ export class WindowComponent implements OnInit {
         }
       });
 
+    // Reload the schema when the environment changes
+    this.store
+      .select(
+        createSelector(
+          fromRoot.getActiveSubEnvironmentState,
+          (state) => state.settings['schema.reload.onEnvChange'],
+          (activeEnvironment, reloadOnChange) => {
+            if (reloadOnChange) {
+              return activeEnvironment;
+            }
+
+            return null;
+          }
+        )
+      )
+      .pipe(untilDestroyed(this))
+      .subscribe((dt) => {
+        if (dt !== null) {
+          this.reloadDocs();
+        }
+      });
+
     this.windowService.setupWindow(this.windowId);
   }
 

packages/altair-app/src/app/modules/altair/store/environments/environments.reducer.ts

@@ -2,11 +2,23 @@ import { v4 as uuid } from 'uuid';
 import { getAltairConfig } from 'altair-graphql-core/build/config';
 import {
   EnvironmentsState,
+  BaseEnvironmentState,
   EnvironmentState,
 } from 'altair-graphql-core/build/types/state/environments.interfaces';
 import * as environmentsAction from './environments.action';
 import { AllActions } from '../action';
 
+export const getInitialBaseEnvironmentState = (): BaseEnvironmentState => {
+  const {
+    initialData: { environments },
+  } = getAltairConfig();
+
+  return {
+    variablesJson: JSON.stringify(
+      (environments.base && environments.base.variables) || {}
+    ),
+  };
+};
 export const getInitialEnvironmentState = (): EnvironmentState => {
   const {
     initialData: { environments },
@@ -39,11 +51,11 @@ const getInitialActiveSubEnvironment = (): string | undefined => {
     initialData: { environments },
   } = getAltairConfig();
   return environments.activeSubEnvironment;
-}
+};
 
 export const getInitialState = (): EnvironmentsState => {
   return {
-    base: getInitialEnvironmentState(),
+    base: getInitialBaseEnvironmentState(),
     subEnvironments: getInitialSubEnvironmentState(),
     activeSubEnvironment: getInitialActiveSubEnvironment(),
   };
@@ -65,11 +77,7 @@ export function environmentsReducer(
             title:
               action.payload.title ??
               `Environment ${state.subEnvironments.length + 1}`,
-            variablesJson: JSON.stringify(
-              action.payload.variables ?? {},
-              null,
-              2
-            ),
+            variablesJson: JSON.stringify(action.payload.variables ?? {}, null, 2),
           },
         ],
       };

packages/altair-core/src/types/state/environments.interfaces.ts

@@ -1,5 +1,10 @@
 import { IDictionary } from '../shared';
 
+export interface InitialBaseEnvironmentState {
+  id?: string;
+  title?: string;
+  variables?: IDictionary;
+}
 export interface InitialEnvironmentState {
   id?: string;
   title?: string;
@@ -8,10 +13,15 @@ export interface InitialEnvironmentState {
 
 export interface IInitialEnvironments {
   activeSubEnvironment?: string;
-  base?: InitialEnvironmentState;
+  base?: InitialBaseEnvironmentState;
   subEnvironments?: InitialEnvironmentState[];
 }
 
+export interface BaseEnvironmentState {
+  // Adding undefined for backward compatibility
+  id?: string;
+  variablesJson: string;
+}
 export interface EnvironmentState {
   // Adding undefined for backward compatibility
   id?: string;
@@ -24,13 +34,13 @@ export interface ExportEnvironmentState extends InitialEnvironmentState {
 }
 
 export interface EnvironmentsState {
-  base: EnvironmentState;
+  base: BaseEnvironmentState;
   subEnvironments: EnvironmentState[];
   // Adding undefined for backward compatibility
   activeSubEnvironment?: string;
 }
 
-export interface IEnvironment extends IDictionary<any> {
+export interface IEnvironment extends IDictionary {
   headers?: IDictionary<string>;
   accentColor?: string;
 }

packages/altair-core/src/types/state/settings.interfaces.ts

@@ -86,6 +86,11 @@ export interface SettingsState {
    */
   'schema.reloadOnStart'?: boolean;
 
+  /**
+   * Reload schema when switching environments
+   */
+  'schema.reload.onEnvChange'?: boolean;
+
   /**
    * Disable update notification
    */

test-server/package.json

@@ -42,5 +42,6 @@
     "nodemon": "^2.0.22",
     "ts-node": "^10.9.1",
     "typescript": "5.2.2"
-  }
+  },
+  "packageManager": "yarn@1.22.17"
 }