diff --git a/quasar.conf.js b/quasar.conf.js index deef1ec28..703818f3c 100644 --- a/quasar.conf.js +++ b/quasar.conf.js @@ -30,7 +30,7 @@ module.exports = function(/* ctx */) { // app boot file (/src/boot) // --> boot files are part of "main.js" // https://quasar.dev/quasar-cli/boot-files - boot: ['ual', 'hyperion', 'i18n', 'fuel', 'api', 'errorHandling', 'helpers', 'mixin', 'emitter', 'telosApi', 'wagmi', 'antelope'], + boot: ['ual', 'i18n', 'fuel', 'api', 'errorHandling', 'helpers', 'mixin', 'emitter', 'telosApi', 'wagmi', 'antelope'], // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css css: ['index.scss'], diff --git a/src/App.vue b/src/App.vue index dc13a9894..e5a9244de 100644 --- a/src/App.vue +++ b/src/App.vue @@ -5,8 +5,6 @@ import { TELOS_CHAIN_IDS } from 'src/antelope/chains/chain-constants'; import packageInfo from '../package.json'; import { defineComponent } from 'vue'; -export const isTodayBeforeTelosCloudDown = new Date().getTime() < new Date('2023-12-31').getTime(); - export default defineComponent({ name: 'App', created() { @@ -44,16 +42,15 @@ export default defineComponent({ } }, mounted() { - const chainSettings = useChainStore().currentChain.settings as EVMChainSettings; - // if the organization using this application is Telos, import Fathom analytics - if (TELOS_CHAIN_IDS.includes(chainSettings.getChainId())) { - const script = document.createElement('script'); - script.src = 'https://cdn.usefathom.com/script.js'; - script.dataset.site = 'ISPYEAKT'; - script.dataset.spa = 'auto'; - script.defer = true; - document.body.appendChild(script); - } + + // Telos Wallet allows users to switch between Telos Zero and Telos EVM. + // The loading of this script should be independent of the chain the user is on. + const script = document.createElement('script'); + script.src = 'https://cdn.usefathom.com/script.js'; + script.dataset.site = 'ISPYEAKT'; + script.dataset.spa = 'auto'; + script.defer = true; + document.body.appendChild(script); }, }); diff --git a/src/antelope/chains/evm/telos-evm-testnet/index.ts b/src/antelope/chains/evm/telos-evm-testnet/index.ts index 3ca376f6b..2d606ac42 100644 --- a/src/antelope/chains/evm/telos-evm-testnet/index.ts +++ b/src/antelope/chains/evm/telos-evm-testnet/index.ts @@ -9,7 +9,7 @@ import { getFiatPriceFromIndexer } from 'src/api/price'; const LOGO = 'https://raw.githubusercontent.com/telosnetwork/token-list/main/logos/telos.png'; const CHAIN_ID = '41'; export const NETWORK = 'telos-evm-testnet'; -const DISPLAY = 'Telos EVM Testnet'; +const DISPLAY = 'Telos EVM (Testnet)'; const TOKEN = new TokenClass({ name: 'Telos', symbol: 'TLOS', diff --git a/src/antelope/chains/evm/telos-evm/index.ts b/src/antelope/chains/evm/telos-evm/index.ts index 9669b3403..3a4099350 100644 --- a/src/antelope/chains/evm/telos-evm/index.ts +++ b/src/antelope/chains/evm/telos-evm/index.ts @@ -9,7 +9,7 @@ import { getFiatPriceFromIndexer } from 'src/api/price'; const LOGO = 'https://raw.githubusercontent.com/telosnetwork/token-list/main/logos/telos.png'; const CHAIN_ID = '40'; export const NETWORK = 'telos-evm'; -const DISPLAY = 'Telos EVM Mainnet'; +const DISPLAY = 'Telos EVM'; const TOKEN = new TokenClass({ name: 'Telos', symbol: 'TLOS', diff --git a/src/antelope/chains/native/telos-testnet/index.ts b/src/antelope/chains/native/telos-testnet/index.ts index ae520eaa5..1d26c598b 100644 --- a/src/antelope/chains/native/telos-testnet/index.ts +++ b/src/antelope/chains/native/telos-testnet/index.ts @@ -3,10 +3,11 @@ import { RpcEndpoint } from 'universal-authenticator-library'; import { api } from 'src/api'; import { TokenClass, TokenSourceInfo, PriceChartData, Theme } from 'src/antelope/types'; +const LOGO = 'https://raw.githubusercontent.com/telosnetwork/token-list/main/logos/telos.png'; const CHAIN_ID = '1eaa0824707c8c16bd25145493bf062aecddfeb56c736f6ba6397f3195f33c9f'; const NETWORK = 'telos-testnet'; -const DISPLAY = 'Telos'; +const DISPLAY = 'Telos Zero (Testnet)'; const TOKEN = new TokenClass({ symbol: 'TLOS', precision: 4, @@ -95,11 +96,11 @@ export default class TelosTestnet extends NativeChainSettings { } getLargeLogoPath(): string { - return 'chains/telos/telos_logo.svg'; + return LOGO; } getSmallLogoPath(): string { - return 'chains/telos/tlos.png'; + return LOGO; } getMapDisplay(): boolean { diff --git a/src/antelope/chains/native/telos/index.ts b/src/antelope/chains/native/telos/index.ts index 20be122dd..7e08c15ab 100644 --- a/src/antelope/chains/native/telos/index.ts +++ b/src/antelope/chains/native/telos/index.ts @@ -3,10 +3,11 @@ import { RpcEndpoint } from 'universal-authenticator-library'; import { api } from 'src/api'; import { TokenClass, TokenSourceInfo, PriceChartData, Theme } from 'src/antelope/types'; +const LOGO = 'https://raw.githubusercontent.com/telosnetwork/token-list/main/logos/telos.png'; const CHAIN_ID = '4667b205c6838ef70ff7988f6e8257e8be0e1284a2f59699054a018f743b1d11'; const NETWORK = 'telos'; -const DISPLAY = 'Telos'; +const DISPLAY = 'Telos Zero'; const TOKEN = new TokenClass({ symbol: 'TLOS', precision: 4, @@ -98,11 +99,11 @@ export default class Telos extends NativeChainSettings { } getLargeLogoPath(): string { - return 'chains/telos/telos_logo.svg'; + return LOGO; } getSmallLogoPath(): string { - return 'chains/telos/tlos.png'; + return LOGO; } getMapDisplay(): boolean { diff --git a/src/antelope/index.ts b/src/antelope/index.ts index 8c399e3f0..960c3f78e 100644 --- a/src/antelope/index.ts +++ b/src/antelope/index.ts @@ -64,6 +64,13 @@ export class Antelope { this.config.init(app); this.wallets.init(); + // each time the user changes the network, + // we need to reset the current web3 provider instance + events.onNetworkChanged.subscribe(() => { + this.wallets.resetWeb3Provider(); + }); + + // call for the first time useXStore for all X stores in Antelope library const stores = this.stores; diff --git a/src/antelope/stores/account.ts b/src/antelope/stores/account.ts index 5a52645fa..0218e1e05 100644 --- a/src/antelope/stores/account.ts +++ b/src/antelope/stores/account.ts @@ -20,7 +20,6 @@ import { initFuelUserWrapper } from 'src/api/fuel'; import { createTraceFunction, errorToString } from 'src/antelope/config'; import NativeChainSettings from 'src/antelope/chains/NativeChainSettings'; import { - Action, Label, NativeTransactionResponse, addressString, @@ -29,7 +28,6 @@ import { EVMAuthenticator } from 'src/antelope/wallets'; import { truncateAddress } from 'src/antelope/stores/utils/text-utils'; import { toRaw } from 'vue'; import { getAddress } from 'ethers/lib/utils'; -import { OreIdAuthenticator } from 'ual-oreid'; // dependencies -- import { @@ -40,7 +38,7 @@ import { } from 'src/antelope'; -export interface LoginNativeActionData { +export interface loginZeroActionData { authenticator: Authenticator, network: string, } @@ -113,15 +111,17 @@ export const useAccountStore = defineStore(store_name, { }, actions: { trace: createTraceFunction(store_name), - async loginNative({ authenticator, network }: LoginNativeActionData): Promise { - this.trace('loginNative', authenticator, network); + async loginZero({ authenticator, network }: loginZeroActionData): Promise { + this.trace('loginZero', authenticator, network); let success = false; try { + this.trace('loginZero', 'authenticator.init()...'); await authenticator.init(); + this.trace('loginZero', 'authenticator.login()...'); const ualUsers = await authenticator.login(); if (ualUsers?.length) { - // OreId has it's own authorization service, only init fuel service for other ual users - const ualUser = ualUsers[0] instanceof OreIdAuthenticator ? ualUsers[0] : await initFuelUserWrapper(ualUsers[0]); + this.trace('loginZero', 'authenticator.login() OK! ualUsers:', ualUsers); + const ualUser = await initFuelUserWrapper(ualUsers[0]); const permission = (ualUser as unknown as { requestPermission: string }) .requestPermission ?? 'active'; const account = await ualUser.getAccountName(); @@ -246,8 +246,10 @@ export const useAccountStore = defineStore(store_name, { const rawAddress = localStorage.getItem('rawAddress'); const isNative = localStorage.getItem('isNative') === 'true'; const autoLogin = localStorage.getItem('autoLogin'); - this.trace('autoLogin', account, isNative, autoLogin); + this.trace('autoLogin', account, network, autoLogin, isNative, this.__accounts[label]); if (account && network && autoLogin && !this.__accounts[label]) { + // Ensure we are working with the correct network + useChainStore().setChain(label, network); if (isNative) { const authenticators = getAntelope().config.authenticatorsGetter(); const authenticator = authenticators.find( @@ -257,7 +259,7 @@ export const useAccountStore = defineStore(store_name, { console.error(authenticators.map(a => a.getName()).join(', ')); throw new Error('antelope.account.error_auto_login'); } - this.loginNative({ + this.loginZero({ authenticator, network, }); @@ -274,6 +276,8 @@ export const useAccountStore = defineStore(store_name, { autoLogAccount, }); } + } else { + this.trace('autoLogin', 'canceled!', account, network, autoLogin, !this.__accounts[label]); } } catch (error) { console.error('Error: ', errorToString(error)); @@ -326,7 +330,6 @@ export const useAccountStore = defineStore(store_name, { this.trace('sendAction', account, data, name, actor, permission); try { useFeedbackStore().setLoading('account.sendAction'); - console.error('Account.sendAction() not implemented', account, data, name, actor, permission); return Promise.resolve({ hash: '0x0' } as NativeTransactionResponse); } catch (error) { console.error('Error: ', errorToString(error)); @@ -336,16 +339,6 @@ export const useAccountStore = defineStore(store_name, { } }, - async sendTransaction(actions: Action[]) { - this.trace('sendTransaction', actions); - try { - useFeedbackStore().setLoading('account.sendTransaction'); - console.error('Account.sendTransaction() not implemented', actions); - } catch (error) { - console.error('Error: ', errorToString(error)); - } - }, - async fetchAccountDataFor(label: string, account: AccountModel) { this.trace('fetchAccountDataFor', account); try { @@ -395,4 +388,3 @@ export const useAccountStore = defineStore(store_name, { const accountInitialState: AccountState = { __accounts: {}, }; - diff --git a/src/antelope/stores/chain.ts b/src/antelope/stores/chain.ts index ad586f71d..24d073a36 100644 --- a/src/antelope/stores/chain.ts +++ b/src/antelope/stores/chain.ts @@ -53,7 +53,7 @@ import { } from 'src/antelope'; -export const settings: { [key: string]: ChainSettings } = { +export const settings: { [network: string]: ChainSettings } = { // Native chains 'eos': new EOS('eos'), 'telos': new Telos('telos'), @@ -66,6 +66,8 @@ export const settings: { [key: string]: ChainSettings } = { 'telos-evm-testnet': new TelosEVMTestnet('telos-evm-testnet'), }; +export const chains: { [network: string]: ChainModel } = {}; + export interface ChainModel { lastUpdate: number; apy: string; @@ -167,7 +169,7 @@ export const useChainStore = defineStore(store_name, { async updateSettings(label: string): Promise { this.trace('updateSettings', label); try { - const settings = this.getChain(label).settings as EVMChainSettings; + const settings = useChainStore().getChain(label).settings as EVMChainSettings; settings.init().then(() => { this.trace('updateSettings', label, '-> onChainIndexerReady.next()'); getAntelope().events.onChainIndexerReady.next({ label, ready: true }); @@ -183,7 +185,7 @@ export const useChainStore = defineStore(store_name, { async updateApy(label: string): Promise { useFeedbackStore().setLoading('updateApy'); this.trace('updateApy', label); - const chain = this.getChain(label); + const chain = useChainStore().getChain(label); try { chain.apy = await chain.settings.getApy(); } catch (error) { @@ -205,7 +207,7 @@ export const useChainStore = defineStore(store_name, { const stkToken = chain_settings.getStakedSystemToken(); const abi = [stlosAbiPreviewDeposit[0], stlosAbiPreviewRedeem[0]]; - const provider = await getAntelope().wallets.getWeb3Provider(); + const provider = await getAntelope().wallets.getWeb3Provider(label); const contractInstance = new ethers.Contract(stkToken.address, abi, provider); // Now we preview a deposit of 1 SYS to get the ratio const oneSys = ethers.utils.parseUnits('1.0', sysToken.decimals); @@ -224,7 +226,7 @@ export const useChainStore = defineStore(store_name, { async updateGasPrice(label: string): Promise { useFeedbackStore().setLoading('updateGasPrice'); this.trace('updateGasPrice'); - const chain = this.getChain(label); + const chain = useChainStore().getChain(label); try { if (!chain.settings.isNative()) { const wei = await (chain.settings as EVMChainSettings).getGasPrice(); @@ -241,7 +243,7 @@ export const useChainStore = defineStore(store_name, { async updateTokenList(label: string): Promise { useFeedbackStore().setLoading('updateTokenList'); this.trace('updateTokenList'); - const chain = this.getChain(label); + const chain = useChainStore().getChain(label); try { if (chain.settings.isNative()) { chain.tokens = await (chain.settings as NativeChainSettings).getTokenList(); @@ -259,9 +261,15 @@ export const useChainStore = defineStore(store_name, { setChain(label: string, network: string) { this.trace('setChain', label, network); if (network in settings) { + + // create the chain model if it doesn't exist + if (!chains[network]) { + chains[network] = newChainModel(network, settings[network].isNative()); + } + // make the change only if they are different if (network !== this.__chains[label]?.settings.getNetwork()) { - this.__chains[label] = newChainModel(network, settings[network].isNative()); + this.__chains[label] = chains[network]; this.trace('setChain', label, network, '--> void this.updateChainData(label);'); void this.updateChainData(label); getAntelope().events.onNetworkChanged.next( diff --git a/src/antelope/stores/rex.ts b/src/antelope/stores/rex.ts index ef4b9f8fd..757e4dcb4 100644 --- a/src/antelope/stores/rex.ts +++ b/src/antelope/stores/rex.ts @@ -108,6 +108,7 @@ export const useRexStore = defineStore(store_name, { async getStakedSystemContractInstance(label: string) { this.trace('getStakedSystemContractInstance', label); const address = (useChainStore().getChain(label).settings as EVMChainSettings).getStakedSystemToken().address; + this.trace('getStakedSystemContractInstance', label, address); return this.getContractInstance(label, address); }, /** @@ -118,6 +119,7 @@ export const useRexStore = defineStore(store_name, { async getEscrowContractInstance(label: string) { this.trace('getEscrowContractInstance', label); const address = (useChainStore().getChain(label).settings as EVMChainSettings).getEscrowContractAddress(); + this.trace('getEscrowContractInstance', label, address); return this.getContractInstance(label, address); }, /** diff --git a/src/antelope/wallets/AntelopeWallets.ts b/src/antelope/wallets/AntelopeWallets.ts index 83b4c8a7b..1fd38b6c0 100644 --- a/src/antelope/wallets/AntelopeWallets.ts +++ b/src/antelope/wallets/AntelopeWallets.ts @@ -21,6 +21,8 @@ export class AntelopeWallets { init() { this.trace('init'); + + } addEVMAuthenticator(authenticator: EVMAuthenticator) { @@ -42,11 +44,13 @@ export class AntelopeWallets { // If a provider instance already exists, return it immediately. if (this.web3Provider) { + this.trace('getWeb3Provider', 'Returning existing provider instance'); return this.web3Provider; } // If an initialization is already underway, wait for it to complete. if (this.web3ProviderInitializationPromise) { + this.trace('getWeb3Provider', 'Waiting for existing initialization to complete'); return this.web3ProviderInitializationPromise; } @@ -58,6 +62,7 @@ export class AntelopeWallets { const jsonRpcProvider = new ethers.providers.JsonRpcProvider(url); await jsonRpcProvider.ready; this.web3Provider = jsonRpcProvider as ethers.providers.Web3Provider; + this.trace('getWeb3Provider', 'Initialized provider instance', url, this.web3Provider); return this.web3Provider; } catch (e) { this.trace('getWeb3Provider authenticator.web3Provider() Failed!', e); @@ -69,4 +74,10 @@ export class AntelopeWallets { return this.web3ProviderInitializationPromise; } + resetWeb3Provider() { + this.trace('resetWeb3Provider'); + this.web3Provider = null; + this.web3ProviderInitializationPromise = null; + } + } diff --git a/src/boot/antelope.ts b/src/boot/antelope.ts index 69cb8fbdc..ac7a420f6 100644 --- a/src/boot/antelope.ts +++ b/src/boot/antelope.ts @@ -2,7 +2,8 @@ import { EthereumClient } from '@web3modal/ethereum'; import { Web3ModalConfig } from '@web3modal/html'; import { OreIdOptions } from 'oreid-js'; import { boot } from 'quasar/wrappers'; -import { CURRENT_CONTEXT, installAntelope } from 'src/antelope'; +import { installAntelope } from 'src/antelope'; +import { AccountModel } from 'src/antelope/stores/account'; import { AntelopeError } from 'src/antelope/types'; import { MetamaskAuth, @@ -13,7 +14,7 @@ import { import { BraveAuth } from 'src/antelope/wallets/authenticators/BraveAuth'; import { App } from 'vue'; import { Router } from 'vue-router'; - +import { resetNativeApi } from 'src/boot/api'; const getRouter = async (app: App) => new Promise((resolve) => { const intervalId = setInterval(() => { @@ -28,6 +29,15 @@ const getRouter = async (app: App) => new Promise((resolve) => { export default boot(({ app }) => { const ant = installAntelope(app); + // if the user changes the network, we need to reset the native api + ant.events.onNetworkChanged.subscribe({ + next: async ({ chain }) => { + + resetNativeApi(chain); + chain.settings.getRPCEndpoint(); + }, + }); + // settting notification handlers -- ant.config.setNotifySuccessfulTrxHandler(app.config.globalProperties.$notifySuccessTransaction); ant.config.setNotifySuccessMessageHandler(app.config.globalProperties.$notifySuccessMessage); @@ -43,10 +53,19 @@ export default boot(({ app }) => { // we need to wait 1000 milisec to ensure app.config.globalProperties?.$router is not null ant.events.onLoggedIn.subscribe({ - next: async () => { - if (window.location.pathname === '/') { - (await getRouter(app)).push({ path: '/evm/wallet?tab=balance' }); + next: async (account: AccountModel) => { + if (account.isNative) { + if (!window.location.pathname.startsWith('/zero')) { + const router = await getRouter(app); + router.push({ path: '/zero/balance' }); + } + } else { + if (!window.location.pathname.startsWith('/evm')) { + const router = await getRouter(app); + router.push({ path: '/evm/wallet?tab=balance' }); + } } + }, }); ant.events.onLoggedOut.subscribe({ @@ -103,13 +122,6 @@ export default boot(({ app }) => { const weAreInNetlify = document.location.hostname.includes('netlify'); ant.config.debug.allowDebugMode(weAreNotInProduction || weAreInLocalhost || weAreInNetlify); - // Finally, we check if the url has the network parameter and if so, we connect to that network - // Otherwise we just let the store decide which network to connect to - const network = new URLSearchParams(window.location.search).get('network'); - if (network) { - ant.stores.chain.setChain(CURRENT_CONTEXT, network); - } - // We can simulate the indexer being down for testing purposes by uncommenting the following line // (ant.stores.chain.currentChain.settings as EVMChainSettings).simulateIndexerDown(true); diff --git a/src/boot/api.js b/src/boot/api.js index 044f1bc41..c447ce811 100644 --- a/src/boot/api.js +++ b/src/boot/api.js @@ -1,4 +1,5 @@ import { boot } from 'quasar/wrappers'; +import axios from 'axios'; import { Api, JsonRpc } from 'eosjs'; import { TelosEvmApi } from '@telosnetwork/telosevm-js'; @@ -61,35 +62,54 @@ const getAccount = async function (accountName) { return await rpc.get_account(accountName); }; -export default boot(async ({ store }) => { - const rpc = new JsonRpc( - `${process.env.NETWORK_PROTOCOL}://${process.env.NETWORK_HOST}:${process.env.NETWORK_PORT}`, - ); +const holder = {}; +export default boot(async ({ store, app }) => { + holder.store = store; + holder.app = app; +}); + +export const resetNativeApi = async function (chain) { + if (!chain.settings.isNative()) { + return; + } + const p = chain.settings.getRPCEndpoint(); + const url = `${p.protocol}://${p.host}:${p.port}${p.path ?? ''}`; + const rpc = new JsonRpc(url); - store['$account'] = {}; + holder.store['$account'] = {}; - store['$defaultApi'] = new Api({ + holder.store['$defaultApi'] = new Api({ rpc, textDecoder: new TextDecoder(), textEncoder: new TextEncoder(), }); - store['$evmApi'] = new TelosEvmApi({ - endpoint: process.env.HYPERION_ENDPOINT, - chainId: process.env.CHAIN_NAME === 'telos' ? 40 : 41, + holder.store['$evmApi'] = new TelosEvmApi({ + endpoint: chain.settings.getHyperionEndpoint(), + chainId: chain.settings.getNetwork() === 'telos' ? 40 : 41, ethPrivateKeys: [], telosContract: process.env.EVM_CONTRACT, telosPrivateKeys: [], }); - store['$api'] = { - getInfo: getInfo.bind(store), - getAbi: getAbi.bind(store), - signTransaction: signTransaction.bind(store), - getTableRows: getTableRows.bind(store), - getAccount: getAccount.bind(store), - getRpc: getRpc.bind(store), + holder.store['$api'] = { + getInfo: getInfo.bind(holder.store), + getAbi: getAbi.bind(holder.store), + signTransaction: signTransaction.bind(holder.store), + getTableRows: getTableRows.bind(holder.store), + getAccount: getAccount.bind(holder.store), + getRpc: getRpc.bind(holder.store), }; - window.$api = store['$api']; -}); + window.$api = holder.store['$api']; + + holder.hyperion = axios.create({ + baseURL: chain.settings.getHyperionEndpoint(), + }); +}; + +export const getHyperion = function () { + return holder.hyperion; +}; + + diff --git a/src/boot/hyperion.js b/src/boot/hyperion.js deleted file mode 100644 index 1f97914f6..000000000 --- a/src/boot/hyperion.js +++ /dev/null @@ -1,12 +0,0 @@ -import { boot } from 'quasar/wrappers'; -import axios from 'axios'; - -const hyperion = axios.create({ - baseURL: process.env.HYPERION_ENDPOINT, -}); - -export default boot(({ app }) => { - app.config.globalProperties.$hyperion = hyperion; -}); - -export { hyperion }; diff --git a/src/boot/ual.js b/src/boot/ual.js index 3f988b301..de961b694 100644 --- a/src/boot/ual.js +++ b/src/boot/ual.js @@ -51,7 +51,7 @@ export default boot(async ({ app, store }) => { }).catch((e) => { throw e; }); - if (store.state.account.justViewer) { + if (store.state.account.justViewer || localStorage.getItem('justViewer')) { permission = 'active'; } else { await new Promise((resolve) => { diff --git a/src/components/evm/AppNav.vue b/src/components/evm/AppNav.vue index 0a0ef5199..87d01846b 100644 --- a/src/components/evm/AppNav.vue +++ b/src/components/evm/AppNav.vue @@ -4,7 +4,7 @@ import InlineSvg from 'vue-inline-svg'; import UserInfo from 'components/evm/UserInfo.vue'; import { getAntelope, useChainStore } from 'src/antelope'; -import EVMLoginButtons from 'pages/home/EVMLoginButtons.vue'; +import LoginButtons from 'pages/home/LoginButtons.vue'; import { getShortenedHash } from 'src/antelope/stores/utils'; const ant = getAntelope(); @@ -14,7 +14,7 @@ const chainStore = useChainStore(); export default defineComponent({ name: 'AppNav', components: { - EVMLoginButtons, + LoginButtons, UserInfo, InlineSvg, }, @@ -451,7 +451,7 @@ export default defineComponent({ @click="closeLoginMenu()" /> - + diff --git a/src/css/components/_notification.scss b/src/css/components/_notification.scss index 709705f90..51d523a17 100644 --- a/src/css/components/_notification.scss +++ b/src/css/components/_notification.scss @@ -107,6 +107,15 @@ font-weight: bold; margin-bottom: 1rem; } + &--bold { + font-weight: bold; + } + &--center { + text-align: center; + } + &--paragraph { + margin-bottom: 1rem; + } } &__action-btn { color: var(--text-color, #000); diff --git a/src/i18n/en-us/index.js b/src/i18n/en-us/index.js index bb090d901..ffdfcb2e6 100644 --- a/src/i18n/en-us/index.js +++ b/src/i18n/en-us/index.js @@ -128,6 +128,7 @@ export default { table_controls_change_rows_per_page_label: 'Change rows per page to {num}', }, global: { + network: 'Network', address: 'Address', allowance: 'Allowance', allowed: 'Allowed', diff --git a/src/layouts/NativeLayout.vue b/src/layouts/NativeLayout.vue index 1324074d4..586444596 100644 --- a/src/layouts/NativeLayout.vue +++ b/src/layouts/NativeLayout.vue @@ -2,8 +2,9 @@ import { mapGetters, mapActions } from 'vuex'; import navBar from 'components/native/NavBar.vue'; -import NativeLoginButton from 'pages/home/NativeLoginButton.vue'; +import LoginButtons from 'pages/home/LoginButtons.vue'; import { getAntelope } from 'src/antelope'; +import { getHyperion } from 'src/boot/api'; const pagesData = [ { @@ -31,7 +32,7 @@ const pagesData = [ export default { name: 'NativeLayout', - components: { NavBar: navBar, NativeLoginButton }, + components: { NavBar: navBar, LoginButtons }, data() { return { avatar: null, @@ -106,12 +107,12 @@ export default { this.loadUserProfile(); }, async loadAccountHistory() { - const actionHistory = await this.$hyperion.get( + const actionHistory = await getHyperion().get( `/v2/history/get_actions?limit=20&account=${this.accountName}`, ); this.accountHistory = actionHistory.data.actions || []; }, - logOut() { + performLogOut() { this.resetTokens(); this.logout(true); }, @@ -121,16 +122,17 @@ export default { }, }, async mounted() { - await this.memoryAutoLogin(); + if (!this.isUserAuthenticated) { + await this.memoryAutoLogin(); + } this.loadUserProfile(); - this.checkPath(); }, };