Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: translate known addresses #573

Merged
merged 8 commits into from
Nov 23, 2023
Merged

feat: translate known addresses #573

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
3b4ef1a
translate known addresses
janmichek Nov 14, 2023
8bb7855
change name wording
janmichek Nov 16, 2023
10eb1b3
add known name to account detail
janmichek Nov 16, 2023
0aa1917
replace device conditional classes with utility class
janmichek Nov 16, 2023
ea6a524
remove unused import
janmichek Nov 16, 2023
c71f719
fix condition
janmichek Nov 16, 2023
aea27c4
remove translated address from account detail
janmichek Nov 22, 2023
a95540a
remove explicit packageManager
janmichek Nov 22, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 6 additions & 19 deletions src/components/AccountDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,13 @@
</app-chip>

<copy-chip
:label="accountDetails.id"
class="account-details-panel__copy-chip"/>
:label="formatKnownAddress(accountDetails.id, false)"
:clipboard-text="accountDetails.id"
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(accountDetails.id)"
:label="formatKnownAddress(accountDetails.id)"
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I touched this and noticed the usage of styling classes for the different views, which I recently replaced. Here was forgotten, so I adjusted it also in sibling files

:clipboard-text="accountDetails.id"
class="account-details-panel__copy-chip-ellipse"/>
class="u-hidden-desktop"/>
</template>
<p
v-if="accountDetails.notExistent"
Expand Down Expand Up @@ -113,7 +114,7 @@ import AppPanel from '@/components/AppPanel'
import CopyChip from '@/components/CopyChip'
import AppIcon from '@/components/AppIcon'
import AppLink from '@/components/AppLink'
import { formatAePrice, formatEllipseHash, formatNullable, formatNumber } from '@/utils/format'
import { formatAePrice, formatKnownAddress, formatNullable, formatNumber } from '@/utils/format'
import { useMarketStatsStore } from '@/stores/marketStats'
import HintTooltip from '@/components/HintTooltip'

Expand Down Expand Up @@ -161,20 +162,6 @@ const sanitizedPrice = computed(() =>
align-items: center;
}

&__copy-chip {
display: none;

@media (--desktop) {
display: inline-flex;
}
}

&__copy-chip-ellipse {
@media (--desktop) {
display: none;
}
}

&__not-existent {
margin: 0 0 var(--space-3) 0;
}
Expand Down
27 changes: 6 additions & 21 deletions src/components/KeyblockDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@
<div v-if="!keyblockDetails.notExistent">
<copy-chip
:label="keyblockDetails.hash"
class="keyblock-details-panel__chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(keyblockDetails.hash)"
:clipboard-text="keyblockDetails.hash"
class="keyblock-details-panel__chip-ellipse"/>
class="u-hidden-desktop"/>
</div>
</template>
<p
Expand Down Expand Up @@ -66,10 +66,10 @@
</hint-tooltip>
</th>
<td class="keyblock-details-panel__data">
<span class="keyblock-details-panel__hash">
<span class="u-hidden-mobile">
{{ keyblockDetails.miner }}
</span>
<span class="keyblock-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(keyblockDetails.miner) }}
</span>
</td>
Expand All @@ -83,10 +83,10 @@
</th>
<td class="keyblock-details-panel__data">
<app-link :to="`/accounts/${keyblockDetails.beneficiary}`">
<span class="keyblock-details-panel__hash">
<span class="u-hidden-mobile">
{{ keyblockDetails.beneficiary }}
</span>
<span class="keyblock-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(keyblockDetails.beneficiary) }}
</span>
</app-link>
Expand Down Expand Up @@ -229,21 +229,6 @@ const isNextKeyblockMined = computed(() =>
}
}

&__chip,
&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__chip-ellipse,
&__hash-ellipse {
@media (--desktop) {
display: none;
}
}

&__not-existent {
margin: var(--space-3) 0;
}
Expand Down
23 changes: 4 additions & 19 deletions src/components/MicroblockDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<template #header>
<copy-chip
:label="microblockDetails.hash"
class="microblock-details-panel__chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(microblockDetails.hash)"
:clipboard-text="microblockDetails.hash"
class="microblock-details-panel__chip-ellipse"/>
class="u-hidden-desktop"/>
</template>
<table>
<tbody>
Expand All @@ -23,10 +23,10 @@
</th>
<td class="microblock-details-panel__data">
<app-link :to="`/keyblocks/${microblockDetails.prevKeyHash}`">
<span class="microblock-details-panel__hash">
<span class="u-hidden-mobile">
{{ microblockDetails.prevKeyHash }}
</span>
<span class="microblock-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(microblockDetails.prevKeyHash) }}
</span>
</app-link>
Expand Down Expand Up @@ -153,20 +153,5 @@ const microblockMiddlewareUrl = computed(() =>
margin-right: var(--space-3);
}
}

&__chip,
&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__chip-ellipse,
&__hash-ellipse {
@media (--desktop) {
display: none;
}
}
}
</style>
19 changes: 2 additions & 17 deletions src/components/NftsDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<template #header>
<copy-chip
:label="nftDetails.contractId"
class="nfts-details-panel__chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(nftDetails.contractId)"
:clipboard-text="nftDetails.contractId"
class="nfts-details-panel__chip-ellipse"/>
class="u-hidden-desktop"/>
</template>

