implement terminal bar func

pull/4566/head
filip mertens 9 months ago committed by bunsenstraat
parent 07a5c72055
commit 962e28a0c0
  1. 14
      libs/remix-ui/terminal/src/lib/components/remix-ui-terminal-bar.tsx
  2. 19
      libs/remix-ui/terminal/src/lib/reducers/terminalReducer.ts
  3. 27
      libs/remix-ui/terminal/src/lib/remix-ui-terminal.tsx
  4. 2
      libs/remix-ui/terminal/src/lib/types/terminalTypes.ts

@ -1,13 +1,12 @@
import { CustomTooltip } from '@remix-ui/helper'
import React, { useState, useEffect, useReducer, useRef, useContext } from 'react' // eslint-disable-line
import React, { useState, useEffect, useRef, useContext } from 'react' // eslint-disable-line
import { FormattedMessage, useIntl } from 'react-intl'
import { listenOnNetworkAction } from '../actions/terminalAction'
import { TerminalContext } from '../context/context'
import { initialState, registerCommandReducer } from '../reducers/terminalReducer'
import { RemixUiTerminalProps } from '../types/terminalTypes'
export const RemixUITerminalBar = (props: RemixUiTerminalProps) => {
const { newstate: state, dispatch } = useContext(TerminalContext)
const [isVM, setIsVM] = useState(false)
const intl = useIntl()
const terminalMenu = useRef(null)
@ -28,11 +27,12 @@ export const RemixUITerminalBar = (props: RemixUiTerminalProps) => {
}
function listenOnNetwork(event: any): void {
throw new Error('Function not implemented.')
const isListening = event.target.checked
listenOnNetworkAction(props.plugin, isListening)
}
function setSearchInput(arg0: string): void {
throw new Error('Function not implemented.')
dispatch({ type: 'search', payload: arg0 })
}
return (<>
@ -62,7 +62,7 @@ export const RemixUITerminalBar = (props: RemixUiTerminalProps) => {
placement="top"
tooltipId="terminalClear"
tooltipClasses="text-nowrap"
tooltipText={intl.formatMessage({ id: isVM ? 'terminal.listenVM' : 'terminal.listenTitle' })}
tooltipText={intl.formatMessage({ id: state.isVM ? 'terminal.listenVM' : 'terminal.listenTitle' })}
>
<div className="h-80 mx-3 align-items-center remix_ui_terminal_listenOnNetwork custom-control custom-checkbox">
<CustomTooltip placement="top" tooltipId="terminalClear" tooltipClasses="text-nowrap" tooltipText={intl.formatMessage({ id: 'terminal.listenTitle' })}>
@ -71,7 +71,7 @@ export const RemixUITerminalBar = (props: RemixUiTerminalProps) => {
id="listenNetworkCheck"
onChange={listenOnNetwork}
type="checkbox"
disabled={isVM}
disabled={state.isVM}
/>
</CustomTooltip>
<label

@ -1,4 +1,4 @@
import {CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, TYPEWRITERLOG, TYPEWRITERWARNING, TYPEWRITERSUCCESS, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN, TOGGLE} from '../types/terminalTypes'
import {CLEAR_CONSOLE, CMD_HISTORY, EMPTY_BLOCK, ERROR, HTML, INFO, KNOWN_TRANSACTION, LISTEN_ON_NETWORK, LOG, TYPEWRITERLOG, TYPEWRITERWARNING, TYPEWRITERSUCCESS, NEW_TRANSACTION, SCRIPT, UNKNOWN_TRANSACTION, WARN, TOGGLE, SEARCH, SET_ISVM} from '../types/terminalTypes'
export const initialState = {
journalBlocks: [],
@ -20,6 +20,9 @@ export const initialState = {
_INDEXcommandsMain: {},
message: [],
isOpen: true,
searchInput: '',
clearConsole: false,
isVM: true
}
export const registerCommandReducer = (state, action) => {
@ -71,6 +74,13 @@ export const registerCommandReducer = (state, action) => {
return {
...state,
...state.journalBlocks.splice(0),
clearConsole: true,
}
case SEARCH:
return {
...state,
searchInput: action.payload,
}
case TOGGLE:
@ -78,11 +88,18 @@ export const registerCommandReducer = (state, action) => {
...state,
isOpen: !state.isOpen,
}
case LISTEN_ON_NETWORK:
return {
...state,
journalBlocks: initialState.journalBlocks.push({message: action.payload.message, style: 'text-log'}),
}
case SET_ISVM:
return {
...state,
isVM: action.payload,
}
default:
return {state}
}

@ -26,7 +26,7 @@ import RenderUnKnownTransactions from './components/RenderUnknownTransactions' /
import RenderCall from './components/RenderCall' // eslint-disable-line
import RenderKnownTransactions from './components/RenderKnownTransactions' // eslint-disable-line
import parse from 'html-react-parser'
import { EMPTY_BLOCK, KNOWN_TRANSACTION, RemixUiTerminalProps, UNKNOWN_TRANSACTION } from './types/terminalTypes'
import { EMPTY_BLOCK, KNOWN_TRANSACTION, RemixUiTerminalProps, SET_ISVM, UNKNOWN_TRANSACTION } from './types/terminalTypes'
import { wrapScript } from './utils/wrapScript'
import { TerminalContext } from './context/context'
const _paq = (window._paq = window._paq || [])
@ -59,7 +59,6 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
handleHide: () => {},
})
const [clearConsole, setClearConsole] = useState(false)
const [isVM, setIsVM] = useState(false)
const [paste, setPaste] = useState(false)
const [storage, setStorage] = useState<any>(null)
@ -81,7 +80,6 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
commandHistoryIndex: 0,
})
const [searchInput, setSearchInput] = useState('')
const [showTableHash, setShowTableHash] = useState([])
// terminal inputRef
@ -101,7 +99,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
useEffect(() => {
props.plugin.on('network', 'providerChanged', (provider) => {
setIsVM(provider.startsWith('vm-'))
dispatch({ type: SET_ISVM, payload: provider.startsWith('vm-') })
})
props.onReady({
@ -402,20 +400,17 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
}
}
/* end of block content that gets rendered from script Runner */
const handleClearConsole = () => {
setClearConsole(true)
useEffect(() => {
console.log('clearConsole change', newstate.clearConsole)
if(newstate.clearConsole){
typeWriterIndexes.current = []
dispatch({ type: 'clearconsole', payload: [] })
inputEl.current.focus()
}
/* start of autoComplete */
},[newstate.clearConsole])
const listenOnNetwork = (e: any) => {
const isListening = e.target.checked
listenOnNetworkAction(props.plugin, isListening)
}
/* end of block content that gets rendered from script Runner */
/* start of autoComplete */
const onChange = (event: any) => {
event.preventDefault()
@ -597,7 +592,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
{handleAutoComplete()}
<div className="position-relative d-flex flex-column-reverse h-100">
<div id="journal" className="remix_ui_terminal_journal d-flex flex-column pt-3 pb-4 px-2 mx-2 mr-0" data-id="terminalJournal">
{!clearConsole && <TerminalWelcomeMessage storage={storage} packageJson={version} />}
{!newstate.clearConsole && <TerminalWelcomeMessage storage={storage} packageJson={version} />}
{newstate.journalBlocks &&
newstate.journalBlocks.map((x, index) => {
if (x.name === EMPTY_BLOCK) {
@ -612,7 +607,7 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
)
} else if (x.name === UNKNOWN_TRANSACTION) {
return x.message
.filter((x) => x.tx.hash.includes(searchInput) || x.tx.from.includes(searchInput) || x.tx.to.includes(searchInput))
.filter((x) => x.tx.hash.includes(newstate.searchInput) || x.tx.from.includes(newstate.searchInput) || x.tx.to.includes(newstate.searchInput))
.map((trans) => {
return (
<div className={classNameBlock} data-id={`block_tx${trans.tx.hash}`} key={index}>

@ -26,6 +26,8 @@ export const CLEAR_CONSOLE = 'clearconsole'
export const TOGGLE = 'toggle'
export const LISTEN_ON_NETWORK = 'listenOnNetWork'
export const CMD_HISTORY = 'cmdHistory'
export const SEARCH = 'search'
export const SET_ISVM = 'setIsVM'
export interface RemixUiTerminalProps {
plugin: any,

Loading…
Cancel
Save