Added handleEditorRefresh to environment manager component

Closes #1212
altair-graphql · Mar 30, 2020 · d1b7a94 · d1b7a94
1 parent 435d363
commit d1b7a94
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 4 deletions.
diff --git a/packages/altair-app/src/app/components/environment-manager/environment-manager.component.ts b/packages/altair-app/src/app/components/environment-manager/environment-manager.component.ts
@@ -1,6 +1,18 @@
-import { Component, OnInit, Input, Output, EventEmitter, ViewChild, ElementRef } from '@angular/core';
+import {
+  Component,
+  OnInit,
+  Input,
+  Output,
+  EventEmitter,
+  ViewChild,
+  ElementRef,
+  DoCheck,
+  OnChanges,
+  SimpleChanges,
+} from '@angular/core';
 
 import * as fromEnvironments from '../../reducers/environments';
+import { handleEditorRefresh } from 'app/utils/codemirror/refresh-editor';
 
 // Import the codemirror packages
 import * as Codemirror from 'codemirror';
@@ -33,7 +45,7 @@ import 'codemirror/addon/lint/json-lint';
   templateUrl: './environment-manager.component.html',
   styleUrls: ['./environment-manager.component.scss']
 })
-export class EnvironmentManagerComponent implements OnInit {
+export class EnvironmentManagerComponent implements OnInit, DoCheck, OnChanges {
 
   @Input() environments: fromEnvironments.State;
   @Input() showEnvironmentManager = false;
@@ -44,6 +56,7 @@ export class EnvironmentManagerComponent implements OnInit {
   @Output() addSubEnvironmentChange = new EventEmitter();
   @Output() deleteSubEnvironmentChange = new EventEmitter();
 
+  @ViewChild('editor', { static: false }) editor: ElementRef & { codeMirror: CodeMirror.Editor };
   @ViewChild('subEnvironmentTitle', { static: false }) subEnvironmentTitleEl: ElementRef;
 
   jsonEditorConfig = {
@@ -75,6 +88,18 @@ export class EnvironmentManagerComponent implements OnInit {
     }
   }
 
+  ngDoCheck() {
+    handleEditorRefresh(this.editor && this.editor.codeMirror);
+  }
+
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes.showEnvironmentManager && changes.showEnvironmentManager.currentValue) {
+      setTimeout(() => {
+        handleEditorRefresh(this.editor && this.editor.codeMirror, true);
+      }, 300);
+    }
+  }
+
   onEditorChange(content: string) {
     try {
       JSON.parse(content);

diff --git a/packages/altair-app/src/app/utils/codemirror/refresh-editor.ts b/packages/altair-app/src/app/utils/codemirror/refresh-editor.ts
@@ -1,8 +1,12 @@
-export const handleEditorRefresh = (cm: any) => {
+export const handleEditorRefresh = (cm: any, forceUpdate = false) => {
   if (cm) {
+    if (forceUpdate) {
+      return cm.refresh();
+    }
+
     if (cm && cm.display.wrapper.offsetHeight) {
       if (cm.display.lastWrapHeight !== cm.display.wrapper.clientHeight) {
-        cm.refresh();
+        return cm.refresh();
       }
     }
   }