From 7dc68d62fc1b455122a63c16941add091765c50c Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 31 Jul 2023 19:41:27 +0800 Subject: [PATCH 01/16] wip: Network status --- src/components/dashboard/Dashboard.vue | 23 +++- src/components/dashboard/NetworkStatus.vue | 106 ++++++++++++++++++ .../dashboard/styles/dashboard.scss | 24 +++- .../dashboard/styles/network-status.scss | 87 ++++++++++++++ src/i18n/en-US/index.ts | 4 + 5 files changed, 236 insertions(+), 8 deletions(-) create mode 100644 src/components/dashboard/NetworkStatus.vue create mode 100644 src/components/dashboard/styles/network-status.scss diff --git a/src/components/dashboard/Dashboard.vue b/src/components/dashboard/Dashboard.vue index b674775e4..149657896 100644 --- a/src/components/dashboard/Dashboard.vue +++ b/src/components/dashboard/Dashboard.vue @@ -1,12 +1,23 @@ diff --git a/src/components/dashboard/styles/network-status.scss b/src/components/dashboard/styles/network-status.scss index ec0a78cef..a298bd342 100644 --- a/src/components/dashboard/styles/network-status.scss +++ b/src/components/dashboard/styles/network-status.scss @@ -10,7 +10,6 @@ .container--value { padding: 8px 16px 32px; - // height: 138px; @media (min-width: $sm) { padding: 8px 24px 32px; @@ -41,6 +40,7 @@ .row--network { display: flex; justify-content: space-between; + align-items: center; } .column--network-name { @@ -56,32 +56,54 @@ } .container--xcm-restricted { - // background: #1d1c21; - background: rgba(240, 185, 11, 0.1); - // background: $warning-yellow; + background: rgba(240, 185, 11, 0.2); padding: 8px 16px 8px 16px; border-radius: 6px; + li { + color: $warning-yellow; + } } .column--status { align-self: flex-end; padding: 4px 24px 4px 24px; border-radius: 15px; + min-width: 110px; + text-align: center; } .status--success { - background-color: $gray-1; + background: rgba(86, 245, 102, 0.2); color: $connected-green; + font-weight: 500; +} + +.status--fixing { + background: rgba(255, 86, 33, 0.2); + color: $warning-red; + font-weight: 500; } -// li ::marker { -// color: red; -// background-color: red; -// } +.status--restricted { + background: rgba(240, 185, 11, 0.2); + color: $warning-yellow; + font-weight: 500; +} .body--dark { .status--success { background: rgba(86, 245, 102, 0.1); - // background-color: #060b23; + color: $connected-green; + } + .status--fixing { + background: rgba(255, 86, 33, 0.1); + color: $warning-red; + } + .status--restricted { + background: rgba(240, 185, 11, 0.1); + color: $warning-yellow; + } + .container--xcm-restricted { + background: rgba(240, 185, 11, 0.1); } } diff --git a/src/modules/xcm/index.ts b/src/modules/xcm/index.ts index 9b22b952d..c22e9aa4b 100644 --- a/src/modules/xcm/index.ts +++ b/src/modules/xcm/index.ts @@ -1,4 +1,5 @@ import { objToArray } from '@astar-network/astar-sdk-core'; +import { astarChain } from 'src/config/chain'; import { Chain, parachainIds, XcmChain } from 'src/v2/models'; export { @@ -254,3 +255,14 @@ export const kusamaParachains = xcmChains.filter( export const polkadotParachains = xcmChains.filter( (it) => it.relayChain === Chain.POLKADOT && it.name !== Chain.POLKADOT ); + +// Todo: ideally use a content management to manage it +export const restrictedNetworks = { + [astarChain.ASTAR]: ['XCM withdrawal to Moonbeam network by EVM wallets are temporary disabled'], + [astarChain.SHIDEN]: [ + 'XCM withdrawal to Moonriver network by EVM wallets are temporary disabled', + ], + [astarChain.SHIBUYA]: [], + [astarChain.DEVELOPMENT]: [], + [astarChain.ROCSTAR]: [], +}; From 995f9a34a4218c75c65b60ddb28625393e9de911 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Thu, 3 Aug 2023 11:59:08 +0800 Subject: [PATCH 03/16] styles: finished basing styling (2) --- src/components/dashboard/styles/dashboard.scss | 6 +++++- src/components/dashboard/styles/network-status.scss | 4 ++++ 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/src/components/dashboard/styles/dashboard.scss b/src/components/dashboard/styles/dashboard.scss index fa0a0e825..dca4f279f 100644 --- a/src/components/dashboard/styles/dashboard.scss +++ b/src/components/dashboard/styles/dashboard.scss @@ -32,7 +32,8 @@ row-gap: 24px; column-gap: 32px; @media (min-width: $xxl) { - row-gap: 32px; + display: grid; + align-content: space-between; } } @@ -123,6 +124,9 @@ .skeleton--value-panel { height: 138px; + @media (min-width: $xxl) { + width: 560px; + } } .container--value { diff --git a/src/components/dashboard/styles/network-status.scss b/src/components/dashboard/styles/network-status.scss index a298bd342..9ac13573f 100644 --- a/src/components/dashboard/styles/network-status.scss +++ b/src/components/dashboard/styles/network-status.scss @@ -31,6 +31,10 @@ padding: 40px 8px 0px 8px; } +.row--title { + margin-top: 16px; +} + .row--network-statuses { display: flex; flex-direction: column; From 50cb63181fab1476b104b1ffe07e099cf765846c Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Thu, 3 Aug 2023 17:13:09 +0800 Subject: [PATCH 04/16] feat: added logic --- src/components/dashboard/NetworkStatus.vue | 195 ++++++++++++++---- .../dashboard/styles/network-status.scss | 2 +- src/i18n/en-US/index.ts | 5 + src/modules/xcm/index.ts | 6 +- 4 files changed, 161 insertions(+), 47 deletions(-) diff --git a/src/components/dashboard/NetworkStatus.vue b/src/components/dashboard/NetworkStatus.vue index f72b8cf91..a1b52a8b5 100644 --- a/src/components/dashboard/NetworkStatus.vue +++ b/src/components/dashboard/NetworkStatus.vue @@ -1,5 +1,5 @@ diff --git a/src/components/common/LocaleChanger.vue b/src/components/common/LocaleChanger.vue index 190da86b0..847e8382b 100644 --- a/src/components/common/LocaleChanger.vue +++ b/src/components/common/LocaleChanger.vue @@ -29,7 +29,6 @@ export default defineComponent({ () => { selectedLang.value = languagesSelector.find((lang) => lang.code === locale.value) || languagesSelector[0]; - console.log(selectedLang.value); }, { immediate: true } ); diff --git a/src/components/dashboard/NetworkStatus.vue b/src/components/dashboard/NetworkStatus.vue index 0d357c8f0..8a7976215 100644 --- a/src/components/dashboard/NetworkStatus.vue +++ b/src/components/dashboard/NetworkStatus.vue @@ -57,7 +57,9 @@
- {{ $t('assets.xcm') }} + + {{ $t('dashboard.network.xcmDepositWithdrawalAssets') }} +
diff --git a/src/components/dashboard/Collators.vue b/src/components/dashboard/Collators.vue new file mode 100644 index 000000000..a93dd2f27 --- /dev/null +++ b/src/components/dashboard/Collators.vue @@ -0,0 +1,74 @@ + + + + + diff --git a/src/components/dashboard/CollatorsValueHalf.vue b/src/components/dashboard/CollatorsValueHalf.vue new file mode 100644 index 000000000..c4e9d6d0d --- /dev/null +++ b/src/components/dashboard/CollatorsValueHalf.vue @@ -0,0 +1,52 @@ + + + + + diff --git a/src/components/dashboard/Dashboard.vue b/src/components/dashboard/Dashboard.vue index 149657896..68d026f81 100644 --- a/src/components/dashboard/Dashboard.vue +++ b/src/components/dashboard/Dashboard.vue @@ -12,8 +12,8 @@
-
- +
+
diff --git a/src/components/dashboard/styles/collators.scss b/src/components/dashboard/styles/collators.scss deleted file mode 100644 index d18094091..000000000 --- a/src/components/dashboard/styles/collators.scss +++ /dev/null @@ -1,57 +0,0 @@ -@import 'src/css/quasar.variables.scss'; - -.wrapper--value { - width: 100%; - height: 138px; - display: grid; - grid-template-columns: auto auto; - column-gap: 24px; - box-shadow: $container-border-shadow-light; - background: $container-bg-white; - - border-radius: 6px; - padding: 8px 16px; - @media (min-width: $md) { - padding: 8px 24px; - } - @media (min-width: $xxl) { - width: 560px !important; - } -} - -.skeleton--value-panel { - height: 138px; - @media (min-width: $xxl) { - width: 560px; - } -} - -.align-right { - padding: 16px 8px 0px 8px; - text-align: end; -} - -.container--title--color { - color: #b1b7c1; -} - -.container--value { - padding: 16px 8px 32px; -} - -.text--value { - font-size: 26px; - font-weight: 500; -} - -.row--value { - display: flex; - justify-content: flex-end; -} - -.body--dark { - .wrapper--value { - background: $container-bg-dark; - box-shadow: $container-border-shadow-dark; - } -} diff --git a/src/components/dashboard/styles/dashboard.scss b/src/components/dashboard/styles/dashboard.scss index dca4f279f..34a23f453 100644 --- a/src/components/dashboard/styles/dashboard.scss +++ b/src/components/dashboard/styles/dashboard.scss @@ -183,6 +183,11 @@ } } +.row--value-icon { + display: flex; + justify-content: flex-end; +} + .body--dark { .filter--tabs { border: 1px solid $gray-5-selected-dark; diff --git a/src/hooks/useNetworkInfo.ts b/src/hooks/useNetworkInfo.ts index 7eb2f737a..1616f5cce 100644 --- a/src/hooks/useNetworkInfo.ts +++ b/src/hooks/useNetworkInfo.ts @@ -8,6 +8,8 @@ import { import { getProviderIndex, providerEndpoints } from 'src/config/chainEndpoints'; import { useStore } from 'src/store'; import { computed } from 'vue'; +import { polkadotJsUrl } from 'src/links'; +import { endpointKey } from 'src/config/chainEndpoints'; export function isCustomNetwork(network: string) { return network === 'custom-network'; @@ -58,6 +60,15 @@ export function useNetworkInfo() { return !isMainnet.value; }); + const polkadotJsLink = computed(() => { + const { astar, shiden, shibuya } = polkadotJsUrl.settings; + return currentNetworkIdx.value === endpointKey.ASTAR + ? astar + : currentNetworkIdx.value === endpointKey.SHIDEN + ? shiden + : shibuya; + }); + return { isMainnet, currentNetworkChain, @@ -66,5 +77,6 @@ export function useNetworkInfo() { currentNetworkName, nativeTokenSymbol, isSupportXvmTransfer, + polkadotJsLink, }; } diff --git a/src/i18n/en-US/index.ts b/src/i18n/en-US/index.ts index 71464a28d..30bebab60 100644 --- a/src/i18n/en-US/index.ts +++ b/src/i18n/en-US/index.ts @@ -503,6 +503,7 @@ export default { dashboard: { dashboard: 'Dashboard', tvl: 'TVL', + collators: 'Collators', circulating: { circulatingSupply: 'Circulating Supply', supply: 'of {totalSupply}: ', diff --git a/src/links/index.ts b/src/links/index.ts index 06b10fb29..b437fddf8 100644 --- a/src/links/index.ts +++ b/src/links/index.ts @@ -28,17 +28,16 @@ export const deepLink = { // Memo: use for debugging export const devOrigin = 'http://localhost:8080'; export const stagingOrigin = 'https://staging.portal.astar.network'; -// export const productionOrigin = 'https://portal.astar.network'; -export const productionOrigin = devOrigin; +export const productionOrigin = 'https://portal.astar.network'; export const decentralizedOrigin = 'https://decentralized.portal.astar.network'; export const polkasafeUrl = 'https://app.polkasafe.xyz'; export const polkadotJsUrl = { settings: { - astar: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.astar.network#/settings', - shiden: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.shiden.astar.network#/settings', - shibuya: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.shibuya.astar.network#/settings', + astar: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.astar.network#', + shiden: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.shiden.astar.network#', + shibuya: 'https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.shibuya.astar.network#', }, }; diff --git a/src/modules/xcm/index.ts b/src/modules/xcm/index.ts index 5fcaf7e95..466640530 100644 --- a/src/modules/xcm/index.ts +++ b/src/modules/xcm/index.ts @@ -256,12 +256,6 @@ export const polkadotParachains = xcmChains.filter( (it) => it.relayChain === Chain.POLKADOT && it.name !== Chain.POLKADOT ); -enum XcmMode { - deposit = 'Deposit', - withdrawal = 'Withdrawal', - evmWithdrawal = 'EVM Withdrawal', -} - // Todo: ideally use a content management to manage it export const restrictedXcmNetwork = { [astarChain.ASTAR]: [ @@ -270,11 +264,6 @@ export const restrictedXcmNetwork = { isRestrictedFromNative: false, isRestrictedFromEvm: true, }, - // { - // chain: Chain.ACALA, - // isRestrictedFromNative: true, - // isRestrictedFromEvm: true, - // }, ], [astarChain.SHIDEN]: [ { @@ -282,11 +271,6 @@ export const restrictedXcmNetwork = { isRestrictedFromNative: false, isRestrictedFromEvm: true, }, - // { - // chain: Chain.KARURA, - // isRestrictedFromNative: true, - // isRestrictedFromEvm: true, - // }, ], [astarChain.SHIBUYA]: [], [astarChain.DEVELOPMENT]: [], From 5a25974d30928f2b27383d5fa402983fcc32865e Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 17:16:02 +0800 Subject: [PATCH 09/16] feat: added test --- src/components/dashboard/Collators.vue | 2 +- src/links/index.ts | 3 ++- tests/common-api.ts | 2 ++ tests/common.ts | 3 +++ tests/test_specs/dashboard.spec.ts | 22 +++++++++++++++++++++- 5 files changed, 29 insertions(+), 3 deletions(-) diff --git a/src/components/dashboard/Collators.vue b/src/components/dashboard/Collators.vue index f5e715117..47c590714 100644 --- a/src/components/dashboard/Collators.vue +++ b/src/components/dashboard/Collators.vue @@ -2,7 +2,7 @@
-
+
{{ $t('dashboard.collators') }} diff --git a/src/links/index.ts b/src/links/index.ts index b437fddf8..206be2dc1 100644 --- a/src/links/index.ts +++ b/src/links/index.ts @@ -28,7 +28,8 @@ export const deepLink = { // Memo: use for debugging export const devOrigin = 'http://localhost:8080'; export const stagingOrigin = 'https://staging.portal.astar.network'; -export const productionOrigin = 'https://portal.astar.network'; +// export const productionOrigin = 'https://portal.astar.network'; +export const productionOrigin = devOrigin; export const decentralizedOrigin = 'https://decentralized.portal.astar.network'; export const polkasafeUrl = 'https://app.polkasafe.xyz'; diff --git a/tests/common-api.ts b/tests/common-api.ts index 89307ac24..a7a848b00 100644 --- a/tests/common-api.ts +++ b/tests/common-api.ts @@ -128,3 +128,5 @@ export const roundUpAndTruncateBigInt = async ( // Truncate the remaining digits by dividing by power of 10n return bigIntValue / powerOf10; }; + +export const checkIsLightClient = (endpoint: string): boolean => endpoint.startsWith('light://'); diff --git a/tests/common.ts b/tests/common.ts index 8e00faab1..2b129778c 100644 --- a/tests/common.ts +++ b/tests/common.ts @@ -167,3 +167,6 @@ export const changeNetworkOnEVM = async (page: Page, context: BrowserContext): P .getByRole('button', { name: 'Switch network' }) .click(); }; + +// Memo: importing this function from 'connectApi.ts' makes error in the test. +export const checkIsLightClient = (endpoint: string): boolean => endpoint.startsWith('light://'); diff --git a/tests/test_specs/dashboard.spec.ts b/tests/test_specs/dashboard.spec.ts index 724dfd184..a0851e6dd 100644 --- a/tests/test_specs/dashboard.spec.ts +++ b/tests/test_specs/dashboard.spec.ts @@ -1,10 +1,25 @@ import { expect, test } from '@playwright/test'; -import { checkIsLightClient } from 'src/config/api/polkadot/connectApi'; import { endpointKey } from 'src/config/chainEndpoints'; import { providerEndpoints } from 'src/config/chainEndpoints'; +import { getApi, checkIsLightClient } from '../common-api'; +import { ApiPromise } from '@polkadot/api'; +import { clickPolicyButton } from 'src/modules/playwright'; + +let api: ApiPromise; + +test.beforeAll(async () => { + api = await getApi(); +}); + +test.afterAll(async () => { + await api.disconnect(); +}); test.beforeEach(async ({ page }) => { await page.goto('/astar/dashboard'); + await clickPolicyButton(page); + const closeButton = page.getByText('Polkadot.js'); + await closeButton.click(); }); test.describe('on dashboard screen', () => { @@ -36,4 +51,9 @@ test.describe('on dashboard screen', () => { expect(isSomeOfAstarEndpoints).toBe(true); expect(isLightClient).toBe(false); }); + + test('display network statuses', async ({ page }) => { + const ui = page.getByTestId('network-statuses'); + await expect(ui).toBeVisible(); + }); }); From 26f2319384aa5a7b471c1fb642e3b0dc4aa5e329 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 17:25:43 +0800 Subject: [PATCH 10/16] feat: added test (2) --- src/components/dashboard/Collators.vue | 2 +- src/components/dashboard/NetworkStatus.vue | 2 +- tests/test_specs/dashboard.spec.ts | 7 ++++++- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/dashboard/Collators.vue b/src/components/dashboard/Collators.vue index 47c590714..ad3332ce2 100644 --- a/src/components/dashboard/Collators.vue +++ b/src/components/dashboard/Collators.vue @@ -2,7 +2,7 @@
-
+
{{ $t('dashboard.collators') }} diff --git a/src/components/dashboard/NetworkStatus.vue b/src/components/dashboard/NetworkStatus.vue index 8a7976215..08b108864 100644 --- a/src/components/dashboard/NetworkStatus.vue +++ b/src/components/dashboard/NetworkStatus.vue @@ -2,7 +2,7 @@
-
+
diff --git a/tests/test_specs/dashboard.spec.ts b/tests/test_specs/dashboard.spec.ts index a0851e6dd..3e4f81e90 100644 --- a/tests/test_specs/dashboard.spec.ts +++ b/tests/test_specs/dashboard.spec.ts @@ -52,8 +52,13 @@ test.describe('on dashboard screen', () => { expect(isLightClient).toBe(false); }); - test('display network statuses', async ({ page }) => { + test('display network statuses panel', async ({ page }) => { const ui = page.getByTestId('network-statuses'); await expect(ui).toBeVisible(); }); + + test('display collators panel', async ({ page }) => { + const ui = page.getByTestId('collators-panel'); + await expect(ui).toBeVisible(); + }); }); From 9c104286f339ed50cb52fbbbdcf4b8a72e28e1f8 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 19:29:06 +0800 Subject: [PATCH 11/16] fix: removed version information on the network button --- src/components/header/NetworkButton.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/components/header/NetworkButton.vue b/src/components/header/NetworkButton.vue index c41d22152..39a0a48b9 100644 --- a/src/components/header/NetworkButton.vue +++ b/src/components/header/NetworkButton.vue @@ -26,9 +26,6 @@
- -
-
From 77fb9ef9daa11f109ededdcbc5d64c46b6ff4c1b Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 19:33:26 +0800 Subject: [PATCH 12/16] fix: removed version information on the network button (2) --- src/components/header/NetworkButton.vue | 22 ---------------------- 1 file changed, 22 deletions(-) diff --git a/src/components/header/NetworkButton.vue b/src/components/header/NetworkButton.vue index 39a0a48b9..7ccf836c3 100644 --- a/src/components/header/NetworkButton.vue +++ b/src/components/header/NetworkButton.vue @@ -50,49 +50,27 @@ export default defineComponent({ const { width, screenSize } = useBreakpoints(); const store = useStore(); const isNotSelectedEndpoint = localStorage.getItem(LOCAL_STORAGE.SELECTED_ENDPOINT) === null; - const currentNetworkStatus = computed(() => store.getters['general/networkStatus']); const currentNetworkIdx = computed(() => store.getters['general/networkIdx']); - const chainInfo = computed(() => store.getters['general/chainInfo']); - const metaExtensions = computed(() => store.getters['general/metaExtensions']); const extensionCount = computed(() => store.getters['general/extensionCount']); const currentNetworkName = ref(providerEndpoints[currentNetworkIdx.value].displayName); const currentLogo = ref(providerEndpoints[currentNetworkIdx.value].defaultLogo); const isLatestChain = ref(false); - const version = ref('0.0.0'); watch(currentNetworkIdx, (networkIdx) => { currentNetworkName.value = providerEndpoints[networkIdx].displayName; currentLogo.value = providerEndpoints[networkIdx].defaultLogo; }); - watch( - () => chainInfo.value, - () => { - version.value = `0.0.${chainInfo.value?.specVersion}`; - } - ); - - watch( - () => metaExtensions.value, - () => { - if (metaExtensions?.value?.extensions.length > 0) { - version.value = metaExtensions?.value?.extensions[0].extension.version; - } - } - ); - const showNetworkModal = () => { emit('show-network'); }; return { isNotSelectedEndpoint, - currentNetworkStatus, currentNetworkName, currentLogo, isLatestChain, extensionCount, - version, width, screenSize, showNetworkModal, From bb353b5b88fc76cfc6adf93f56f2344f44055d48 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 19:50:34 +0800 Subject: [PATCH 13/16] refactor: clean up --- tests/test_specs/dashboard.spec.ts | 13 +------------ 1 file changed, 1 insertion(+), 12 deletions(-) diff --git a/tests/test_specs/dashboard.spec.ts b/tests/test_specs/dashboard.spec.ts index 3e4f81e90..1dfa27f65 100644 --- a/tests/test_specs/dashboard.spec.ts +++ b/tests/test_specs/dashboard.spec.ts @@ -1,20 +1,9 @@ import { expect, test } from '@playwright/test'; import { endpointKey } from 'src/config/chainEndpoints'; import { providerEndpoints } from 'src/config/chainEndpoints'; -import { getApi, checkIsLightClient } from '../common-api'; -import { ApiPromise } from '@polkadot/api'; +import { checkIsLightClient } from '../common-api'; import { clickPolicyButton } from 'src/modules/playwright'; -let api: ApiPromise; - -test.beforeAll(async () => { - api = await getApi(); -}); - -test.afterAll(async () => { - await api.disconnect(); -}); - test.beforeEach(async ({ page }) => { await page.goto('/astar/dashboard'); await clickPolicyButton(page); From 67fd6cd48df70fb275cfc1db92106ab13f3fa46c Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 19:51:51 +0800 Subject: [PATCH 14/16] fix: links --- src/links/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/links/index.ts b/src/links/index.ts index 206be2dc1..6d990b235 100644 --- a/src/links/index.ts +++ b/src/links/index.ts @@ -26,10 +26,10 @@ export const deepLink = { }; // Memo: use for debugging -export const devOrigin = 'http://localhost:8080'; +// export const devOrigin = 'http://localhost:8080'; export const stagingOrigin = 'https://staging.portal.astar.network'; -// export const productionOrigin = 'https://portal.astar.network'; -export const productionOrigin = devOrigin; +export const productionOrigin = 'https://portal.astar.network'; +// export const productionOrigin = devOrigin; export const decentralizedOrigin = 'https://decentralized.portal.astar.network'; export const polkasafeUrl = 'https://app.polkasafe.xyz'; From 4e6150553bf6043667c7b98737a6bec2704c2040 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Mon, 7 Aug 2023 19:53:06 +0800 Subject: [PATCH 15/16] fix: added comments --- src/links/index.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/links/index.ts b/src/links/index.ts index 6d990b235..f0bb05b4b 100644 --- a/src/links/index.ts +++ b/src/links/index.ts @@ -29,6 +29,7 @@ export const deepLink = { // export const devOrigin = 'http://localhost:8080'; export const stagingOrigin = 'https://staging.portal.astar.network'; export const productionOrigin = 'https://portal.astar.network'; +// Memo: for debugging // export const productionOrigin = devOrigin; export const decentralizedOrigin = 'https://decentralized.portal.astar.network'; From 7044a6aec458a356d8ac2f04e26f2f42301409a9 Mon Sep 17 00:00:00 2001 From: impelcrypto Date: Tue, 8 Aug 2023 12:31:12 +0800 Subject: [PATCH 16/16] fix: styling --- src/components/dashboard/Collators.vue | 11 +++-------- src/components/dashboard/NetworkStatus.vue | 2 +- src/components/dashboard/styles/dashboard.scss | 6 ++++++ src/css/text.scss | 9 ++++++++- 4 files changed, 18 insertions(+), 10 deletions(-) diff --git a/src/components/dashboard/Collators.vue b/src/components/dashboard/Collators.vue index ad3332ce2..603b77681 100644 --- a/src/components/dashboard/Collators.vue +++ b/src/components/dashboard/Collators.vue @@ -8,18 +8,13 @@ {{ $t('dashboard.collators') }}
-
+
{{ collators.length }}
-
- +
+ diff --git a/src/components/dashboard/NetworkStatus.vue b/src/components/dashboard/NetworkStatus.vue index 08b108864..df4bf4891 100644 --- a/src/components/dashboard/NetworkStatus.vue +++ b/src/components/dashboard/NetworkStatus.vue @@ -17,7 +17,7 @@ {{ network.name }}
- + {{ $t('dashboard.network.updatedAgo', { time: network.timeAgo }) }}
diff --git a/src/components/dashboard/styles/dashboard.scss b/src/components/dashboard/styles/dashboard.scss index 34a23f453..d70cb8953 100644 --- a/src/components/dashboard/styles/dashboard.scss +++ b/src/components/dashboard/styles/dashboard.scss @@ -186,6 +186,12 @@ .row--value-icon { display: flex; justify-content: flex-end; + align-items: center; + column-gap: 6px; +} + +.link--icon { + margin-top: 2px; } .body--dark { diff --git a/src/css/text.scss b/src/css/text.scss index 694b9bcac..4732d52af 100644 --- a/src/css/text.scss +++ b/src/css/text.scss @@ -63,6 +63,12 @@ span { color: $gray-4; } +.text--label-small { + font-weight: 400; + font-size: 12px; + color: $gray-4; +} + .text--tooltip { font-weight: 400; font-size: 12px; @@ -117,7 +123,8 @@ input::placeholder { .text-color--neon { color: $astar-blue-dark; } - .text--label { + .text--label, + .text--label-small { color: $gray-3; } .text-color--disabled {