use hexHighlight

pull/1298/head
yann300 3 years ago
parent 1c8eeffad8
commit 9a76c08375
  1. 22
      libs/remix-ui/debugger-ui/src/lib/vm-debugger/dropdown-panel.tsx
  2. 2
      libs/remix-ui/debugger-ui/src/lib/vm-debugger/memory-panel.tsx
  3. 2
      libs/remix-ui/debugger-ui/src/lib/vm-debugger/stack-panel.tsx
  4. 2
      libs/remix-ui/debugger-ui/src/lib/vm-debugger/step-detail.tsx
  5. 5
      libs/remix-ui/debugger-ui/src/types/index.ts

@ -7,7 +7,7 @@ import './styles/dropdown-panel.css'
export const DropdownPanel = (props: DropdownPanelProps) => {
const [calldataObj, dispatch] = useReducer(reducer, initialState)
const { dropdownName, dropdownMessage, calldata, header, loading, extractFunc, formatSelfFunc, registerEvent, triggerEvent, loadMoreEvent, loadMoreCompletedEvent, headStyle, bodyStyle } = props
const { dropdownName, dropdownMessage, calldata, header, loading, extractFunc, formatSelfFunc, registerEvent, triggerEvent, loadMoreEvent, loadMoreCompletedEvent, headStyle, bodyStyle, hexHighlight } = props
const extractDataDefault: ExtractFunc = (item, parent?) => {
const ret: ExtractData = {}
@ -34,15 +34,17 @@ export const DropdownPanel = (props: DropdownPanelProps) => {
return ret
}
const formatSelfDefault = (key: string | number, data: ExtractData) => {
let value
if (typeof(data.self) === 'string') {
let regex = /^(0+)(.*)/g
let split = regex.exec(data.self.replace('0x', ''))
if (split && split[1] && split[2]) {
split[1] = data.self.indexOf('0x') === 0 ? '0x' + split[1] : split[1]
value = (<span><span className="m-0 label_value">{split[1]}</span><span className="m-0 label_value font-weight-bold text-dark">{split[2]}</span></span>)
}
} else value = data.self
let value
if (hexHighlight && typeof(data.self) === 'string') {
const isHex = data.self.startsWith('0x') || hexHighlight
if (isHex) {
let regex = /^(0+)(.*)/g
let split = regex.exec(data.self.replace('0x', ''))
if (split && split[1]) {
value = (<span><span className="m-0 label_value">0x</span><span className="m-0 label_value">{split[1]}</span>{ split[2] && <span className="m-0 label_value font-weight-bold text-dark">{split[2]}</span> }</span>)
} else value = (<span><span className="m-0 label_value">0x</span><span className="m-0 label_value font-weight-bold text-dark">{data.self.replace('0x', '')}</span></span>)
} else value = <span className="m-0 label_value">{data.self}</span>
} else value = <span className="m-0 label_value">{data.self}</span>
return (
<div className="d-flex mr-1 flex-row label_item">
<label className="small font-weight-bold mb-0 pr-1 label_key">{key}:</label>

@ -3,7 +3,7 @@ import DropdownPanel from './dropdown-panel' // eslint-disable-line
export const MemoryPanel = ({ calldata }) => {
return (
<DropdownPanel bodyStyle={{ fontFamily: 'monospace' }} dropdownName='Memory' calldata={calldata || {}} />
<DropdownPanel hexHighlight={true} bodyStyle={{ fontFamily: 'monospace' }} dropdownName='Memory' calldata={calldata || {}} />
)
}

@ -4,7 +4,7 @@ import DropdownPanel from './dropdown-panel' // eslint-disable-line
export const StackPanel = ({ calldata }) => {
return (
<div id='stackpanel'>
<DropdownPanel bodyStyle={{ fontFamily: 'monospace' }} dropdownName='Stack' calldata={calldata || {}} />
<DropdownPanel hexHighlight={true} bodyStyle={{ fontFamily: 'monospace' }} dropdownName='Stack' calldata={calldata || {}} />
</div>
)
}

@ -4,7 +4,7 @@ import DropdownPanel from './dropdown-panel' // eslint-disable-line
export const StepDetail = ({ stepDetail }) => {
return (
<div id='stepdetail' data-id='stepdetail'>
<DropdownPanel dropdownName='Step details' calldata={stepDetail || {}} />
<DropdownPanel hexHighlight={false} dropdownName='Step details' calldata={stepDetail || {}} />
</div>
)
}

@ -28,8 +28,9 @@ export interface DropdownPanelProps {
triggerEvent?: Function,
loadMoreEvent?: string,
loadMoreCompletedEvent?: string,
bodyStyle?: React.CSSProperties
headStyle?: React.CSSProperties
bodyStyle?: React.CSSProperties,
headStyle?: React.CSSProperties,
hexHighlight?: boolean // highlight non zero value of hex value
}
export type FormatSelfFunc = (key: string | number, data: ExtractData) => JSX.Element

Loading…
Cancel
Save