Skip to content

Commit

Permalink
chore: Made Tip component globally available, fixed tip on normalized…
Browse files Browse the repository at this point in the history 
… page
  • Loading branch information
@Bobinstein
Bobinstein committed Jan 16, 2025
1 parent b6b1d5b commit 337ddca
Show file tree
Hide file tree
Showing 3 changed files with 68 additions and 42 deletions.
105 changes: 63 additions & 42 deletions src/app/learn/concepts/normalized-addresses/page.mdx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import {HeroPattern} from "@/components/HeroPattern"
import { HeroPattern } from '@/components/HeroPattern'

<HeroPattern />

Expand All @@ -15,62 +15,84 @@ A tool for easily obtaining a normalized addresses from public keys can be found
## At A Glance

{
<div style={{textAlign: "center"}}>
<table className="inline-table" id="address-table" style={{textAlign: "left"}}>

<div style={{ textAlign: 'center' }}>
<table
className="inline-table"
id="address-table"
style={{ textAlign: 'left' }}
>
<thead>
<tr style={{textAlign: "center"}}>
<th></th>
<th>Arweave</th>
<th>ETH/POL</th>
<th>Solana</th>
</tr>
</thead>
<tbody>
<tr>
<th>Native Address</th>
<td>9ODOd-_ZT9oWoRMVmmD4G5f9Z6MjvYxO3Nen-T5OXvU</td>
<td>0x084af408C8E492aC52dc0Ec76514A7deF8D5F03f</td>
<td>Cd5yb4mvbuQyyJgAkriFZbWQivh2zM68KGZX8Ksn1L85</td>
</tr>
<tr>
<th>base64url Encoded Public Key</th>
<td className="scrollable-cell" >0jkGWDFYI3DHEWaXhZitjTg67T-enQwXs50lTDrMhy2qb619_91drv_50J5PwrOYJiMmYhiEA5ojMvrrAFY-Dm1bJbJfVBU1kIsPho2tFcXnbSOa2_1bovAys0ckJU07wkbmIUpzp3trdxYReB4jayMMOXWw9B8xS0v81zFmK3IbCtL9N6WNTMONOSMATHFQrGqtDhDUqKyIsQZCBPFvfGykRWaLWzbtAUrApprqG9hfExQzppNsw0gsftNSHZ1emC5tC2fuib6FhQw9TE2ge9tUjEZNALcVZvopTtTX0H2gEfnRJ48UNeV3SKggjXcoPVeivmqXuPBGncXWWq1pHR-Xs4zSLA5Mgcw_tQJc4FIER0i7hUlZXoc991ZHyOvAC-GlHWzQwvrlY11oD38pB47NkHN2WVPtUCAtyYQe5TE6Xznd9kPgqqvVUkV0s0suh5vINGoiPEnMjyhYEN7eOmJRIJ_A87IJesbdPRV4ZzBsqPbd02RG3ZuVpc3gI1xKvwH1WS05XI8eWK-BbvB3oxB7WjaQTWcfBWhMEULiwx-SucuyAzPAw3i6Wjtq61TcL9SdWhmOf9_yo-Np052tj7MQ66nmgdOH_MEKYjAdFypxTsRQoSLbv28HEcSjwx8u3pY0q0gKMK_5X2XKJrp2i2GB_fVgbcpH9YsgrYxh1Q8</td>
<td className="scrollable-cell">2W5VMzNKYwr51QsiYBHUS5h5wxZf_uBgG7C6xiHgBHwwLUty5LHKFFBDlAxTCTAhglcmys2_HQoOj_LnCkA3</td>
<td>rK8XXxd8JqsZFPXVOwkSWS5Gh1SJzftfCOLpLk4i1FY</td>
</tr>
<tr>
<th>Normalized Address</th>
<td>9ODOd-_ZT9oWoRMVmmD4G5f9Z6MjvYxO3Nen-T5OXvU</td>
<td>5JtuS4yOFtUX2Rg3UU7AgBaUqh4s8wyyNTZk9UrzI-Q</td>
<td>K8kpPM1RID8ZM2sjF5mYy0rP4gXSRDbrwPUd9Qths64</td>
</tr>
</tbody>
</table>
</div>}
<tr style={{ textAlign: 'center' }}>
<th></th>
<th>Arweave</th>
<th>ETH/POL</th>
<th>Solana</th>
</tr>
</thead>
<tbody>
<tr>
<th>Native Address</th>
<td>9ODOd-_ZT9oWoRMVmmD4G5f9Z6MjvYxO3Nen-T5OXvU</td>
<td>0x084af408C8E492aC52dc0Ec76514A7deF8D5F03f</td>
<td>Cd5yb4mvbuQyyJgAkriFZbWQivh2zM68KGZX8Ksn1L85</td>
</tr>
<tr>
<th>base64url Encoded Public Key</th>
<td className="scrollable-cell">
0jkGWDFYI3DHEWaXhZitjTg67T-enQwXs50lTDrMhy2qb619_91drv_50J5PwrOYJiMmYhiEA5ojMvrrAFY-Dm1bJbJfVBU1kIsPho2tFcXnbSOa2_1bovAys0ckJU07wkbmIUpzp3trdxYReB4jayMMOXWw9B8xS0v81zFmK3IbCtL9N6WNTMONOSMATHFQrGqtDhDUqKyIsQZCBPFvfGykRWaLWzbtAUrApprqG9hfExQzppNsw0gsftNSHZ1emC5tC2fuib6FhQw9TE2ge9tUjEZNALcVZvopTtTX0H2gEfnRJ48UNeV3SKggjXcoPVeivmqXuPBGncXWWq1pHR-Xs4zSLA5Mgcw_tQJc4FIER0i7hUlZXoc991ZHyOvAC-GlHWzQwvrlY11oD38pB47NkHN2WVPtUCAtyYQe5TE6Xznd9kPgqqvVUkV0s0suh5vINGoiPEnMjyhYEN7eOmJRIJ_A87IJesbdPRV4ZzBsqPbd02RG3ZuVpc3gI1xKvwH1WS05XI8eWK-BbvB3oxB7WjaQTWcfBWhMEULiwx-SucuyAzPAw3i6Wjtq61TcL9SdWhmOf9_yo-Np052tj7MQ66nmgdOH_MEKYjAdFypxTsRQoSLbv28HEcSjwx8u3pY0q0gKMK_5X2XKJrp2i2GB_fVgbcpH9YsgrYxh1Q8
</td>
<td className="scrollable-cell">
2W5VMzNKYwr51QsiYBHUS5h5wxZf_uBgG7C6xiHgBHwwLUty5LHKFFBDlAxTCTAhglcmys2_HQoOj_LnCkA3
</td>
<td>rK8XXxd8JqsZFPXVOwkSWS5Gh1SJzftfCOLpLk4i1FY</td>
</tr>
<tr>
<th>Normalized Address</th>
<td>9ODOd-_ZT9oWoRMVmmD4G5f9Z6MjvYxO3Nen-T5OXvU</td>
<td>5JtuS4yOFtUX2Rg3UU7AgBaUqh4s8wyyNTZk9UrzI-Q</td>
<td>K8kpPM1RID8ZM2sjF5mYy0rP4gXSRDbrwPUd9Qths64</td>
</tr>
</tbody>
</table>
</div>
}

