Skip to content

Commit

Permalink
Merge pull request #1094 from DarkFlorist/use-input-component-where-a…
Browse files Browse the repository at this point in the history
…ppropriaet

Use input component where appropriate
  • Loading branch information
KillariDev authored Aug 7, 2024
2 parents 85719ae + 0097af4 commit d3035a4
Show file tree
Hide file tree
Showing 7 changed files with 81 additions and 48 deletions.
5 changes: 0 additions & 5 deletions app/css/interceptor.css
Original file line number Diff line number Diff line change
Expand Up @@ -561,33 +561,28 @@ svg.spinner > circle {
grid-auto-columns: auto;
grid-auto-flow: column;
width: 100%;
margin: 0 0.2em;
}

.log-table {
display: grid;
grid-template-columns: max-content auto auto auto auto;
width: 100%;
margin: 0 0.2em;
}

.log-table-4 {
display: grid;
grid-template-columns: max-content auto auto auto;
width: 100%;
margin: 0 0.2em;
}
.log-table-3 {
display: grid;
grid-template-columns: max-content auto auto;
width: 100%;
margin: 0 0.2em;
}
.log-table-1 {
display: grid;
grid-template-columns: auto;
width: 100%;
margin: 0 0.2em;
}

.log-cell {
Expand Down
17 changes: 12 additions & 5 deletions app/ts/background/windows/personalSign.ts
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,8 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
account: await identifyAddress(ethereumClientService, requestAbortController, originalParams.originalRequestParameters.params[1]),
quarantine: false,
quarantineReasons: [],
rawMessage: stringifyJSONWithBigInts(originalParams.originalRequestParameters.params[0], 4),
stringifiedMessage: stringifyJSONWithBigInts(originalParams.originalRequestParameters.params[0], 4),
rawMessage: stringifyJSONWithBigInts(originalParams.originalRequestParameters.params[0]),
}
}

