fix multiple issues identified by @bunsentraat and @Aniket_Eng

apps/remix-ide/src/app/files/fileManager.ts

@@ -5,6 +5,7 @@ import Registry from '../state/registry'
 import { EventEmitter } from 'events'
 import { fileChangedToastMsg, recursivePasteToastMsg, storageFullMessage } from '@remix-ui/helper'
 import helper from '../../lib/helper.js'
+import { RemixAppManager } from '../../remixAppManager'
 
 /*
   attach to files event (removed renamed)
@@ -40,7 +41,7 @@ class FileManager extends Plugin {
   events: EventEmitter
   editor: any
   _components: any
-  appManager: any
+  appManager: RemixAppManager
   _deps: any
   getCurrentFile: () => any
   getFile: (path: any) => Promise<unknown>
@@ -622,13 +623,20 @@ class FileManager extends Plugin {
       file = resolved.file
       await this.saveCurrentFile()
       if (this.currentFile() === file) return
+      
       const provider = resolved.provider
       this._deps.config.set('currentFile', file)
       this.openedFiles[file] = file
 
       let content = ''
       try {
-        content = await provider.get(file)   
+        content = await provider.get(file)
+        if (file.split('.')[1].includes('svg')) {
+          if (!await this.appManager.isActive('solidityumlgen')) await this.appManager.activatePlugin('solidityumlgen')
+          provider.isReadOnly(file)
+          this.call('solidityumlgen', 'showUmlDiagram', content)
+          return
+        } 
       } catch (error) {
         console.log(error)
         throw error

apps/remix-ide/src/app/panels/tab-proxy.js

@@ -183,6 +183,7 @@ export class TabProxy extends Plugin {
   }
 
   focus (name) {
+    console.log('what switched tabs', name)
     this.emit('switchApp', name)
     this.tabsApi.activateTab(name)
   }

apps/remix-ide/src/app/plugins/solidity-umlgen.tsx

@@ -10,7 +10,7 @@ import { convertUmlClasses2Dot } from 'sol2uml/lib/converterClasses2Dot'
 import { convertAST2UmlClasses } from 'sol2uml/lib/converterAST2Classes'
 import vizRenderStringSync from '@aduh95/viz.js/sync'
 import { PluginViewWrapper } from '@remix-ui/helper'
-import { customAction, customActionType } from '@remixproject/plugin-api'
+import { customAction } from '@remixproject/plugin-api'
 const parser = (window as any).SolidityParser
 
 const profile = {
@@ -41,7 +41,23 @@ export class SolidityUmlGen extends ViewPlugin implements ISolidityUmlGen {
   }
 
   onActivation(): void {
-      this.amIActivated = true
+    if (this.currentFile.length < 1) 
+    this.on('solidity', 'compilationFinished', async (file, source, languageVersion, data, input, version) => {
+      let result = ''
+      try {
+        if (data.sources && Object.keys(data.sources).length > 1) { // we should flatten first as there are multiple asts
+          result = await this.flattenContract(source, this.currentFile, data)
+        }
+        const ast = result.length > 1 ? parser.parse(result) : parser.parse(source.sources[this.currentFile].content)
+        const payload = vizRenderStringSync(convertUmlClasses2Dot(convertAST2UmlClasses(ast, this.currentFile)))
+        const fileName = `${this.currentFile.split('/')[0]}/resources/${this.currentFile.split('/')[1].split('.')[0]}.svg`
+        await this.call('fileManager', 'writeFile', fileName, payload)
+        this.updatedSvg = payload
+        this.renderComponent()
+      } catch (error) {
+        console.log({ error })
+      }
+    })
   }
 
   onDeactivation(): void {
@@ -49,25 +65,13 @@ export class SolidityUmlGen extends ViewPlugin implements ISolidityUmlGen {
   }
 
   generateCustomAction = async (action: customAction) => {
+    this.currentFile = action.path[0]
     this.generateUml(action.path[0])
   }
 
   generateUml(currentFile: string) {
     this.call('solidity', 'compile', currentFile)
-    this.on('solidity', 'compilationFinished', async (file, source, languageVersion, data, input, version) => {
+    this.renderComponent()
-      let result = ''  
-      if (data.sources && Object.keys(data.sources).length > 1) { // we should flatten first as there are multiple asts
-          result = await this.flattenContract(source, currentFile, data)
-        }
-        const ast = result.length > 1 ? parser.parse(result) : parser.parse(source.sources[currentFile].content)
-        const payload = vizRenderStringSync(convertUmlClasses2Dot(convertAST2UmlClasses(ast, currentFile)))
-        const fileName = `${currentFile.split('/')[0]}/resources/${currentFile.split('/')[1].split('.')[0]}.svg`
-        await this.call('fileManager', 'writeFile', fileName, payload)
-        this.updatedSvg = payload //test
-        console.log({ payload })
-        this.renderComponent()
-        // await this.showUmlDiagram(fileName, payload)
-      })
   }
 
   /**
@@ -88,18 +92,8 @@ export class SolidityUmlGen extends ViewPlugin implements ISolidityUmlGen {
     return result
   }
 
-  async showUmlDiagram(path: string, svgPayload: string) {
+  async showUmlDiagram(svgPayload: string) {
-    if (!this.amIActivated) return
+    this.updatedSvg = svgPayload
-    if((!path && path.length < 1) || (svgPayload.length < 1 || !svgPayload.startsWith('<?xml'))) {
-      await this.call('notification', 'alert', {
-        id: 'solidityumlgenAlert',
-        message: 'Both file path and svg payload are required!'
-      })
-      return
-    } else {
-      this.currentFile = path
-      this.updatedSvg = svgPayload
-    }
     this.renderComponent()
   }
 

apps/remix-ide/src/remixAppManager.js

@@ -179,7 +179,7 @@ export class RemixAppManager extends PluginManager {
     await this.call('filePanel', 'registerContextMenuItem', {
       id: 'solidityumlgen',
       name: 'generateCustomAction',
-      label: 'generate UML',
+      label: 'Generate UML',
       type: [],
       extension: ['.sol'],
       path: [],

libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx

@@ -13,7 +13,6 @@ import { configFileContent } from './compilerConfiguration'
 import axios, { AxiosResponse } from 'axios'
 
 import './css/style.css'
-
 const defaultPath = "compiler_config.json"
 
 declare global {
@@ -22,7 +21,6 @@ declare global {
     _paq: any
   }
 }
-
 const _paq = window._paq = window._paq || [] //eslint-disable-line
 
 export const CompilerContainer = (props: CompilerContainerProps) => {

libs/remix-ui/solidity-uml-gen/src/lib/solidity-uml-gen.tsx

@@ -39,7 +39,6 @@ export function RemixUiSolidityUmlGen ({ plugin, updatedSvg }: RemixUiSolidityUm
 
 
   useEffect(() => {
-    console.log('updatedSvg updated') 
     setValidSvg (updatedSvg.startsWith('<?xml') && updatedSvg.includes('<svg')) 
     setShowViewer(updatedSvg.startsWith('<?xml') && updatedSvg.includes('<svg'))
   }
@@ -62,7 +61,7 @@ export function RemixUiSolidityUmlGen ({ plugin, updatedSvg }: RemixUiSolidityUm
       <div className="d-flex justify-center align-content-center">
         {/* <ActionButtons buttons={buttons}/> */}
       </div>
-      <div id="umlImageHolder" className="mx-2 my-3 ml-5">
+      <div id="umlImageHolder" className="mx-2 my-3 ml-5 w-100">
         { validSvg && showViewer ? (
           <TransformWrapper>
           <TransformComponent>