Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/develop' into feature/swap-layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@Nikita-Polyakov
Nikita-Polyakov committed Jul 1, 2024
2 parents 2ed12de + 5ba988e commit 9662924
Show file tree
Hide file tree
Showing 48 changed files with 636 additions and 504 deletions.
25 changes: 13 additions & 12 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "polkaswap-exchange-web",
"version": "1.38.0",
"version": "1.38.2",
"repository": {
"type": "git",
"url": "https://github.com/sora-xor/polkaswap-exchange-web.git"
Expand Down Expand Up @@ -28,36 +28,37 @@
"dependencies": {
"@cedelabs/widgets-universal": "^1.3.1",
"@metamask/detect-provider": "^2.0.0",
"@soramitsu/soraneo-wallet-web": "1.38.2",
"@walletconnect/ethereum-provider": "^2.12.2",
"@soramitsu/soraneo-wallet-web": "1.38.6",
"@tma.js/sdk": "^2.4.0",
"@walletconnect/ethereum-provider": "^2.13.3",
"@walletconnect/modal": "^2.6.2",
"core-js": "^3.37.0",
"core-js": "^3.37.1",
"country-code-emoji": "^2.3.0",
"country-flag-emoji-polyfill": "^0.1.8",
"direct-vuex": "^0.12.1",
"echarts": "^5.5.0",
"email-validator": "^2.0.4",
"ethers": "6.12.1",
"ethers": "6.13.1",
"jwt-decode": "^4.0.0",
"lodash": "^4.17.21",
"polkadotApi": "npm:@polkadot/api@11.2.1",
"uuidv4": "^6.2.13",
"vue": "2.7.14",
"vue-class-component": "^7.2.6",
"vue-echarts": "^6.7.1",
"vue-echarts": "^6.7.3",
"vue-grid-layout": "^2.4.0",
"vue-i18n": "^8.28.2",
"vue-property-decorator": "^9.1.2",
"vue-router": "^3.6.5",
"vuex": "^3.6.2"
},
"devDependencies": {
"@babel/runtime": "^7.24.5",
"@babel/runtime": "^7.24.7",
"@types/electron-devtools-installer": "^2.2.5",
"@types/jest": "^29.5.12",
"@types/jsdom": "^21.1.6",
"@types/lodash": "^4.17.3",
"@types/node": "^20.12.10",
"@types/jsdom": "^21.1.7",
"@types/lodash": "^4.17.5",
"@types/node": "^20.14.5",
"@typescript-eslint/eslint-plugin": "^5.62.0",
"@typescript-eslint/parser": "^5.62.0",
"@vue/cli-plugin-babel": "5.0.8",
Expand Down Expand Up @@ -87,9 +88,9 @@
"jest": "^27.5.1",
"jsdom": "^16.7.0",
"lint-staged": "^9.5.0",
"node-polyfill-webpack-plugin": "^3.0.0",
"node-polyfill-webpack-plugin": "^4.0.0",
"prettier": "^2.8.8",
"sass": "^1.77.0",
"sass": "^1.77.6",
"sass-loader": "^14.2.1",
"ts-jest": "^27.1.5",
"typescript": "~5.4.5",
Expand Down
14 changes: 13 additions & 1 deletion src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ import {
initWallet,
waitForCore,
} from '@soramitsu/soraneo-wallet-web';
import { isTMA, setDebug } from '@tma.js/sdk';
import debounce from 'lodash/debounce';
import { Component, Mixins, Watch } from 'vue-property-decorator';
Expand Down Expand Up @@ -156,7 +157,7 @@ export default class App extends Mixins(mixins.TransactionMixin, NodeErrorMixin)
@mutation.wallet.transactions.setSignTxDialogVisibility public setSignTxDialogVisibility!: (flag: boolean) => void;
// [DESKTOP] To Enable Desktop
// @mutation.wallet.account.setIsDesktop private setIsDesktop!: (v: boolean) => void;
@mutation.wallet.account.setIsDesktop private setIsDesktop!: (v: boolean) => void;
@Watch('assetsToNotifyQueue')
private handleNotifyOnDeposit(whitelistAssetArray: WhitelistArrayItem[]): void {
Expand Down Expand Up @@ -218,6 +219,7 @@ export default class App extends Mixins(mixins.TransactionMixin, NodeErrorMixin)
async created() {
// [DESKTOP] To Enable Desktop
// this.setIsDesktop(true);
// element-icons is not common used, but should be visible after network connection lost
preloadFontFace('element-icons');
this.setResponsiveClass();
Expand All @@ -233,6 +235,13 @@ export default class App extends Mixins(mixins.TransactionMixin, NodeErrorMixin)
throw new Error('NETWORK_TYPE is not set');
}
// To start running as Telegram Web App (desktop capabilities)
if (await isTMA()) {
this.setIsDesktop(true);
// sets debug mode in twa
if (data.NETWORK_TYPE === WALLET_CONSTS.SoraNetwork.Dev) setDebug(true);
}
await this.setApiKeys(data?.API_KEYS);
await this.setEthBridgeSettings(data.ETH_BRIDGE);
this.setFeatureFlags(data?.FEATURE_FLAGS);
Expand Down Expand Up @@ -519,6 +528,9 @@ ul ul {
width: 0;
animation: none;
}
@include mobile(true) {
width: 300px;
}
}
.el-form--actions {
Expand Down
Binary file modified src/assets/fonts/polkaswap_icons.ttf
View file
Binary file not shown.
9 changes: 5 additions & 4 deletions src/components/pages/Burn/BurnDialog.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
<template v-if="isZeroAmount">
{{ t('buttons.enterAmount') }}
</template>
<template v-else-if="isAmountLessThanOne">NEED TO RESERVE MORE THAN 1</template>
<template v-else-if="isAmountLessThanMin">NEED TO RESERVE MORE THAN {{ min }}</template>
<template v-else-if="isInsufficientBalance">
{{ t('insufficientBalanceText', { tokenSymbol: burnedAsset.symbol }) }}
</template>
Expand Down Expand Up @@ -93,6 +93,7 @@ export default class BurnDialog extends Mixins(
@Prop({ type: Object, required: true }) readonly burnedAsset!: Asset;
@Prop({ type: Number, default: 1_000_000 }) readonly rate!: number;
@Prop({ type: Number, default: 10_000 }) readonly max!: number;
@Prop({ type: Number, default: 1 }) readonly min!: number;
@state.wallet.settings.networkFees private networkFees!: NetworkFeesObject;
@getter.assets.xor private accountXor!: Nullable<AccountAsset>;
Expand Down Expand Up @@ -141,8 +142,8 @@ export default class BurnDialog extends Mixins(
return this.getKey(`${this.burnedAsset.symbol}-left`);
}
get isAmountLessThanOne(): boolean {
return +(this.value || '0') < 1;
get isAmountLessThanMin(): boolean {
return +(this.value || '0') < this.min;
}
get formattedWillBeBurned(): string {
Expand Down Expand Up @@ -189,7 +190,7 @@ export default class BurnDialog extends Mixins(
}
get isBurnDisabled(): boolean {
return this.loading || this.isZeroAmount || this.isAmountLessThanOne || this.isInsufficientBalance;
return this.loading || this.isZeroAmount || this.isAmountLessThanMin || this.isInsufficientBalance;
}
handleInputField(value: string): void {
Expand Down
37 changes: 26 additions & 11 deletions src/components/pages/Stats/BarChart.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,12 @@
:is-error="isFetchingError"
@retry="updateData"
>
<formatted-amount v-if="fees" class="chart-price" :value="amount.amount">
{{ amount.suffix }}
<template>&nbsp;{{ XOR.symbol }}</template>
</formatted-amount>
<formatted-amount v-else class="chart-price" :value="amount.amount" is-fiat-value>
<formatted-amount class="chart-price" :value="amount.amount">
<template #prefix>{{ symbol }}</template>
{{ amount.suffix }}
</formatted-amount>
<price-change :value="priceChange" />
<v-chart ref="chart" class="chart" :option="chartSpec" autoresize />
<v-chart ref="chart" class="chart" :key="chartKey" :option="chartSpec" autoresize />
</chart-skeleton>
</base-widget>
</template>
Expand All @@ -36,6 +33,7 @@ import { Components } from '@/consts';
import { SECONDS_IN_TYPE, NETWORK_STATS_FILTERS } from '@/consts/snapshots';
import { fetchData } from '@/indexer/queries/networkVolume';
import { lazyComponent } from '@/router';
import { getter } from '@/store/decorators';
import type { SnapshotFilter } from '@/types/filters';
import type { AmountWithSuffix } from '@/types/formats';
import { calcPriceChange, formatAmountWithSuffix, formatDecimalPlaces } from '@/utils';
Expand Down Expand Up @@ -80,6 +78,9 @@ const normalizeTo = (sample: ChartData[], difference: number, from: number, to:
},
})
export default class StatsBarChart extends Mixins(mixins.LoadingMixin, ChartSpecMixin) {
@getter.wallet.settings.exchangeRate private exchangeRate!: number;
@getter.wallet.settings.currencySymbol private currencySymbol!: string;
@Prop({ default: false, type: Boolean }) readonly fees!: boolean;
readonly FontSizeRate = WALLET_CONSTS.FontSizeRate;
Expand All @@ -98,6 +99,15 @@ export default class StatsBarChart extends Mixins(mixins.LoadingMixin, ChartSpec
this.updateData();
}
get chartKey(): string | undefined {
if (this.fees) return undefined;
return `bar-chart-${this.currencySymbol}-rate-${this.exchangeRate}`;
}
get symbol(): string {
return this.fees ? XOR.symbol : this.currencySymbol;
}
get title(): string {
return this.fees ? 'Fees' : 'Volume';
}
Expand All @@ -119,7 +129,9 @@ export default class StatsBarChart extends Mixins(mixins.LoadingMixin, ChartSpec
}
get amount(): AmountWithSuffix {
return formatAmountWithSuffix(this.total);
return this.fees
? formatAmountWithSuffix(this.total) // fees are always in XOR
: formatAmountWithSuffix(this.total.mul(this.exchangeRate)); // amount is in currency
}
get priceChange(): FPNumber {
Expand All @@ -142,7 +154,7 @@ export default class StatsBarChart extends Mixins(mixins.LoadingMixin, ChartSpec
yAxis: this.yAxisSpec({
axisLabel: {
formatter: (value) => {
const val = new FPNumber(value);
const val = new FPNumber(value).mul(this.exchangeRate);
const { amount, suffix } = formatAmountWithSuffix(val);
return `${amount} ${suffix}`;
},
Expand All @@ -151,10 +163,13 @@ export default class StatsBarChart extends Mixins(mixins.LoadingMixin, ChartSpec
tooltip: this.tooltipSpec({
formatter: (params) => {
const { data } = params[0];
const [timestamp, value] = data;
const amount = formatDecimalPlaces(value);
const [, value] = data; // [timestamp, value]
return this.fees ? `${amount} ${XOR.symbol}` : `$ ${amount}`;
if (this.fees) {
return `${formatDecimalPlaces(value)} ${XOR.symbol}`; // fees are always in XOR
}
const currencyAmount = new FPNumber(value).mul(this.exchangeRate);
return `${this.currencySymbol} ${formatDecimalPlaces(currencyAmount)}`; // amount is in currency
},
}),
series: [
Expand Down
22 changes: 16 additions & 6 deletions src/components/pages/Stats/TvlChart.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,12 @@
:is-error="isFetchingError"
@retry="updateData"
>
<formatted-amount class="chart-price" :value="amount.amount" is-fiat-value>
<formatted-amount class="chart-price" :value="amount.amount">
<template #prefix>{{ currencySymbol }}</template>
{{ amount.suffix }}
</formatted-amount>
<price-change :value="priceChange" />
<v-chart ref="chart" class="chart" :option="chartSpec" autoresize />
<v-chart ref="chart" class="chart" :key="chartKey" :option="chartSpec" autoresize />
</chart-skeleton>
</base-widget>
</template>
Expand All @@ -32,6 +33,7 @@ import { Components } from '@/consts';
import { SECONDS_IN_TYPE, NETWORK_STATS_FILTERS } from '@/consts/snapshots';
import { ChartData, fetchData } from '@/indexer/queries/networkTvl';
import { lazyComponent } from '@/router';
import { getter } from '@/store/decorators';
import type { SnapshotFilter } from '@/types/filters';
import type { AmountWithSuffix } from '@/types/formats';
import { calcPriceChange, formatAmountWithSuffix, formatDecimalPlaces } from '@/utils';
Expand All @@ -46,6 +48,9 @@ import { calcPriceChange, formatAmountWithSuffix, formatDecimalPlaces } from '@/
},
})
export default class StatsTvlChart extends Mixins(mixins.LoadingMixin, ChartSpecMixin) {
@getter.wallet.settings.exchangeRate private exchangeRate!: number;
@getter.wallet.settings.currencySymbol private currencySymbol!: string;
readonly FontSizeRate = WALLET_CONSTS.FontSizeRate;
readonly FontWeightRate = WALLET_CONSTS.FontWeightRate;
readonly filters = NETWORK_STATS_FILTERS;
Expand All @@ -59,6 +64,10 @@ export default class StatsTvlChart extends Mixins(mixins.LoadingMixin, ChartSpec
this.updateData();
}
get chartKey(): string {
return `tvl-chart-${this.currencySymbol}-rate-${this.exchangeRate}`;
}
get firstValue(): FPNumber {
return new FPNumber(first(this.data)?.value ?? 0);
}
Expand All @@ -68,7 +77,7 @@ export default class StatsTvlChart extends Mixins(mixins.LoadingMixin, ChartSpec
}
get amount(): AmountWithSuffix {
return formatAmountWithSuffix(this.firstValue);
return formatAmountWithSuffix(this.firstValue.mul(this.exchangeRate));
}
get priceChange(): FPNumber {
Expand All @@ -89,7 +98,7 @@ export default class StatsTvlChart extends Mixins(mixins.LoadingMixin, ChartSpec
yAxis: this.yAxisSpec({
axisLabel: {
formatter: (value) => {
const val = new FPNumber(value);
const val = new FPNumber(value).mul(this.exchangeRate);
const { amount, suffix } = formatAmountWithSuffix(val);
return `${amount} ${suffix}`;
},
Expand All @@ -98,8 +107,9 @@ export default class StatsTvlChart extends Mixins(mixins.LoadingMixin, ChartSpec
tooltip: this.tooltipSpec({
formatter: (params) => {
const { data } = params[0];
const [timestamp, value] = data;
return `$ ${formatDecimalPlaces(value)}`;
const [, value] = data; // [timestamp, value]
const currencyValue = new FPNumber(value).mul(this.exchangeRate);
return `${this.currencySymbol} ${formatDecimalPlaces(currencyValue)}`;
},
}),
series: [
Expand Down
37 changes: 24 additions & 13 deletions src/components/shared/Dialog/SelectProvider.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import type { WalletInfo } from '@sora-test/wallet-connect/types';
},
})
export default class SelectProviderDialog extends Mixins(WalletConnectMixin) {
@state.wallet.account.isDesktop isDesktop!: boolean;
@state.web3.selectProviderDialogVisibility private selectProviderDialogVisibility!: boolean;
get visibility(): boolean {
Expand All @@ -37,21 +38,31 @@ export default class SelectProviderDialog extends Mixins(WalletConnectMixin) {
this.setSelectProviderDialogVisibility(flag);
}
get allowedProviders(): Provider[] {
if (this.isDesktop) {
return [Provider.WalletConnect];
}
return [Provider.Metamask, Provider.SubWallet, Provider.TrustWallet, Provider.WalletConnect];
}
get wallets(): WalletInfo[] {
return Object.keys(Provider).map((key) => {
const provider = Provider[key];
return Object.keys(Provider)
.filter((key) => this.allowedProviders.includes(key as Provider))
.map((key) => {
const provider = Provider[key];
return {
extensionName: provider,
title: provider,
chromeUrl: '',
mozillaUrl: '',
logo: {
src: this.getEvmProviderIcon(provider),
alt: provider,
},
};
});
return {
extensionName: provider,
title: provider,
chromeUrl: '',
mozillaUrl: '',
logo: {
src: this.getEvmProviderIcon(provider),
alt: provider,
},
};
});
}
get selectedProvider(): Nullable<Provider> {
Expand Down
Loading

0 comments on commit 9662924

Please sign in to comment.