Skip to content

Commit ec1b8f9

Browse files
ioedeveloperyann300
authored andcommitted
Merge pull request #668 from ethereum/file-explorer
File explorer
2 parents 1f6c4ab + e001bfb commit ec1b8f9

File tree

88 files changed

+2992
-1076
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+2992
-1076
lines changed

apps/debugger/.babelrc

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"presets": ["@nrwl/react/babel"],
3+
"plugins": []
4+
}

apps/debugger/.browserslistrc

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# This file is used by:
2+
# 1. autoprefixer to adjust CSS to support the below specified browsers
3+
# 2. babel preset-env to adjust included polyfills
4+
#
5+
# For additional information regarding the format and rule options, please see:
6+
# https://github.com/browserslist/browserslist#queries
7+
#
8+
# If you need to support different browsers in production, you may tweak the list below.
9+
10+
last 1 Chrome version
11+
last 1 Firefox version
12+
last 2 Edge major versions
13+
last 2 Safari major version
14+
last 2 iOS major versions
15+
Firefox ESR
16+
not IE 9-11 # For IE 9-11 support, remove 'not'.

apps/debugger/src/app/app.tsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React, { useState, useEffect } from 'react';
2+
3+
import { DebuggerUI } from '@remix-ui/debugger-ui' // eslint-disable-line
4+
5+
import { DebuggerClientApi } from './debugger'
6+
7+
const remix = new DebuggerClientApi()
8+
9+
export const App = () => {
10+
return (
11+
<div className="debugger">
12+
<DebuggerUI debuggerAPI={remix} />
13+
</div>
14+
);
15+
};
16+
17+
export default App;
Lines changed: 157 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,157 @@
1+
import Web3 from 'web3'
2+
import remixDebug, { TransactionDebugger as Debugger } from '@remix-project/remix-debug'
3+
import { CompilationOutput, Sources } from '@remix-ui/debugger-ui'
4+
import type { CompilationResult } from '@remix-project/remix-solidity-ts'
5+
6+
export const DebuggerApiMixin = (Base) => class extends Base {
7+
initDebuggerApi () {
8+
this.debugHash = null
9+
10+
const self = this
11+
this.web3Provider = {
12+
sendAsync(payload, callback) {
13+
self.call('web3Provider', 'sendAsync', payload)
14+
.then(result => callback(null, result))
15+
.catch(e => callback(e))
16+
}
17+
}
18+
this._web3 = new Web3(this.web3Provider)
19+
20+
this.offsetToLineColumnConverter = {
21+
async offsetToLineColumn (rawLocation, file, sources, asts) {
22+
return await self.call('offsetToLineColumnConverter', 'offsetToLineColumn', rawLocation, file, sources, asts)
23+
}
24+
}
25+
}
26+
27+
// on()
28+
// call()
29+
// onDebugRequested()
30+
// onRemoveHighlights()
31+
32+
web3 () {
33+
return this._web3
34+
}
35+
36+
async discardHighlight () {
37+
await this.call('editor', 'discardHighlight')
38+
}
39+
40+
async highlight (lineColumnPos, path) {
41+
await this.call('editor', 'highlight', lineColumnPos, path)
42+
}
43+
44+
async getFile (path) {
45+
return await this.call('fileManager', 'getFile', path)
46+
}
47+
48+
async setFile (path, content) {
49+
await this.call('fileManager', 'setFile', path, content)
50+
}
51+
52+
onBreakpointCleared (listener) {
53+
this.onBreakpointClearedListener = listener
54+
}
55+
56+
onBreakpointAdded (listener) {
57+
this.onBreakpointAddedListener = listener
58+
}
59+
60+
onEditorContentChanged (listener) {
61+
this.onEditorContentChangedListener = listener
62+
}
63+
64+
onDebugRequested (listener) {
65+
this.onDebugRequestedListener = listener
66+
}
67+
68+
onRemoveHighlights (listener) {
69+
this.onRemoveHighlightsListener = listener
70+
}
71+
72+
async fetchContractAndCompile (address, receipt) {
73+
const target = (address && remixDebug.traceHelper.isContractCreation(address)) ? receipt.contractAddress : address
74+
const targetAddress = target || receipt.contractAddress || receipt.to
75+
const codeAtAddress = await this._web3.eth.getCode(targetAddress)
76+
const output = await this.call('fetchAndCompile', 'resolve', targetAddress, codeAtAddress, 'browser/.debug')
77+
return new CompilerAbstract(output.languageversion, output.data, output.source)
78+
}
79+
80+
async getDebugWeb3 () {
81+
let web3
82+
let network
83+
try {
84+
network = await this.call('network', 'detectNetwork')
85+
} catch (e) {
86+
web3 = this.web3()
87+
}
88+
if (!web3) {
89+
const webDebugNode = remixDebug.init.web3DebugNode(network.name)
90+
web3 = !webDebugNode ? this.web3() : webDebugNode
91+
}
92+
remixDebug.init.extendWeb3(web3)
93+
return web3
94+
}
95+
96+
async getTrace (hash) {
97+
if (!hash) return
98+
const web3 = await this.getDebugWeb3()
99+
const currentReceipt = await web3.eth.getTransactionReceipt(hash)
100+
const debug = new Debugger({
101+
web3,
102+
offsetToLineColumnConverter: this.offsetToLineColumnConverter,
103+
compilationResult: async (address) => {
104+
try {
105+
return await this.fetchContractAndCompile(address, currentReceipt)
106+
} catch (e) {
107+
console.error(e)
108+
}
109+
return null
110+
},
111+
debugWithGeneratedSources: false
112+
})
113+
return await debug.debugger.traceManager.getTrace(hash)
114+
}
115+
116+
debug (hash) {
117+
this.debugHash = hash
118+
this.onDebugRequestedListener(hash)
119+
}
120+
121+
onActivation () {
122+
this.on('editor', 'breakpointCleared', (fileName, row) => this.onBreakpointClearedListener(fileName, row))
123+
this.on('editor', 'breakpointAdded', (fileName, row) => this.onBreakpointAddedListener(fileName, row))
124+
this.on('editor', 'contentChanged', () => this.onEditorContentChangedListener())
125+
}
126+
127+
onDeactivation () {
128+
this.onRemoveHighlightsListener()
129+
this.off('editor', 'breakpointCleared')
130+
this.off('editor', 'breakpointAdded')
131+
this.off('editor', 'contentChanged')
132+
}
133+
}
134+
135+
export class CompilerAbstract implements CompilationOutput { // this is a subset of /remix-ide/src/app/compiler/compiler-abstract.js
136+
languageversion
137+
data
138+
source
139+
140+
constructor (languageversion: string, data: CompilationResult, source: { sources: Sources, target: string }) {
141+
this.languageversion = languageversion
142+
this.data = data
143+
this.source = source // source code
144+
}
145+
146+
getSourceName (fileIndex) {
147+
if (this.data && this.data.sources) {
148+
return Object.keys(this.data.sources)[fileIndex]
149+
} else if (Object.keys(this.source.sources).length === 1) {
150+
// if we don't have ast, we return the only one filename present.
151+
const sourcesArray = Object.keys(this.source.sources)
152+
return sourcesArray[0]
153+
}
154+
return null
155+
}
156+
}
157+