<table>
Expand Down Expand Up @@ -145,20 +145,5 @@ defineProps({
gap: var(--space-1);
justify-content: flex-end;
}

&__chip,
&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__chip-ellipse,
&__hash-ellipse {
@media (--desktop) {
display: none;
}
}
}
</style>
23 changes: 4 additions & 19 deletions src/components/OracleDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<template #header>
<copy-chip
:label="oracleDetails.id"
class="oracle-details-panel__chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(oracleDetails.id)"
:clipboard-text="oracleDetails.id"
class="oracle-details-panel__chip-ellipse"/>
class="u-hidden-desktop"/>
</template>

<table>
Expand Down Expand Up @@ -133,10 +133,10 @@
<td class="oracle-details-panel__data">
<app-link
:to="`/accounts/${oracleDetails.operator}`">
<span class="oracle-details-panel__hash">
<span class="u-hidden-mobile">
{{ oracleDetails.operator }}
</span>
<span class="oracle-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(oracleDetails.operator) }}
</span>
</app-link>
Expand Down Expand Up @@ -225,20 +225,5 @@ const oracleMiddlewareUrl = computed(() =>
margin-right: var(--space-3);
}
}

&__chip,
&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__chip-ellipse,
&__hash-ellipse {
@media (--desktop) {
display: none;
}
}
}
</style>
31 changes: 8 additions & 23 deletions src/components/StateChannelDetailsPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<template #header>
<copy-chip
:label="stateChannelDetails.id"
class="state-channel-details-panel__chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(stateChannelDetails.id)"
:clipboard-text="stateChannelDetails.id"
class="state-channel-details-panel__chip-ellipse"/>
class="u-hidden-desktop"/>
</template>

<table>
Expand All @@ -37,10 +37,10 @@
</th>
<td class="state-channel-details-panel__data">
<app-link :to="`/transactions/${stateChannelDetails.createTransactionHash}`">
<span class="state-channel-details-panel__hash">
<span class="u-hidden-mobile">
{{ stateChannelDetails.createTransactionHash }}
</span>
<span class="state-channel-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(stateChannelDetails.createTransactionHash) }}
</span>
</app-link>
Expand All @@ -66,10 +66,10 @@
</th>
<td class="state-channel-details-panel__data">
<app-link :to="`/accounts/${stateChannelDetails.initiator}`">
<span class="state-channel-details-panel__hash">
<span class="u-hidden-mobile">
{{ stateChannelDetails.initiator }}
</span>
<span class="state-channel-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(stateChannelDetails.initiator) }}
</span>
</app-link>
Expand All @@ -84,10 +84,10 @@
</th>
<td class="state-channel-details-panel__data">
<app-link :to="`/accounts/${stateChannelDetails.responder}`">
<span class="state-channel-details-panel__hash">
<span class="u-hidden-mobile">
{{ stateChannelDetails.responder }}
</span>
<span class="state-channel-details-panel__hash-ellipse">
<span class="u-hidden-desktop">
{{ formatEllipseHash(stateChannelDetails.responder) }}
</span>
</app-link>
Expand Down Expand Up @@ -222,20 +222,5 @@ const stateChannelMiddlewareUrl = `${MIDDLEWARE_URL}/v2/channels/${props.stateCh
display: inline-flex;
align-items: center;
}

&__chip,
&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__chip-ellipse,
&__hash-ellipse {
@media (--desktop) {
display: none;
}
}
}
</style>
21 changes: 4 additions & 17 deletions src/components/TransactionGeneralPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<template #header>
<copy-chip
:label="transactionDetails.hash"
class="transaction-general-panel__hash"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(transactionDetails.hash)"
:clipboard-text="transactionDetails.hash"
class="transaction-general-panel__hash-ellipse"/>
class="u-hidden-desktop"/>
<app-chip
variant="primary"
size="sm">
Expand Down Expand Up @@ -77,12 +77,12 @@
<td class="transaction-general-panel__data">
<app-link
:to="`/microblocks/${transactionDetails.blockHash}`"
class="transaction-general-panel__hash">
class="u-hidden-mobile">
{{ transactionDetails.blockHash }}
</app-link>
<app-link
:to="`/microblocks/${transactionDetails.blockHash}`"
class="transaction-general-panel__hash-ellipse">
class="u-hidden-desktop">
{{ formatEllipseHash(transactionDetails.blockHash) }}
</app-link>
</td>
Expand Down Expand Up @@ -219,18 +219,5 @@ const transactionMiddlewareUrl = computed(() => {
margin-right: var(--space-3);
}
}

&__hash {
display: none;
@media (--desktop) {
display: inline-flex;
}
}

&__hash-ellipse {
@media (--desktop) {
display: none;
}
}
}
</style>
18 changes: 2 additions & 16 deletions src/components/TransactionTypePanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@
<template v-if="transactionData.type === 'PayingForTx'">
<copy-chip
:label="transactionData.payerId"
class="transaction-type-panel__copy-chip"/>
class="u-hidden-mobile"/>
<copy-chip
:label="formatEllipseHash(transactionData.payerId)"
:clipboard-text="transactionData.payerId"
class="transaction-type-panel__copy-chip-ellipse"/>
class="u-hidden-desktop"/>
<app-chip variant="primary">
{{ transactionData.tx.tx.type }}
</app-chip>
Expand Down Expand Up @@ -102,20 +102,6 @@ watch(props.transactionData, () => {
}
}

&__copy-chip {
display: none;

@media (--desktop) {
display: inline-flex;
}
}

&__copy-chip-ellipse {
@media (--desktop) {
display: none;
}
}

&__payer {
word-wrap: anywhere;
max-width: 100%;
Expand Down
Loading
Loading