## Public Keys and Addresses

Crypto wallets consist of two separate components. The public keys, which are public knowledge and can be seen by anyone, and the private keys, which only the owner of a wallet should have access to. Crypto wallet addresses are derived from the public key.
Crypto wallets consist of two separate components. The public keys, which are public knowledge and can be seen by anyone, and the private keys, which only the owner of a wallet should have access to. Crypto wallet addresses are derived from the public key.

::: tip Encoded Public Keys
It is important to note that all crypto wallet public and private keys are binary data. The values provided below for Arweave and Ethereum/Polygon public keys are base64url and hex encoded representations of that binary data respectively.
:::
<Tip title="Tip">
{' '}
Encoded Public Keys It is important to note that all crypto wallet public and
private keys are binary data. The values provided below for Arweave and
Ethereum/Polygon public keys are base64url and hex encoded representations of
that binary data respectively.
</Tip>

### Arweave

The public key for an Arweave wallet is the `n` field of the JWK json file.
The public key for an Arweave wallet is the `n` field of the JWK json file.

<code style={{ maxWidth: '600px', overflowWrap: 'break-word', whiteSpace: 'normal' }}>0jkGWDFYI3DHEWaXhZitjTg67T-enQwXs50lTDrMhy2qb619_91drv_50J5PwrOYJiMmYhiEA5ojMvrrAFY-Dm1bJbJfVBU1kIsPho2tFcXnbSOa2_1bovAys0ckJU07wkbmIUpzp3trdxYReB4jayMMOXWw9B8xS0v81zFmK3IbCtL9N6WNTMONOSMATHFQrGqtDhDUqKyIsQZCBPFvfGykRWaLWzbtAUrApprqG9hfExQzppNsw0gsftNSHZ1emC5tC2fuib6FhQw9TE2ge9tUjEZNALcVZvopTtTX0H2gEfnRJ48UNeV3SKggjXcoPVeivmqXuPBGncXWWq1pHR-Xs4zSLA5Mgcw_tQJc4FIER0i7hUlZXoc991ZHyOvAC-GlHWzQwvrlY11oD38pB47NkHN2WVPtUCAtyYQe5TE6Xznd9kPgqqvVUkV0s0suh5vINGoiPEnMjyhYEN7eOmJRIJ_A87IJesbdPRV4ZzBsqPbd02RG3ZuVpc3gI1xKvwH1WS05XI8eWK-BbvB3oxB7WjaQTWcfBWhMEULiwx-SucuyAzPAw3i6Wjtq61TcL9SdWhmOf9_yo-Np052tj7MQ66nmgdOH_MEKYjAdFypxTsRQoSLbv28HEcSjwx8u3pY0q0gKMK_5X2XKJrp2i2GB_fVgbcpH9YsgrYxh1Q8</code>
<code
style={{
maxWidth: '600px',
overflowWrap: 'break-word',
whiteSpace: 'normal',
}}
>
0jkGWDFYI3DHEWaXhZitjTg67T-enQwXs50lTDrMhy2qb619_91drv_50J5PwrOYJiMmYhiEA5ojMvrrAFY-Dm1bJbJfVBU1kIsPho2tFcXnbSOa2_1bovAys0ckJU07wkbmIUpzp3trdxYReB4jayMMOXWw9B8xS0v81zFmK3IbCtL9N6WNTMONOSMATHFQrGqtDhDUqKyIsQZCBPFvfGykRWaLWzbtAUrApprqG9hfExQzppNsw0gsftNSHZ1emC5tC2fuib6FhQw9TE2ge9tUjEZNALcVZvopTtTX0H2gEfnRJ48UNeV3SKggjXcoPVeivmqXuPBGncXWWq1pHR-Xs4zSLA5Mgcw_tQJc4FIER0i7hUlZXoc991ZHyOvAC-GlHWzQwvrlY11oD38pB47NkHN2WVPtUCAtyYQe5TE6Xznd9kPgqqvVUkV0s0suh5vINGoiPEnMjyhYEN7eOmJRIJ_A87IJesbdPRV4ZzBsqPbd02RG3ZuVpc3gI1xKvwH1WS05XI8eWK-BbvB3oxB7WjaQTWcfBWhMEULiwx-SucuyAzPAw3i6Wjtq61TcL9SdWhmOf9_yo-Np052tj7MQ66nmgdOH_MEKYjAdFypxTsRQoSLbv28HEcSjwx8u3pY0q0gKMK_5X2XKJrp2i2GB_fVgbcpH9YsgrYxh1Q8
</code>