Expand All @@ -57,6 +58,7 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
account: await identifyAddress(ethereumClientService, requestAbortController, originalParams.originalRequestParameters.params[1]),
quarantine: false,
quarantineReasons: [],
stringifiedMessage: stringifyJSONWithBigInts(originalParams.originalRequestParameters.params[0], 4),
rawMessage: originalParams.originalRequestParameters.params[0],
}
}
Expand All @@ -78,7 +80,8 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
message,
account,
...chainid === undefined ? { quarantine: false, quarantineReasons: [] } : await getQuarrantineCodes(chainid, account, activeAddressWithMetadata, undefined),
rawMessage: stringifyJSONWithBigInts(namedParams.param, 4),
stringifiedMessage: stringifyJSONWithBigInts(namedParams.param, 4),
rawMessage: stringifyJSONWithBigInts(namedParams.param),
}
} catch(e: unknown) {
console.error(e)
Expand All @@ -104,6 +107,7 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
verifyingContract: token,
...await getQuarrantineCodes(BigInt(parsed.domain.chainId), account, activeAddressWithMetadata, owner),
rawMessage: stringifyJSONWithBigInts(parsed, 4),
stringifiedMessage: stringifyJSONWithBigInts(parsed, 4),
}
}
case 'PermitSingle': {
Expand All @@ -121,7 +125,8 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
spender: await identifyAddress(ethereumClientService, requestAbortController, parsed.message.spender),
verifyingContract: await identifyAddress(ethereumClientService, requestAbortController, parsed.domain.verifyingContract),
...await getQuarrantineCodes(parsed.domain.chainId, account, activeAddressWithMetadata, undefined),
rawMessage: stringifyJSONWithBigInts(parsed, 4),
stringifiedMessage: stringifyJSONWithBigInts(parsed, 4),
rawMessage: stringifyJSONWithBigInts(parsed),
}
}
case 'SafeTx': {
Expand All @@ -143,7 +148,8 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
...addresses,
quarantine: false,
quarantineReasons: [],
rawMessage: stringifyJSONWithBigInts(parsed, 4),
stringifiedMessage: stringifyJSONWithBigInts(parsed, 4),
rawMessage: stringifyJSONWithBigInts(parsed),
parsedMessageData,
parsedMessageDataAddressBookEntries: await Promise.all(addressesInEventsAndInputData.map((address) => identifyAddress(ethereumClientService, requestAbortController, address)))
}
Expand All @@ -156,7 +162,8 @@ export async function craftPersonalSignPopupMessage(ethereumClientService: Ether
message: await addMetadataToOpenSeaOrder(ethereumClientService, requestAbortController, parsed.message),
account,
...await getQuarrantineCodes(parsed.domain.chainId, account, activeAddressWithMetadata, undefined),
rawMessage: stringifyJSONWithBigInts(parsed, 4),
stringifiedMessage: stringifyJSONWithBigInts(parsed, 4),
rawMessage: stringifyJSONWithBigInts(parsed),
}
default: assertNever(parsed)
}
Expand Down
36 changes: 17 additions & 19 deletions app/ts/components/pages/PersonalSign.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { useState } from 'preact/hooks'
import { dataStringWith0xStart, isHexEncodedNumber, stringToUint8Array } from '../../utils/bigint.js'
import { isHexEncodedNumber, stringToUint8Array } from '../../utils/bigint.js'
import { RenameAddressCallBack } from '../../types/user-interface-types.js'
import { MOCK_PRIVATE_KEYS_ADDRESS, getChainName } from '../../utils/constants.js'
import { TransactionOrMessageIdentifier } from '../../types/interceptor-messages.js'
Expand All @@ -15,11 +15,12 @@ import { AddressBookEntry } from '../../types/addressBookTypes.js'
import { EnrichedEIP712, EnrichedEIP712Message, TypeEnrichedEIP712MessageRecord } from '../../types/eip721.js'
import { TransactionCreated } from '../simulationExplaining/SimulationSummary.js'
import { EnrichedSolidityTypeComponent } from '../subcomponents/solidityType.js'
import { ParsedInputData, QuarantineReasons } from '../simulationExplaining/Transactions.js'
import { QuarantineReasons } from '../simulationExplaining/Transactions.js'
import { GnosisSafeVisualizer } from '../simulationExplaining/customExplainers/GnosisSafeVisualizer.js'
import { EditEnsNamedHashCallBack } from '../subcomponents/ens.js'
import { ViewSelector as Viewer } from '../subcomponents/ViewSelector.js'
import { ViewSelector, ViewSelector as Viewer } from '../subcomponents/ViewSelector.js'
import { XMarkIcon } from '../subcomponents/icons.js'
import { TransactionInput } from '../subcomponents/ParsedInputData.js'

