From 5d8f926b27db83b44fe4edfca0493fb6fdeda919 Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Tue, 14 Mar 2023 02:13:37 +0100
Subject: [PATCH] create new plugin for doc viewer. cleanup

---
 apps/docviewer/src/app/App.tsx            | 15 +++++++++
 apps/docviewer/src/app/docviewer.ts       | 39 +++++++++++++++++++++++
 apps/remixdocgen/src/app/App.tsx          | 13 +-------
 apps/remixdocgen/src/app/docgen-client.ts | 22 +++++++------
 4 files changed, 68 insertions(+), 21 deletions(-)
 create mode 100644 apps/docviewer/src/app/docviewer.ts

diff --git a/apps/docviewer/src/app/App.tsx b/apps/docviewer/src/app/App.tsx
index c99255bc0f..2c7785d4dc 100644
--- a/apps/docviewer/src/app/App.tsx
+++ b/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>
     </>
   )
 }
\ No newline at end of file
diff --git a/apps/docviewer/src/app/docviewer.ts b/apps/docviewer/src/app/docviewer.ts
new file mode 100644
index 0000000000..0a78fd3a54
--- /dev/null
+++ b/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)
+  }
+}
\ No newline at end of file
diff --git a/apps/remixdocgen/src/app/App.tsx b/apps/remixdocgen/src/app/App.tsx
index aae7d5f274..913b745e69 100644
--- a/apps/remixdocgen/src/app/App.tsx
+++ b/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>
   )
 };
diff --git a/apps/remixdocgen/src/app/docgen-client.ts b/apps/remixdocgen/src/app/docgen-client.ts
index 9af8d5fa0a..2dabacf6a7 100644
--- a/apps/remixdocgen/src/app/docgen-client.ts
+++ b/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')