The public wallet address for that wallet is `9ODOd-_ZT9oWoRMVmmD4G5f9Z6MjvYxO3Nen-T5OXvU`, this is obtained by decoding the public key from base64url to normalize padding, sha256 hashing the result, and then base64url encoding that.

### Ethereum/Polygon

The public key for an EVM wallet (Ethereum, Polygon/Matic) is derived from its private key, using the [Elliptic Curve Digital Signature Algorithm](https://en.wikipedia.org/wiki/Elliptic_Curve_Digital_Signature_Algorithm), or ECDSA.
The public key for an EVM wallet (Ethereum, Polygon/Matic) is derived from its private key, using the [Elliptic Curve Digital Signature Algorithm](https://en.wikipedia.org/wiki/Elliptic_Curve_Digital_Signature_Algorithm), or ECDSA.

`0xb5d96e5533334a630af9d50b226011d44b9879c3165ffee0601bb0bac621e0047c302d4b72e4b1ca145043940c53093021825726cacdbf1d0a0e8ff2e70a4037`

The public wallet address is `0x084af408C8E492aC52dc0Ec76514A7deF8D5F03f`, this is obtained by removing the first byte from the public key, Keccak-256 hashing the remainder, taking the the last 20 bytes (40 hexadecimal characters) and prepending `0x` to it.
The public wallet address is `0x084af408C8E492aC52dc0Ec76514A7deF8D5F03f`, this is obtained by removing the first byte from the public key, Keccak-256 hashing the remainder, taking the the last 20 bytes (40 hexadecimal characters) and prepending `0x` to it.

### Solana

Expand All @@ -82,7 +104,7 @@ The public wallet address for this wallet is `Cd5yb4mvbuQyyJgAkriFZbWQivh2zM68KG

## Normalizing Addresses

As shown in the above examples, the format of public keys, and the resulting derived wallet addresses, vary widely between blockchains. Arweave manages this by applying the same derivation methods that Arweave uses for its own wallets to the public keys from other chains.
As shown in the above examples, the format of public keys, and the resulting derived wallet addresses, vary widely between blockchains. Arweave manages this by applying the same derivation methods that Arweave uses for its own wallets to the public keys from other chains.

### Ethereum/Polygon

Expand All @@ -103,4 +125,3 @@ The normalized public key for Solana wallets are derived similarly. The 32 byte
Again, this value is used for the GraphQl tag `owner` when uploading data. It can then be sha256 hashed, and base64url encoded again to derive the normalized address:

`K8kpPM1RID8ZM2sjF5mYy0rP4gXSRDbrwPUd9Qths64`

2 changes: 2 additions & 0 deletions src/components/Layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { Logo } from '@/components/Logo';
import { Navigation } from '@/components/Navigation';
import { type Section, SectionProvider } from '@/components/SectionProvider';
import DiagramWithWayfinder from '@/components/DiagramWithWayfinder';
import Tip from '@/components/Tip'

export function Layout({
children,
Expand All @@ -24,6 +25,7 @@ export function Layout({
// Define custom components for MDX
const components = {
Diagram: DiagramWithWayfinder, // Automatically replaces <Diagram /> in MDX
Tip: Tip
};

return (
Expand Down
3 changes: 3 additions & 0 deletions src/components/mdx.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,14 @@ import { Feedback } from '@/components/Feedback'
import { Heading } from '@/components/Heading'
import { Prose } from '@/components/Prose'
import DiagramWithWayfinder from '@/components/DiagramWithWayfinder'
import TipComponent from '@/components/Tip'

export const a = Link
export { Button } from '@/components/Button'
export { CodeGroup, Code as code, Pre as pre } from '@/components/Code'
export const Diagram = DiagramWithWayfinder
export const Tip = TipComponent


export function wrapper({ children }: { children: React.ReactNode }) {
return (
Expand Down

0 comments on commit 337ddca

Please sign in to comment.