Skip to content

Commit

Permalink
Merge branch 'main' into feat/au-nft-avatar
Browse files Browse the repository at this point in the history
  • Loading branch information
bobo-k2 committed Oct 24, 2023
2 parents c4cb432 + 88bce99 commit 8858cfc
Show file tree
Hide file tree
Showing 94 changed files with 3,899 additions and 297 deletions.
8 changes: 8 additions & 0 deletions .github/workflows/pull-request-preview.yml
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,10 @@ on:
jobs:
build_and_preview:
if: '${{ github.event.pull_request.head.repo.full_name == github.repository }}'
permissions:
checks: write
contents: read
pull-requests: write
runs-on: ubuntu-latest
outputs:
output1: ${{ steps.deploy_firebase_hosting_channel.outputs.details_url }}
Expand All @@ -33,6 +37,10 @@ jobs:
firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_ASTAR_APPS }}'
projectId: astar-apps
e2etest:
permissions:
checks: write
contents: read
pull-requests: write
timeout-minutes: 60
runs-on: ubuntu-latest
needs: build_and_preview
Expand Down
18 changes: 18 additions & 0 deletions src/assets/img/cbridge_logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/img/chain/zkatana-logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
25 changes: 18 additions & 7 deletions src/boot/api.ts
Original file line number Diff line number Diff line change
Expand Up @@ -115,18 +115,29 @@ export default boot(async ({ store }) => {
}
});

const setWeb3 = async (networkId: TNetworkId): Promise<void> => {
const web3 = await createAstarWeb3Instance(networkId);
if (!web3) {
console.error(`cannot create the web3 instance with network id ${networkId}`);
}
$web3.value = web3;
};

