Fix error loading later on in the editor

Author: CompuIves

packages/app/src/app/components/CodeEditor/VSCode/index.tsx

@@ -504,13 +504,15 @@ class MonacoEditor extends React.Component<Props> implements Editor {
     this.currentTitle = newModule.title;
     this.currentDirectoryShortid = newModule.directoryShortid;
 
-    if (errors) {
-      this.setErrors(errors);
-    }
-
-    if (corrections) {
-      this.setCorrections(corrections);
-    }
+    // Let the model load first
+    setTimeout(() => {
+      if (errors) {
+        this.setErrors(errors);
+      }
+      if (corrections) {
+        this.setCorrections(corrections);
+      }
+    }, 100);
 
     if (this.props.onCodeReceived) {
       // Whenever the user changes a module we set up a state that defines

packages/app/src/app/store/modules/editor/actions.js

@@ -276,6 +276,16 @@ export function addCorrectionFromPreview({ state, props }) {
   state.push('editor.corrections', correction);
 }
 
+export function clearErrors({ state, props }) {
+  const currentErrors = state.get('editor.errors');
+
+  const newErrors = clearCorrectionsFromAction(currentErrors, props.action);
+
+  if (newErrors.length !== currentErrors.length) {
+    state.set('editor.errors', newErrors);
+  }
+}
+
 export function clearCorrections({ state, props }) {
   const currentCorrections = state.get('editor.corrections');
 

packages/app/src/app/store/modules/editor/sequences.js

@@ -297,6 +297,7 @@ export const handlePreviewAction = [
     ),
     'show-error': actions.addErrorFromPreview,
     'show-correction': actions.addCorrectionFromPreview,
+    'clear-errors': actions.clearErrors,
     'clear-corrections': actions.clearCorrections,
     'source.module.rename': [
       actions.consumeRenameModuleFromPreview,

packages/app/src/app/utils/corrections.ts

@@ -1,10 +1,13 @@
-import { ModuleCorrection } from '@codesandbox/common/lib/types';
+import { ModuleCorrection, ModuleError } from '@codesandbox/common/lib/types';
 import { CorrectionClearAction } from 'codesandbox-api/dist/types/actions/correction';
+import { ErrorClearAction } from 'codesandbox-api/dist/types/actions/error';
 
-export function clearCorrectionsFromAction(
-  currentCorrections: ModuleCorrection[],
-  action: CorrectionClearAction
-) {
+export function clearCorrectionsFromAction<
+  T extends ModuleCorrection | ModuleError
+>(
+  currentCorrections: T[],
+  action: CorrectionClearAction | ErrorClearAction
+): T[] {
   if (action.path === '*') {
     return currentCorrections.filter(cor => cor.source !== action.source);
   }

packages/common/src/types.ts

@@ -10,6 +10,7 @@ export type ModuleError = {
   severity: 'error' | 'warning';
   type: 'compile' | 'dependency-not-found' | 'no-dom-change';
   payload: Object;
+  source: string | undefined;
 };
 
 export type ModuleCorrection = {