type SignatureCardParams = {
visualizedPersonalSignRequest: VisualizedPersonalSignRequest
Expand Down Expand Up @@ -287,7 +288,6 @@ type ExtraDetailsCardParams = {
renameAddressCallBack: RenameAddressCallBack
}


type GnosisSafeExtraDetailsParams = {
visualizedPersonalSignRequestSafeTx: VisualizedPersonalSignRequestSafeTx
renameAddressCallBack: RenameAddressCallBack
Expand Down Expand Up @@ -333,11 +333,7 @@ function GnosisSafeExtraDetails({ visualizedPersonalSignRequestSafeTx, renameAdd
<CellElement text = { <Ether amount = { visualizedPersonalSignRequestSafeTx.message.message.value } rpcNetwork = { visualizedPersonalSignRequestSafeTx.rpcNetwork } fontSize = 'normal'/> }/>
</span>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>Gnosis Safe meta transaction input: </p>
<div class = 'textbox'>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>{ dataStringWith0xStart(visualizedPersonalSignRequestSafeTx.message.message.data) }</p>
</div>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>Parsed Gnosis Safe meta transaction: </p>
{ visualizedPersonalSignRequestSafeTx.parsedMessageData?.type !== 'Parsed' ? <p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>No ABI available</p> : <ParsedInputData inputData = { visualizedPersonalSignRequestSafeTx.parsedMessageData } addressMetaData = { visualizedPersonalSignRequestSafeTx.parsedMessageDataAddressBookEntries } renameAddressCallBack = { renameAddressCallBack }/> }
<TransactionInput parsedInputData = { visualizedPersonalSignRequestSafeTx.parsedMessageData } to = { visualizedPersonalSignRequestSafeTx.to } input = { visualizedPersonalSignRequestSafeTx.parsedMessageData.input } addressMetaData = { visualizedPersonalSignRequestSafeTx.parsedMessageDataAddressBookEntries } renameAddressCallBack = { renameAddressCallBack }/>
</>
}

Expand Down Expand Up @@ -390,15 +386,17 @@ function RawMessage({ visualizedPersonalSignRequest }: ExtraDetailsCardParams) {
</header>
{ !showSummary
? <></>
: <>
<div class = 'card-content'>
<div class = 'container' style = 'margin-bottom: 10px;'>
<div class = 'textbox'>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>{ visualizedPersonalSignRequest.rawMessage }</p>
</div>
</div>
</div>
</>
: <ViewSelector id = 'raw_message'>
<ViewSelector.List>
<ViewSelector.View title = 'View Parsed' value = 'parsed'>
<pre> { decodeMessage(visualizedPersonalSignRequest.stringifiedMessage) }</pre>
</ViewSelector.View>
<ViewSelector.View title = 'View Raw' value = 'raw'>
<pre>{ visualizedPersonalSignRequest.rawMessage }</pre>
</ViewSelector.View>
</ViewSelector.List>
<ViewSelector.Triggers />
</ViewSelector>
}
</div>
}
Expand Down Expand Up @@ -429,7 +427,7 @@ export function SignatureCard(params: SignatureCardParams) {
</div>
<QuarantineReasons quarantineReasons = { params.visualizedPersonalSignRequest.quarantineReasons }/>
<ExtraDetails { ...params }/>
<RawMessage { ...params }/>
{ params.visualizedPersonalSignRequest.type === 'NotParsed' ? <></> : <RawMessage { ...params }/> }

<Signer
signer = { params.visualizedPersonalSignRequest.activeAddress }
Expand Down
22 changes: 4 additions & 18 deletions app/ts/components/simulationExplaining/SimulationSummary.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@ import { RenameAddressCallBack, RpcConnectionStatus } from '../../types/user-int
import { Erc721TokenApprovalChange, SimulatedAndVisualizedTransaction, SimulationAndVisualisationResults, ERC20TokenApprovalChange, Erc20TokenBalanceChange, TransactionWithAddressBookEntries, NamedTokenId } from '../../types/visualizer-types.js'
import { BigAddress, SmallAddress, WebsiteOriginText } from '../subcomponents/address.js'
import { Ether, EtherAmount, EtherSymbol, TokenWithAmount, TokenAmount, TokenPrice, TokenSymbol, TokenOrEth } from '../subcomponents/coins.js'
import { NonTokenLogAnalysis, ParsedInputData, TokenLogAnalysis } from './Transactions.js'
import { NonTokenLogAnalysis, TokenLogAnalysis } from './Transactions.js'
import { CopyToClipboard } from '../subcomponents/CopyToClipboard.js'
import { SomeTimeAgo, humanReadableDateDeltaLessDetailed } from '../subcomponents/SomeTimeAgo.js'
import { addressString, bytes32String, dataStringWith0xStart, nanoString } from '../../utils/bigint.js'
import { addressString, bytes32String, nanoString } from '../../utils/bigint.js'
import { identifyTransaction } from './identifyTransaction.js'
import { identifySwap } from './SwapTransactions.js'
import { useState } from 'preact/hooks'
Expand All @@ -18,8 +18,8 @@ import { Website } from '../../types/websiteAccessTypes.js'
import { extractTokenEvents } from '../../background/metadataUtils.js'
import { EditEnsNamedHashCallBack } from '../subcomponents/ens.js'
import { EnrichedEthereumInputData } from '../../types/EnrichedEthereumData.js'
import { ViewSelector } from '../subcomponents/ViewSelector.js'
import { XMarkIcon } from '../subcomponents/icons.js'
import { TransactionInput } from '../subcomponents/ParsedInputData.js'

type Erc20BalanceChangeParams = {
erc20TokenBalanceChanges: Erc20TokenBalanceChange[]
Expand Down Expand Up @@ -783,21 +783,7 @@ export function RawTransactionDetailsCard({ transaction, renameAddressCallBack,

<div>
<p class = 'paragraph' style = { { color: 'var(--subtitle-text-color)', marginBottom: '0.25rem'} }>Transaction Input</p>
<ViewSelector id = 'transaction_input'>
{ parsedInputData?.type === 'Parsed' ? (
<>
<ViewSelector.List>
<ViewSelector.View title = 'View Parsed' value = 'parsed'>
<ParsedInputData inputData = { parsedInputData } addressMetaData = { addressMetaData } renameAddressCallBack = { renameAddressCallBack }/>
</ViewSelector.View>
<ViewSelector.View title = 'View Raw' value = 'raw'>
<pre>{ dataStringWith0xStart(transaction.input) }</pre>
</ViewSelector.View>
</ViewSelector.List>
<ViewSelector.Triggers />
</>
) : <p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>No ABI available</p> }
</ViewSelector>
<TransactionInput parsedInputData = { parsedInputData } input = { transaction.input } to = { transaction.to } addressMetaData = { addressMetaData } renameAddressCallBack = { renameAddressCallBack } />
</div>
</div>
</div>
Expand Down
47 changes: 47 additions & 0 deletions app/ts/components/subcomponents/ParsedInputData.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import { EnrichedEthereumInputData } from '../../types/EnrichedEthereumData.js'
import { AddressBookEntry } from '../../types/addressBookTypes.js'
import { RenameAddressCallBack } from '../../types/user-interface-types.js'
import { dataStringWith0xStart } from '../../utils/bigint.js'
import { ParsedInputData } from '../simulationExplaining/Transactions.js'
import { ViewSelector } from './ViewSelector.js'
import { SmallAddress } from './address.js'

type TransactionInputParams = {
addressMetaData: readonly AddressBookEntry[]
parsedInputData: EnrichedEthereumInputData
input: Uint8Array
to: AddressBookEntry | undefined
renameAddressCallBack: RenameAddressCallBack
}
export function TransactionInput({ parsedInputData, input, to, addressMetaData, renameAddressCallBack }: TransactionInputParams) {
return <ViewSelector id = 'transaction_input'>
{ parsedInputData?.type === 'Parsed' ? ( <>
<ViewSelector.List>
<ViewSelector.View title = 'View Parsed' value = 'parsed'>
<ParsedInputData inputData = { parsedInputData } addressMetaData = { addressMetaData } renameAddressCallBack = { renameAddressCallBack }/>
</ViewSelector.View>
<ViewSelector.View title = 'View Raw' value = 'raw'>
<pre>{ dataStringWith0xStart(input) }</pre>
</ViewSelector.View>
</ViewSelector.List>
<ViewSelector.Triggers />
</> ) : <>
<ViewSelector.List>
<ViewSelector.View title = 'View Parsed' value = 'parsed'>
<div style = 'display: flex;'>
{ to !== undefined ? <>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>No ABI available for&nbsp;</p>
<SmallAddress addressBookEntry = { to} renameAddressCallBack = { renameAddressCallBack } />
</> : <>
<p class = 'paragraph' style = 'color: var(--subtitle-text-color)'>No ABI available</p>
</> }
</div>
</ViewSelector.View>
<ViewSelector.View title = 'View Raw' value = 'raw'>
<pre>{ dataStringWith0xStart(input) }</pre>
</ViewSelector.View>
</ViewSelector.List>
<ViewSelector.Triggers />
</> }
</ViewSelector>
}
1 change: 0 additions & 1 deletion app/ts/components/subcomponents/ViewSelector.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ export const ViewSelector = ({ children, id }: { children: ComponentChildren, id
)
}


const useViewSwitcher = () => {
const context = useContext(ViewSelectorContext)
if (context === undefined) throw new Error('useViewSwitcher can only be used within children of DisplayRoot')
Expand Down
1 change: 1 addition & 0 deletions app/ts/types/personal-message-definitions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -364,6 +364,7 @@ const PersonalSignRequestBase = funtypes.ReadonlyObject({
website: Website,
created: EthereumTimestamp,
rawMessage: funtypes.String,
stringifiedMessage: funtypes.String,
messageIdentifier: EthereumQuantity,
})

Expand Down

0 comments on commit d3035a4

Please sign in to comment.