// update chaininfo
const { chainInfo } = useChainInfo(api);
watchPostEffect(async () => {
store.commit('general/setChainInfo', chainInfo.value);
if (chainInfo.value?.chain) {
const currentChain = chainInfo.value?.chain as ASTAR_CHAIN;
const currentNetworkIdx = getProviderIndex(currentChain);
const web3 = await createAstarWeb3Instance(currentNetworkIdx as TNetworkId);
if (!web3) {
console.error(`cannot create the web3 instance with network id ${currentNetworkIdx}`);
const networkIdx = store.getters['general/networkIdx'];
const isZkEvm = networkIdx === endpointKey.ZKATANA || networkIdx === endpointKey.ASTAR_ZKEVM;

if (isZkEvm) {
await setWeb3(networkIdx);
} else {
if (chainInfo.value?.chain) {
const currentChain = chainInfo.value?.chain as ASTAR_CHAIN;
const currentNetworkIdx = getProviderIndex(currentChain);
await setWeb3(currentNetworkIdx as TNetworkId);
}
$web3.value = web3;
}
});

Expand Down
21 changes: 12 additions & 9 deletions src/components/assets/Account.vue
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@
</div>
<div v-if="isH160">
<evm-native-token />
<zk-astr v-if="isZkEvm" />
</div>
<div v-if="multisig" class="row--details-signatory">
<div class="column-account-name">
Expand All @@ -85,36 +86,36 @@
</div>
</template>
<script lang="ts">
import { isValidEvmAddress, getShortenAddress } from '@astar-network/astar-sdk-core';
import { getShortenAddress, isValidEvmAddress } from '@astar-network/astar-sdk-core';
import { FrameSystemAccountInfo } from '@polkadot/types/lookup';
import copy from 'copy-to-clipboard';
import { ethers } from 'ethers';
import { $api } from 'src/boot/api';
import EvmNativeToken from 'src/components/assets/EvmNativeToken.vue';
import NativeAssetList from 'src/components/assets/NativeAssetList.vue';
import ZkAstr from 'src/components/assets/ZkAstr.vue';
import { endpointKey, providerEndpoints } from 'src/config/chainEndpoints';
import { supportWalletObj } from 'src/config/wallets';
import {
ETHEREUM_EXTENSION,
useAccount,
useAccountUnification,
useBalance,
useNetworkInfo,
usePrice,
useWalletIcon,
useAccountUnification,
} from 'src/hooks';
import { useEvmAccount } from 'src/hooks/custom-signature/useEvmAccount';
import { getEvmMappedSs58Address, setAddressMapping } from 'src/hooks/helper/addressUtils';
import { useStore } from 'src/store';
import { computed, defineComponent, ref, watch, watchEffect } from 'vue';
import { useI18n } from 'vue-i18n';
import NativeAssetList from 'src/components/assets/NativeAssetList.vue';
import EvmNativeToken from 'src/components/assets/EvmNativeToken.vue';
import { ETHEREUM_EXTENSION } from 'src/hooks';
import { supportWalletObj } from 'src/config/wallets';
import AuIcon from '../header/modals/account-unification/AuIcon.vue';
export default defineComponent({
components: {
NativeAssetList,
EvmNativeToken,
AuIcon,
ZkAstr,
},
props: {
ttlErc20Amount: {
Expand All @@ -136,6 +137,7 @@ export default defineComponent({
showAccountUnificationModal,
isAccountUnification,
} = useAccount();
const { balance, isLoadingBalance } = useBalance(currentAccount);
const { nativeTokenUsd } = usePrice();
const { requestSignature } = useEvmAccount();
Expand All @@ -149,7 +151,7 @@ export default defineComponent({
const isH160 = computed<boolean>(() => store.getters['general/isH160Formatted']);
const isEthWallet = computed<boolean>(() => store.getters['general/isEthWallet']);
const { currentNetworkIdx } = useNetworkInfo();
const { currentNetworkIdx, isZkEvm } = useNetworkInfo();
const blockscout = computed<string>(
() =>
`${providerEndpoints[currentNetworkIdx.value].blockscout}/address/${currentAccount.value}`
Expand Down Expand Up @@ -255,6 +257,7 @@ export default defineComponent({
isAccountUnification,
unifiedAccount,
isAccountUnified,
isZkEvm,
getShortenAddress,
copyAddress,
showAccountUnificationModal,
Expand Down
7 changes: 3 additions & 4 deletions src/components/assets/Assets.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ export default defineComponent({
const store = useStore();
const { currentAccount } = useAccount();
const { accountData } = useBalance(currentAccount);
const { isMainnet, currentNetworkIdx, evmNetworkIdx } = useNetworkInfo();
const { isMainnet, currentNetworkIdx, evmNetworkIdx, isZkEvm } = useNetworkInfo();
// Memo: load the dApps data in advance, so that users can access to dApp staging page smoothly
useDispatchGetDapps();
Expand All @@ -80,7 +80,6 @@ export default defineComponent({
});
const isLoading = computed<boolean>(() => store.getters['general/isLoading']);
const isH160 = computed(() => store.getters['general/isH160Formatted']);
const isShibuya = computed(() => currentNetworkIdx.value === endpointKey.SHIBUYA);
const xcmAssets = computed<XcmAssets>(() => store.getters['assets/getAllAssets']);
const xvmAssets = computed<XvmAssets>(() => store.getters['assets/getAllXvmAssets']);
Expand Down Expand Up @@ -150,8 +149,8 @@ export default defineComponent({
watch([currentAccount], handleUpdateEvmAssets, { immediate: isH160.value });
watchEffect(handleImportingCustomToken);
const isEnableXcm = computed<boolean>(
() => xcmAssets.value.assets && xcmAssets.value.assets.length > 0
const isEnableXcm = computed(
() => !isZkEvm.value && xcmAssets.value.assets && xcmAssets.value.assets.length > 0
);
const handleEvmAssetLoader = (): void => {
Expand Down
27 changes: 23 additions & 4 deletions src/components/assets/EvmNativeToken.vue
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,11 @@
</div>
</div>
<div class="column--asset-buttons column--buttons--native-token">
<router-link v-if="isZkEvm" :to="buildEthereumBridgePageLink()">
<button class="btn btn--sm">
{{ $t('assets.bridge') }}
</button>
</router-link>
<router-link :to="buildTransferPageLink(nativeTokenSymbol)">
<button class="btn btn--sm">
{{ $t('assets.transfer') }}
Expand All @@ -43,8 +48,13 @@
{{ $t('assets.bridge') }}
</button>
</a>
<a v-if="isZkatana" :href="faucetSethLink" target="_blank" rel="noopener noreferrer">
<button class="btn btn--sm">
{{ $t('assets.faucet') }}
</button>
</a>
<button
v-if="isFaucet"
v-else-if="isFaucet"
class="btn btn--sm"
@click="handleModalFaucet({ isOpen: true })"
>
Expand All @@ -66,9 +76,10 @@ import TokenBalance from 'src/components/common/TokenBalance.vue';
import { faucetBalRequirement } from 'src/config/wallets';
import { useAccount, useNetworkInfo, usePrice } from 'src/hooks';
import { getTokenImage } from 'src/modules/token';
import { buildTransferPageLink } from 'src/router/routes';
import { buildTransferPageLink, buildEthereumBridgePageLink } from 'src/router/routes';
import { useStore } from 'src/store';
import { computed, defineComponent, ref, watchEffect } from 'vue';
import { faucetSethLink } from 'src/links';
export default defineComponent({
components: { ModalFaucet, TokenBalance },
Expand All @@ -80,15 +91,19 @@ export default defineComponent({
const isFaucet = ref<boolean>(false);
const isModalFaucet = ref<boolean>(false);
const { currentNetworkName, nativeTokenSymbol } = useNetworkInfo();
const { currentNetworkName, nativeTokenSymbol, isZkEvm, isZkatana } = useNetworkInfo();
const { currentAccount } = useAccount();
const { nativeTokenUsd } = usePrice();
const store = useStore();
const isH160 = computed<boolean>(() => store.getters['general/isH160Formatted']);
const isLoading = computed<boolean>(() => store.getters['general/isLoading']);
const nativeTokenImg = computed<string>(() =>
getTokenImage({ isNativeToken: true, symbol: nativeTokenSymbol.value })
getTokenImage({
isNativeToken: true,
symbol: nativeTokenSymbol.value,
isZkEvm: isZkEvm.value,
})
);
const updateStates = async (nativeTokenUsd: number): Promise<void> => {
Expand Down Expand Up @@ -126,8 +141,12 @@ export default defineComponent({
cbridgeAppLink,
isFaucet,
isModalFaucet,
isZkEvm,
isZkatana,
faucetSethLink,
handleModalFaucet,
buildTransferPageLink,
buildEthereumBridgePageLink,
};
},
});
Expand Down
106 changes: 106 additions & 0 deletions src/components/assets/ZkAstr.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
<template>
<div data-testid="evm-native-token">
<div class="border--separator border--margin" />
<div class="rows">
<div class="row row--details">
<div class="row__left">
<div class="column--currency">
<img class="token-logo" :src="astrTokenImg" :alt="astrTokenSymbol" />
<div v-if="astrTokenSymbol && networkNameSubstrate" class="column--ticker">
<span class="text--title">{{ astrTokenSymbol }}</span>
<span class="text--label">{{ networkNameSubstrate }}</span>
</div>
<div v-else>
<q-skeleton animation="fade" class="skeleton--md" />
</div>
</div>
</div>
<div class="row__right row__right--evm-native-token">
<div class="column column--balance">
<div class="column__box">
<div class="text--accent">
<token-balance :balance="String(bal)" :symbol="astrTokenSymbol" />
</div>
<div class="text--label">
<span>{{ $n(balUsd) }} {{ $t('usd') }}</span>
</div>
</div>
</div>
<div class="column--asset-buttons column--buttons--native-token">
<router-link to="/">
<button class="btn btn--sm" :disabled="true">
{{ $t('assets.bridge') }}
</button>
</router-link>
<router-link to="/">
<button class="btn btn--sm" :disabled="true">
{{ $t('assets.transfer') }}
</button>
</router-link>
</div>
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import { getUsdBySymbol } from '@astar-network/astar-sdk-core';
import TokenBalance from 'src/components/common/TokenBalance.vue';
import { ASTAR_NATIVE_TOKEN } from 'src/config/chain';
import { useNetworkInfo } from 'src/hooks';
import { getTokenImage } from 'src/modules/token';
import { useStore } from 'src/store';
import { computed, defineComponent, ref, watchEffect } from 'vue';
export default defineComponent({
components: { TokenBalance },
setup() {
const bal = ref<number>(0);
const balUsd = ref<number>(0);
const { networkNameSubstrate, isMainnet } = useNetworkInfo();
const store = useStore();
const astrTokenSymbol = computed<ASTAR_NATIVE_TOKEN>(() => {
const chainInfo = store.getters['general/chainInfo'];
return chainInfo ? chainInfo.tokenSymbol : '';
});
const astrTokenImg = computed<string>(() =>
getTokenImage({
isNativeToken: true,
symbol: astrTokenSymbol.value,
isZkEvm: false,
})
);
// Todo: fetch balance after wrapped tokens are deployed
const handleAstrPrice = async () => {
const tokenSymbolRef = astrTokenSymbol.value;
if (!tokenSymbolRef) return;
try {
if (isMainnet.value) {
const price = await getUsdBySymbol(tokenSymbolRef);
balUsd.value = bal.value * price;
}
} catch (error: any) {
console.error(error.message);
}
};
watchEffect(handleAstrPrice);
return {
astrTokenImg,
astrTokenSymbol,
networkNameSubstrate,
bal,
balUsd,
};
},
});
</script>

<style lang="scss" scoped>
@use 'src/components/assets/styles/asset-list.scss';
</style>
2 changes: 1 addition & 1 deletion src/components/assets/styles/assets.scss
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
}

.title--account {
margin-bottom: 10px;
margin-bottom: 24px;
}

.separator--top {
Expand Down
Loading

0 comments on commit 8858cfc

Please sign in to comment.