apps/debugger/src/app/debugger.ts

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import { PluginClient } from "@remixproject/plugin";
2+
import { createClient } from "@remixproject/plugin-webview";
3+
import { IDebuggerApi, LineColumnLocation,
4+
onBreakpointClearedListener, onBreakpointAddedListener, onEditorContentChanged, TransactionReceipt } from '@remix-ui/debugger-ui'
5+
import { DebuggerApiMixin, CompilerAbstract} from './debugger-api'
6+
7+
export class DebuggerClientApi extends DebuggerApiMixin(PluginClient) {
8+
constructor () {
9+
super()
10+
createClient(this as any)
11+
this.initDebuggerApi()
12+
}
13+
14+
offsetToLineColumnConverter: IDebuggerApi['offsetToLineColumnConverter']
15+
debugHash: string
16+
debugHashRequest: number
17+
removeHighlights: boolean
18+
onBreakpointCleared: (listener: onBreakpointClearedListener) => void
19+
onBreakpointAdded: (listener: onBreakpointAddedListener) => void
20+
onEditorContentChanged: (listener: onEditorContentChanged) => void
21+
discardHighlight: () => Promise<void>
22+
highlight: (lineColumnPos: LineColumnLocation, path: string) => Promise<void>
23+
fetchContractAndCompile: (address: string, currentReceipt: TransactionReceipt) => Promise<CompilerAbstract>
24+
getFile: (path: string) => Promise<string>
25+
setFile: (path: string, content: string) => Promise<void>
26+
getDebugWeb3: () => any // returns an instance of web3.js
27+
}
28+

apps/debugger/src/assets/.gitkeep

Whitespace-only changes.
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export const environment = {
2+
production: true
3+
};
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// This file can be replaced during build by using the `fileReplacements` array.
2+
// When building for production, this file is replaced with `environment.prod.ts`.
3+
4+
export const environment = {
5+
production: false
6+
};

apps/debugger/src/favicon.ico

14.7 KB
Binary file not shown.

apps/debugger/src/index.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Debugger</title>
6+
<base href="/" />
7+
8+
<meta name="viewport" content="width=device-width, initial-scale=1" />
9+
<link rel="icon" type="image/x-icon" href="favicon.ico" />
10+
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"/>
11+
</head>
12+
<body>
13+
<div id="root"></div>
14+
</body>
15+
</html>

0 commit comments

Comments
 (0)