Contract source code: the code for the empty contract is not displaye… (#2569)

Contract source code: the code for the empty contract is not displayed because of a JS crash

Fixes #2568

ui/shared/monaco/CodeEditor.tsx

@@ -252,7 +252,7 @@ const CodeEditor = ({ data, remappings, libraries, language, mainFile, contractN
   }), [ editorWidth, themeColors, borderRadius ]);
 
   const renderErrorScreen = React.useCallback(() => {
-    return <Center bgColor={ themeColors['editor.background'] } w="100%" borderRadius="md">Oops! Something went wrong!</Center>;
+    return <Center bgColor={ themeColors['editor.background'] } w="100%" h="100%" borderRadius="md">Oops! Something went wrong!</Center>;
   }, [ themeColors ]);
 
   if (data.length === 1) {

ui/shared/monaco/utils/addMainContractCodeDecoration.ts

@@ -47,7 +47,7 @@ export default function addMainContractCodeDecoration(model: monaco.editor.IText
     .findMatches(`^\\}`, lastLineRange, true, false, null, true)
     .sort(sortByEndLineNumberAsc);
 
-  const restDecoration: monaco.editor.IModelDeltaDecoration = {
+  const restDecoration: monaco.editor.IModelDeltaDecoration | undefined = lastLineMatch ? {
     range: {
       startLineNumber: firstLineMatch.range.startLineNumber + 1,
       endLineNumber: lastLineMatch.range.startLineNumber,
@@ -59,8 +59,8 @@ export default function addMainContractCodeDecoration(model: monaco.editor.IText
       className: '.main-contract-body',
       marginClassName: '.main-contract-body',
     },
-  };
+  } : undefined;
 
   editor.updateOptions({ glyphMargin: true });
-  model.deltaDecorations([], [ firstLineDecoration, restDecoration ]);
+  model.deltaDecorations([], [ firstLineDecoration, restDecoration ].filter(Boolean));
 }