Merge pull request #517 from telosnetwork/380-csv-export

#380 | CSV Export

env.js

@@ -26,6 +26,7 @@ const TESTNET = {
  NETWORK_EXPLORER: 'https://explorer-test.telos.net',
  TELOS_API_ENDPOINT: 'https://api-dev.telos.net/v1', //'http://localhost:9999/v1', //for local instance of api
  INDEXER_API_ENDPOINT: 'https://api.testnet.teloscan.io/v1',
+ EXPORT_API_ENDPOINT: 'https://api.testnet.teloscan.io',
  VERIFIED_CONTRACTS_BUCKET: 'verified-evm-contracts-testnet',
  STAKED_TLOS_CONTRACT_ADDRESS: '0xa9991E4daA44922D00a78B6D986cDf628d46C4DD',
  TELOS_ESCROW_CONTRACT_ADDRESS: '0x7E9cF9fBc881652B05BB8F26298fFAB538163b6f',
@@ -49,6 +50,7 @@ const MAINNET = {
  NETWORK_EXPLORER: 'https://explorer.telos.net',
  TELOS_API_ENDPOINT: 'https://api.telos.net/v1', //'http://localhost:9999/v1', //for local instance of api
  INDEXER_API_ENDPOINT: 'https://api.teloscan.io/v1',
+ EXPORT_API_ENDPOINT: 'https://api.teloscan.io',
  VERIFIED_CONTRACTS_BUCKET: 'verified-evm-contracts',
  STAKED_TLOS_CONTRACT_ADDRESS: '0xB4B01216a5Bc8F1C8A33CD990A1239030E60C905',
  TELOS_ESCROW_CONTRACT_ADDRESS: '0x95F5713A1422Aa3FBD3DCB8D553945C128ee3855',

package.json

@@ -48,7 +48,7 @@
  "ual-wombat": "^0.3.3",
  "universal-authenticator-library": "^0.3.0",
  "vue": "3",
- "vue-i18n": "^9.0.0",
+ "vue-i18n": "^9.9.0",
  "vue-inline-svg": "^3.1.2",
  "vue-json-pretty": "^2.2.4",
  "vue-json-viewer": "3",

src/boot/errorHandling.js

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import { boot } from 'quasar/wrappers';
 import { Dialog, Notify } from 'quasar';
+import { getCurrentInstance } from 'vue';
 
 // to persist the notification and require user to dismiss pass `true` as second param
 const errorNotification = function(error, dismiss = false) {
@@ -405,3 +406,32 @@ export {
  icons,
  NotificationAction,
 };
+
+export function useNotifications() {
+ const instance = getCurrentInstance();
+ if (!instance) {
+ throw new Error('useNotifications must be used within a setup function.');
+ }
+
+ const { proxy } = instance;
+
+ const notifySuccessTransaction = proxy.$notifySuccessTransaction;
+ const notifySuccessMessage = proxy.$notifySuccessMessage;
+ const notifySuccessCopy = proxy.$notifySuccessCopy;
+ const notifyFailure = proxy.$notifyFailure;
+ const notifyFailureWithAction = proxy.$notifyFailureWithAction;
+ const notifyDisconnected = proxy.$notifyDisconnected;
+ const notifyNeutralMessage = proxy.$notifyNeutralMessage;
+ const notifyRememberInfo = proxy.$notifyRememberInfo;
+
+ return {
+ notifySuccessTransaction,
+ notifySuccessMessage,
+ notifySuccessCopy,
+ notifyFailure,
+ notifyFailureWithAction,
+ notifyDisconnected,
+ notifyNeutralMessage,
+ notifyRememberInfo,
+ };
+}

src/boot/i18n.js

@@ -6,11 +6,11 @@ import messages from 'src/i18n';
 let lastChosenLanguage = localStorage.getItem('language');
 
 //if not present in local storage then check user browser language
-if(!lastChosenLanguage) {
+if (!lastChosenLanguage) {
  lastChosenLanguage = navigator.language.toLowerCase().split(/[_-]+/)[0];
 }
 // Check if the browser language is supported, if not, fall back to 'en-us'
-if(!Object.keys(messages).includes(lastChosenLanguage)) {
+if (!Object.keys(messages).includes(lastChosenLanguage)) {
  lastChosenLanguage = 'en-us';
 }
 
@@ -38,7 +38,10 @@ export default boot(({ app }) => {
 
  if (newLanguage !== currentLanguage) {
  localStorage.setItem('language', newLanguage);
- window.location.reload();
+
+ if (currentLanguage) {
+ window.location.reload();
+ }
  }
  // TODO: investigate if there is a better way to change the language not reloading the page
  // i18n.locale = newLanguage;

src/boot/telosApi.js

@@ -10,6 +10,9 @@ const telosApi = axios.create({
 const indexerApi = axios.create({
  baseURL: process.env.INDEXER_API_ENDPOINT,
 });
+const exportApi = axios.create({
+ baseURL: process.env.EXPORT_API_ENDPOINT,
+});
 const hyperion = axios.create({
  baseURL: process.env.NETWORK_EVM_ENDPOINT,
 });
@@ -21,9 +24,11 @@ let contractManager = new ContractManager(indexerApi, fragmentParser);
 export default boot(({ app, store }) => {
  app.config.globalProperties.$telosApi = telosApi;
  app.config.globalProperties.$indexerApi = indexerApi;
+ app.config.globalProperties.$exportApi = exportApi;
  app.config.globalProperties.$fragmentParser = fragmentParser;
  store.$contractManager = app.config.globalProperties.$contractManager = markRaw(contractManager);
  store.$indexerApi = indexerApi;
+ store.$exportApi = exportApi;
  // Intercept API answer to set contracts & abi in cache directly
  indexerApi.interceptors.response.use(function (response) {
  if(response.data?.abi?.length > 0){
@@ -42,4 +47,4 @@ export default boot(({ app, store }) => {
 
 });
 
-export { telosApi, indexerApi, contractManager, fragmentParser };
+export { telosApi, indexerApi, exportApi, contractManager, fragmentParser };

src/components/header/AppHeaderLinks.vue

@@ -71,7 +71,7 @@ const telos_bridgeMenuItem = {
 
 const moreSubmenuItems = {
  internal: [
- // { name: 'export', label: $t('components.header.csv_export') },
+ { name: 'export', label: $t('components.header.csv_export') },
  { name: 'health', label: $t('components.header.health_monitor') },
  ],
  external: [

src/components/header/LanguageSwitcherModal.vue

@@ -17,7 +17,7 @@ export default {
  }),
  created() {
  this.selectedLanguage = {
- code: this.$i18n.locale,
+ code: this.$i18n.global.locale.value,
  name: this.$t('locale.current_language_name'),
  };
 

src/components/inputs/AddressInput.vue

@@ -58,12 +58,16 @@ export default {
  }
  }
  },
+ resetValidation() {
+ this.$refs.input.resetValidation();
+ },
  },
 };
 </script>
 
 <template>
 <BaseTextInput
+ ref="input"
  v-bind="$attrs"
  :model-value="modelValue"
  :label="shapedLabel"

src/components/inputs/BaseTextInput.vue

@@ -98,7 +98,7 @@ export default {
 </script>
 
 <template>
-<div class="c-base-input q-mx-sm">
+<div class="c-base-input">
  <q-input
  ref="input"
  :model-value="modelValue"

src/i18n/de-de/index.js

@@ -300,8 +300,11 @@ export default {
  native_deposit: 'Einzahlung von Native Telos',
  native_withdraw: 'Ziehen Sie sich zum einheimischen Telos zurück',
  unknown: 'Unbekannt',
- contract_deployed: 'Contract Deployed',
+ contract_deployed: 'Vertrag bereitgestellt',
  contract_deployment: 'Smart Contract Einsatz',
+ contract_interaction: 'Smart Contract Interaktion',
+ deposit: 'einzahlung',
+ withdraw: 'abziehen',
  no_internal_trxs_found: 'Keine interne Transaktion gefunden',
  human_readable: 'Für Menschen lesbar',
  no_logs_found: 'Keine Protokolle gefunden',
@@ -502,6 +505,46 @@ export default {
  brand_assets: 'Markenvermögen',
  back_to_top: 'Zurück nach oben',
  },
+ export: {
+ block_range: 'Blockbereich',
+ choose_download_option: 'Wählen Sie eine Download-Option',
+ column_header_action: 'Aktion',
+ column_header_amount: 'Betrag',
+ column_header_block_number: 'Blocknummer',
+ column_header_contract_address: 'Vertragsadresse',
+ column_header_date: 'Datum',
+ column_header_from: 'Aus',
+ column_header_nft_collection_name: 'NFT-Sammlungsname',
+ column_header_nft_id: 'NFT-ID',
+ column_header_timestamp: 'Unix-Zeitstempel (ms)',
+ column_header_to: 'Zu',
+ column_header_token_contract_address: 'Token-Vertragsadresse',
+ column_header_token_name: 'Token-Name',
+ column_header_token_symbol: 'Token-Symbol',
+ column_header_tx_hash: 'Transaktions-Hash',
+ date_range: 'Datumsbereich',
+ start_date: 'Startdatum',
+ end_date: 'Enddatum',
+ invalid_range: 'Ungültiger Bereich',
+ download_csv: 'CSV-Datei herunterladen',
+ download_transactions_csv: 'Transaktionen CSV-Datei herunterladen',
+ download_erc_20_transfers_csv: 'ERC-20-Übertragungen CSV-Datei herunterladen',
+ download_erc_721_transfers_csv: 'ERC-721-Übertragungen CSV-Datei herunterladen',
+ download_erc_1155_transfers_csv: 'ERC-1155-Übertragungen CSV-Datei herunterladen',
+ end_block: 'Endblock',
+ erc_1155_transfers: 'ERC-1155-Übertragungen',
+ erc_20_transfers: 'ERC-20-Übertragungen',
+ erc_721_transfers: 'ERC-721-Übertragungen',
+ export_data: 'Daten exportieren',
+ export_type: 'Export-Typ',
+ limit_notice: 'Es werden nur die ersten {amount} Ergebnisse exportiert',
+ notification_successful_download: 'Erfolgreicher Download',
+ notification_failed_download: 'Beim Herunterladen der Daten ist ein Fehler aufgetreten',
+ page_header: 'Daten herunterladen (CSV-Export)',
+ reset: 'Zurücksetzen',
+ start_block: 'Startblock',
+ transactions: 'Transaktionen',
+ },
  },
  global: {
  all: 'Alle',

src/i18n/en-us/index.js

@@ -308,6 +308,9 @@ export default {
  native_withdraw: 'Withdraw to Native Telos',
  unknown: 'Unknown',
  contract_deployment: 'Contract Deployment',
+ contract_interaction: 'Contract Interaction',
+ deposit: 'deposit',
+ withdraw: 'withdraw',
  no_internal_trxs_found: 'No internal transactions found',
  human_readable: 'Human Readable',
  no_logs_found: 'No logs found',
@@ -517,6 +520,95 @@ export default {
  brand_assets: 'Brand Assets',
  back_to_top: 'Back to top',
  },
+ export: {
+ block_range: 'Block Range',
+ choose_download_option: 'Choose download option',
+ column_header_action: 'Action',
+ column_header_amount: 'Amount',
+ column_header_block_number: 'Block Number',
+ column_header_contract_address: 'Contract Address',
+ column_header_date: 'Date',
+ column_header_from: 'From',
+ column_header_nft_collection_name: 'NFT Collection Name',
+ column_header_nft_id: 'NFT ID',
+ column_header_timestamp: 'Unix Timestamp (ms)',
+ column_header_to: 'To',
+ column_header_token_contract_address: 'Token Contract Address',
+ column_header_token_name: 'Token Name',
+ column_header_token_symbol: 'Token Symbol',
+ column_header_tx_hash: 'Transaction Hash',
+ date_range: 'Date Range',
+ start_date: 'Start Date',
+ end_date: 'End Date',
+ invalid_range: 'Invalid range',
+ download_csv: 'Download CSV',
+ download_transactions_csv: 'Download Transactions CSV',
+ download_erc_20_transfers_csv: 'Download ERC-20 Transfers CSV',
+ download_erc_721_transfers_csv: 'Download ERC-721 Transfers CSV',
+ download_erc_1155_transfers_csv: 'Download ERC-1155 Transfers CSV',
+ end_block: 'End Block',
+ erc_1155_transfers: 'ERC-1155 Transfers',
+ erc_20_transfers: 'ERC-20 Transfers',
+ erc_721_transfers: 'ERC-721 Transfers',
+ export_data: 'Export Data',
+ export_type: 'Export Type',
+ limit_notice: 'Only the first {amount} results will be exported',
+ notification_successful_download: 'Download successful',
+ notification_failed_download: 'An error occurred while downloading data',
+ page_header: 'Download Data (CSV Export)',
+ reset: 'Reset',
+ start_block: 'Start Block',
+ transactions: 'Transactions',
+ },
+ },
+ evm_wallet: {
+ send_icon_alt: 'Send icon',
+ receive_icon_alt: 'Receive icon',
+ buy_icon_alt: 'Buy more tokens icon',
+ token_logo_alt: 'Token logo',
+ send: 'Send',
+ receive: 'Receive',
+ scan_qr: 'Scan the QR Code to get your account',
+ buy: 'Buy',
+ unwrap: 'Unwrap',
+ wrap: 'Wrap',
+ stake: 'Stake',
+ unstake: 'Unstake',
+ copy: 'Copy',
+ link_to_send_aria: 'Link to Send page',
+ link_to_receive_aria: 'Link to Receive page',
+ link_to_buy_aria: 'External link to buy tokens',
+ balance_row_actions_aria: 'Balance row actions',
+ no_fiat_value: 'No reliable fiat value found',
+ receiving_account: 'Receiving Account',
+ account_required: 'Account is required',
+ token: 'Token',
+ cancel: 'Cancel',
+ estimated_fees: 'Estimated Fees',
+ amount_available: '{amount} Available',
+ amount_required: 'Amount is required',
+ view_contract: 'View Contract',
+ invalid_form: 'There is at least one invalid field.',
+ general_error: 'There was an error processing your request',
+ invalid_amount_precision: 'You can only enter {precision} decimal places',
+ sent: 'Sent',
+ received: 'Received',
+ swapped: 'Swapped',
+ switch: 'Switch',
+ failed_contract_interaction: 'Failed contract interaction',
+ contract_interaction: 'Contract interaction',
+ contract_creation: 'Contract creation',
+ aria_link_to_address: 'Link to block explorer address page',
+ aria_link_to_transaction: 'Link to block explorer transaction page',
+ click_to_fill_max: 'Click to fill max amount',
+ amount_exceeds_available_balance: 'Balance too low',
+ incorrect_network: 'Incorrect network detected! Switch to {networkName} to complete transaction',
+ viewing_n_transactions: 'Viewing {rowsPerPage} of {totalRows} transactions',
+ no_transactions_found: 'No transactions found',
+ add_to_metamask: 'Add to MetaMask',
+ rejected_metamask_prompt: 'The MetaMask prompt was rejected',
+ error_adding_token_to_metamask: 'Error adding token to MetaMask',
+ inventory: 'Collectibles',
  },
  global: {
  all: 'all',

src/i18n/es-es/index.js

@@ -303,6 +303,9 @@ export default {
  unknown: 'Desconocido',
  contract_deployed: 'Contrato Desplegado',
  contract_deployment: 'Despliegue de contrato',
+ contract_interaction: 'Interacción de contrato',
+ deposit: 'depositar',
+ withdraw: 'retirar',
  no_internal_trxs_found: 'No se encontraron transacciones internas',
  human_readable: 'Lectura humana',
  no_logs_found: 'No se encontraron registros',
@@ -503,6 +506,46 @@ export default {
  brand_assets: 'Activos de Marca',
  back_to_top: 'Volver arriba',
  },
+ export: {
+ block_range: 'Rango de bloques',
+ choose_download_option: 'Elija una opción de descarga',
+ column_header_action: 'Acción',
+ column_header_amount: 'Cantidad',
+ column_header_block_number: 'Número de bloque',
+ column_header_contract_address: 'Dirección del contrato',
+ column_header_date: 'Fecha',
+ column_header_from: 'De',
+ column_header_nft_collection_name: 'Nombre de la colección NFT',
+ column_header_nft_id: 'ID de NFT',
+ column_header_timestamp: 'Marca de tiempo de Unix (ms)',
+ column_header_to: 'A',
+ column_header_token_contract_address: 'Dirección del contrato del token',
+ column_header_token_name: 'Nombre del token',
+ column_header_token_symbol: 'Símbolo del token',
+ column_header_tx_hash: 'Hash de transacción',
+ date_range: 'Rango de fechas',
+ start_date: 'Fecha de inicio',
+ end_date: 'Fecha de finalización',
+ invalid_range: 'Rango de fechas no válido',
+ download_csv: 'Descargar CSV',
+ download_transactions_csv: 'Descargar transacciones CSV',
+ download_erc_20_transfers_csv: 'Descargar transferencias ERC-20 CSV',
+ download_erc_721_transfers_csv: 'Descargar transferencias ERC-721 CSV',
+ download_erc_1155_transfers_csv: 'Descargar transferencias ERC-1155 CSV',
+ end_block: 'Bloque final',
+ erc_1155_transfers: 'Transferencias ERC-1155',
+ erc_20_transfers: 'Transferencias ERC-20',
+ erc_721_transfers: 'Transferencias ERC-721',
+ export_data: 'Exportar datos',
+ export_type: 'Tipo de exportación',
+ limit_notice: 'Sólo se exportarán los primeros {amount} resultados.',
+ notification_successful_download: '¡Descarga exitosa!',
+ notification_failed_download: 'Se produjo un error al descargar datos.',
+ page_header: 'Descargar datos (exportación CSV)',
+ reset: 'Reiniciar',
+ start_block: 'Bloque de inicio',
+ transactions: 'Transacciones',
+ },
  },
  global: {
  all: 'Todo',