create new plugin for doc viewer. cleanup

apps/docviewer/src/app/App.tsx

@@ -1,11 +1,26 @@
+import React, { useEffect, useState } from "react"
+import { DocViewer } from "./docviewer"
+
+const client = new DocViewer()
 
 export default function App() {
+  const [contents, setContents] = useState('')
+  useEffect(() => {
+    client.eventEmitter.on('contentsReady', (fileContents: string) => {
+      console.log('contentsReady', fileContents)
+      setContents(fileContents)
+    })
+
+  }, [])
   return (
     <>
       <h1>Documentation Viewer</h1>
       <p>
         Show documentation of compiled contracts.
       </p>
+      <p>
+        {contents && contents.length}
+      </p>
     </>
   )
 }

apps/docviewer/src/app/docviewer.ts

@@ -0,0 +1,39 @@
+import { PluginClient } from '@remixproject/plugin'
+import { createClient } from '@remixproject/plugin-webview'
+import EventEmitter from 'events'
+
+export class DocViewer extends PluginClient {
+  mdFile: string
+  fileContents: string
+  eventEmitter: EventEmitter
+  constructor() {
+    super()
+    this.eventEmitter = new EventEmitter()
+    this.methods = ['viewDocs']
+    createClient(this)
+    this.mdFile = ''
+    this.onload()
+  }
+
+  async setProperties() {
+    console.log('inside setProperties')
+    this.on('docgen' as any, 'docsGenerated', async (docs: string[]) => {
+      console.log('docsGenerated', docs)
+      this.mdFile = docs[0]
+      const contents = await this.call('fileManager', 'readFile', this.mdFile)
+      console.log({ contents })
+      this.fileContents = contents
+      this.eventEmitter.emit('docviewer', 'contentsReady', this.fileContents)
+    })
+  }
+
+  async viewDocs(docs: string[]) {
+    console.log('viewDocs', docs)
+    console.log('docsGenerated', docs)
+    this.mdFile = docs[0]
+    const contents = await this.call('fileManager', 'readFile', this.mdFile)
+    console.log({ contents })
+    this.fileContents = contents
+    this.eventEmitter.emit('contentsReady', contents)
+  }
+}

apps/remixdocgen/src/app/App.tsx

@@ -9,17 +9,6 @@ import { Build } from './docgen/site'
 
 export const client =  new DocGenClient()
 
-export const getNewContractNames = (compilationResult: CompilationResult) => {
-  const compiledContracts = compilationResult.contracts
-  let result: string[] = []
-
-  for (const file of Object.keys(compiledContracts)) {
-    const newContractNames = Object.keys(compiledContracts[file])
-    result = [...result, ...newContractNames]
-  }
-  return result
-}
-
 const App = () => {
   const [themeType, setThemeType] = useState<string>('dark');
   const [hasBuild, setHasBuild] = useState<boolean>(false);
@@ -47,7 +36,7 @@ const App = () => {
       <h1>Remix Docgen</h1>
       {fileName && <h2>File: {fileName}</h2>}
       {hasBuild && <button onClick={() => client.generateDocs()}>Generate doc</button>}
-      {hasBuild && <button onClick={() => client.viewDocs()}>Open docs</button>}
+      {hasBuild && <button onClick={() => client.opendDocs(client.docs)}>Open docs</button>}
     </div>
   )
 };

apps/remixdocgen/src/app/docgen-client.ts

@@ -12,11 +12,12 @@ export class DocGenClient extends PluginClient {
   private currentTheme
   public eventEmitter: EventEmitter
   private build: Build
+  public docs: string[] = []
   
   constructor() {
     super()
     this.eventEmitter = new EventEmitter()
-    this.methods = ['generateDocs', 'viewDocs']
+    this.methods = ['generateDocs', 'opendDocs']
     createClient(this)
     this.onload().then(async () => {
       console.log('docgen client loaded')
@@ -62,19 +63,22 @@ export class DocGenClient extends PluginClient {
       docs.push(id)
     }
     this.eventEmitter.emit('docsGenerated', docs)
+    this.emit('docgen' as any, 'docsGenerated', docs)
+    this.docs = docs
+    await this.opendDocs(docs)
   }
 
-  async opendDocs() {
+  async opendDocs(docs: string[]) {
     console.log('docgen client openDocs')
-    await this.call('manager', 'activatePlugin', 'docgenviewer')
-    await this.call('tabs' as any, 'focus', 'docgenviewer')
-    await this.call('docgenviewer' as any, 'viewDocs')
+    await this.call('manager', 'activatePlugin', 'docviewer')
+    await this.call('tabs' as any, 'focus', 'docviewer')
+    await this.call('docviewer' as any, 'viewDocs', docs)
   }
 
-  async viewDocs() {
-    console.log('docgen client viewDocs')
-    await this.opendDocs()
-  }
+  // async viewDocs() {
+  //   console.log('docgen client viewDocs')
+  //   await this.opendDocs()
+  // }
 
   async generateDocs() {
     console.log('docgen client generateDocs')