fixing ui updates

pull/4526/head
Joseph Izang 9 months ago
parent f2edd976a9
commit 7387c78da9
  1. 7
      apps/vyper/src/app/app.tsx
  2. 19
      apps/vyper/src/app/components/CompileErrorCard.tsx
  3. 2
      apps/vyper/src/app/components/VyperResult.tsx
  4. 24
      apps/vyper/src/app/utils/compiler.tsx

@ -15,6 +15,7 @@ import Button from 'react-bootstrap/Button'
import './app.css'
import { CustomTooltip } from '@remix-ui/helper'
import { Form } from 'react-bootstrap'
import { CompileErrorCard } from './components/CompileErrorCard'
interface AppState {
status: 'idle' | 'inProgress'
@ -68,6 +69,9 @@ const App = () => {
useEffect(() => {
remixClient.eventEmitter.on('setOutput', (payload) => {
if (payload.status === 'failed') {
console.error('Error in the compiler', payload)
}
setOutput(payload)
})
@ -95,6 +99,7 @@ const App = () => {
setOutput(remixClient.compilerOutput)
}
console.log('output', output)
return (
<main id="vyper-plugin">
<header>
@ -161,7 +166,7 @@ const App = () => {
<>
<VyperResult output={output} plugin={remixClient} />
</>
) : null
) : output.status === 'failed' ? <CompileErrorCard output={output} /> : null
}
</article>
</section>

@ -0,0 +1,19 @@
import Reaact from 'react'
export function CompileErrorCard(props: any) {
return (
<div id="vyperErrorResult" className="px-2 mx-3 alert alert-danger error" title={props.output.message}>
<i className="fas fa-exclamation-circle text-danger"></i>
<span
data-id="error-message"
className=""
style={{
overflowX: 'hidden',
textOverflow: 'ellipsis'
}}
>
{props.output.message.trim()}
</span>
</div>
)
}

@ -59,7 +59,7 @@ function VyperResult({ output, plugin }: VyperResultProps) {
return (
<>
<div className="border border-top"></div>
<div className="d-flex justify-content-center px-2 w-100 flex-column">
<div className="d-flex justify-content-center px-2 w-100 flex-column border border-bottom">
<button data-id="compilation-details" className="btn btn-secondary w-100" onClick={async () => {
await plugin?.call('vyperCompilationDetails', 'showDetails', output)
}}>

@ -181,16 +181,15 @@ export async function compileContract(contract: string, compilerUrl: string, set
try {
_contract = await remixClient.getContract()
} catch (e: any) {
if (setOutput === null || setOutput === undefined) {
const compileResult = {
status: 'failed',
message: e.message
}
const compileResultKey = ''
remixClient.eventEmitter.emit('setOutput', { compileResultKey, compileResult })
} else {
setOutput('', {status: 'failed', message: e.message})
// if (setOutput === null || setOutput === undefined) {
const compileResult = {
status: 'failed',
message: e.message
}
remixClient.eventEmitter.emit('setOutput', compileResult)
// } else {
// setOutput('', {status: 'failed', message: e.message})
// }
return
}
remixClient.changeStatus({
@ -201,12 +200,16 @@ export async function compileContract(contract: string, compilerUrl: string, set
let output
try {
output = await compile(compilerUrl, _contract)
console.log('checking compile result', output)
remixClient.eventEmitter.emit('setOutput', output)
} catch (e: any) {
remixClient.changeStatus({
key: 'failed',
type: 'error',
title: e.message
title: `${e.message} debugging`
})
// setOutput !== null || setOutput !== undefined && setOutput('', {status: 'failed', message: e.message})
remixClient.eventEmitter.emit('setOutput', {status: 'failed', message: e.message})
return
}
const compileReturnType = () => {
@ -288,6 +291,7 @@ export async function compileContract(contract: string, compilerUrl: string, set
type: 'error',
title: err.message
})
remixClient.eventEmitter.emit('setOutput', {status: 'failed', message: err.message})
}
}

Loading…
Cancel
Save