Merge pull request #317 from telosnetwork/127-linting

#127 | Update linting rules

.eslintrc.js

@@ -31,6 +31,28 @@ module.exports = {
  'comma-dangle': ['error', 'always-multiline'],
  'indent': ['error', 4],
  'quotes': ['error', 'single'],
+ 'max-len': ['error', { 'code': 120 }],
+ 'eol-last': ['error', 'always'],
+ 'object-curly-spacing': ['error', 'always'],
+ 'array-bracket-spacing': ['error', 'never'],
+ 'space-in-parens': ['error', 'never'],
+ 'computed-property-spacing': ['error', 'never'],
+ 'comma-spacing': ['error', { 'before': false, 'after': true }],
+ 'no-trailing-spaces': 'error',
+ 'eqeqeq': 'error',
+ 'semi': ['error', 'always'],
+ 'arrow-parens': [2, 'as-needed', { 'requireForBlockBody': true }],
+ 'arrow-body-style': ['error', 'as-needed'],
+ 'object-property-newline': ['error', { 'allowAllPropertiesOnSameLine': true }],
+ 'curly': 'error',
+ 'brace-style': ['error', '1tbs', { 'allowSingleLine': false }],
+ 'no-restricted-imports': ['error', {
+ 'patterns': ['.*'], // disallow relative imports
+ }],
+ 'no-return-assign': ['error', 'always'],
+ 'no-param-reassign': 'error',
+
+
  'vue/html-indent': ['warn', 4, { 'baseIndent': 0 }],
  'vue/max-attributes-per-line': ['warn', {
  'singleline': {
@@ -40,5 +62,47 @@ module.exports = {
  'max': 1,
  },
  }],
+ 'vue/first-attribute-linebreak': ['error', {
+ 'singleline': 'ignore',
+ 'multiline': 'below',
+ }],
+ 'vue/component-tags-order': ['error', {
+ 'order': ['script', 'template', 'style'],
+ }],
+ 'vue/html-self-closing': ['error', {
+ 'html': {
+ 'void': 'never',
+ 'normal': 'never',
+ 'component': 'always',
+ },
+ 'svg': 'always',
+ }],
+ 'vue/multi-word-component-names': 'error',
+ 'vue/no-static-inline-styles': ['error', {
+ 'allowBinding': false,
+ }],
+ 'vue/attributes-order': ['error', {
+ 'order': [
+ 'DEFINITION',
+ 'LIST_RENDERING',
+ 'CONDITIONALS',
+ 'RENDER_MODIFIERS',
+ 'GLOBAL',
+ ['UNIQUE', 'SLOT'],
+ 'TWO_WAY_BINDING',
+ 'OTHER_DIRECTIVES',
+ 'OTHER_ATTR',
+ 'EVENTS',
+ 'CONTENT',
+ ],
+ 'alphabetical': false,
+ }],
+ 'vue/html-closing-bracket-newline': ['error', {
+ 'singleline': 'never',
+ 'multiline': 'always',
+ }],
+ 'vue/component-options-name-casing': ['error', 'PascalCase'],
+ 'vue/component-definition-name-casing': ['error', 'PascalCase'],
+ 'vue/component-name-in-template-casing': ['error', 'PascalCase'],
  },
-}
+};

babel.config.js

@@ -2,6 +2,6 @@
 module.exports = {
  presets: [
  '@quasar/babel-preset-app',
- ['@babel/preset-env', { targets: { node: 'current' }}],
+ ['@babel/preset-env', { targets: { node: 'current' } }],
  ],
-}
+};

env.js

@@ -38,7 +38,7 @@ const MAINNET = {
  NETWORK_EVM_CHAIN_ID: 40,
  HYPERION_ENDPOINT: 'https://mainnet.telos.net',
  NETWORK_EXPLORER: 'https://explorer.telos.net',
- TELOS_API_ENDPOINT: 'https://api.telos.net/v1',//'http://localhost:9999/v1', //for local instance of api
+ TELOS_API_ENDPOINT: 'https://api.telos.net/v1', //'http://localhost:9999/v1', //for local instance of api
  VERIFIED_CONTRACTS_BUCKET: 'verified-evm-contracts',
  STAKED_TLOS_CONTRACT_ADDRESS: '0xB4B01216a5Bc8F1C8A33CD990A1239030E60C905',
  TELOS_ESCROW_CONTRACT_ADDRESS: '0x95F5713A1422Aa3FBD3DCB8D553945C128ee3855',

quasar.conf.js

@@ -48,8 +48,8 @@ module.exports = function(/* ctx */) {
  env,
  chainWebpack (chain) {
  chain.plugin('eslint-webpack-plugin')
- .use(ESLintPlugin, [{ extensions: [ 'js', 'vue' ] }]);
- chain.plugin('node-polyfill').use(nodePolyfillWebpackPlugin)
+ .use(ESLintPlugin, [{ extensions: ['js', 'vue'] }]);
+ chain.plugin('node-polyfill').use(nodePolyfillWebpackPlugin);
  },
 
  // transpile: false,

src/App.vue

@@ -1,7 +1,7 @@
 <script>
 export default {
  name: 'App',
-}
+};
 </script>
 <template>
 <div id="q-app">

src/boot/api.js

@@ -2,7 +2,7 @@ import { boot } from 'quasar/wrappers';
 import { Api, JsonRpc } from 'eosjs';
 
 const signTransaction = async function(actions) {
- actions.forEach(action => {
+ actions.forEach((action) => {
  if (!action.authorization || !action.authorization.length) {
  action.authorization = [
  {
@@ -34,7 +34,7 @@ const signTransaction = async function(actions) {
 
 const getRpc = function () {
  return this.$type === 'ual' ? this.$ualUser.rpc : this.$defaultApi.rpc;
-}
+};
 
 const getTableRows = async function(options) {
  const rpc = this.$api.getRpc();
@@ -47,7 +47,7 @@ const getTableRows = async function(options) {
 const getAccount = async function (accountName) {
  const rpc = this.$api.getRpc();
  return await rpc.get_account(accountName);
-}
+};
 
 export default boot(async ({ store }) => {
  const rpc = new JsonRpc(

src/boot/evm.js

@@ -16,19 +16,21 @@ const evm = new TelosEvmApi({
 });
 
 // This is kinda bad, but if you try to store a web3 provider in the store, it has a call stack size exception,
-// and if you freeze the provider before putting in the store so the call stack error goes away, you break the provider
-// so, this is a workaround until some better solution is needed and/or available
+// and if you freeze the provider before putting in the store so the call stack error goes away, you break
+// the provider. so, this is a workaround until some better solution is needed and/or available
 const providerContainer = {
  provider: null,
-}
+};
 
 class ProviderManager {
  setProvider(provider) {
  providerContainer.provider = provider;
  }
 
  getEthersProvider() {
- return new ethers.providers.Web3Provider(providerContainer.provider, parseInt(process.env.NETWORK_EVM_CHAIN_ID, 10));
+ return new ethers.providers.Web3Provider(
+ providerContainer.provider, parseInt(process.env.NETWORK_EVM_CHAIN_ID, 10),
+ );
  }
 
  getProvider() {

src/boot/i18n.js

@@ -4,11 +4,11 @@ import messages from 'src/i18n';
 
 export default boot(({ app }) => {
  // Get user's last chosen language from local storage
- let lastChosenLanguage = localStorage.getItem('language')
+ let lastChosenLanguage = localStorage.getItem('language');
 
  //if not present in local storage then check user browser language
  if(!lastChosenLanguage) {
- lastChosenLanguage = navigator.language.toLowerCase().split(/[_-]+/)[0]
+ 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)) {
@@ -38,7 +38,7 @@ export default boot(({ app }) => {
  // i18n.locale = newLanguage;
  // i18n.global.setLocaleMessage(newLanguage, messages[newLanguage]);
  // app.use(i18n);
- }
+ };
 
  // Set setLocale and i18n reference available for global access
  app.config.globalProperties.$setLocale = setLocale;

src/boot/q-component-defaults.js

@@ -1,4 +1,4 @@
-import { boot } from 'quasar/wrappers'
+import { boot } from 'quasar/wrappers';
 import { QTooltip } from 'quasar';
 
 const setDefault = (component, key, value) => {
@@ -24,7 +24,7 @@ function isTouchDevice() {
  var prefixes = ' -webkit- -moz- -o- -ms- '.split(' ');
  var mq = function(query) {
  return window.matchMedia(query).matches;
- }
+ };
 
  if (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch) {
  return true;
@@ -45,4 +45,4 @@ export default boot((/* { app, router, ... } */) => {
  // required, as this only changes the default prop value
  const tooltipHideDelay = isTouchDevice() ? 9999999 : undefined;
  setDefault(QTooltip, 'hideDelay', tooltipHideDelay);
-})
+});

src/boot/ual.js

@@ -3,7 +3,7 @@ import { UAL } from 'universal-authenticator-library';
 import { Wombat } from 'ual-wombat';
 import { Anchor } from 'ual-anchor';
 
-export default boot( async({ app, store }) => {
+export default boot(async({ app, store }) => {
  const chain = {
  chainId: process.env.NETWORK_CHAIN_ID,
  rpcEndpoints: [

src/components/AddressField.vue

@@ -53,15 +53,19 @@ export default {
  return;
  }
  if (this.name) {
- return this.truncate > 0 && this.name.length > this.truncate ? `${this.name.slice(0, this.truncate)}...` : `${this.name}`;
+ return this.truncate > 0 && this.name.length > this.truncate ?
+ `${this.name.slice(0, this.truncate)}...` :
+ `${this.name}`;
  }
 
  if (this.contract && this.contract.getName()) {
  const name = this.contract.getName();
  if(name[0] === '0' && name[1] === 'x'){
  return this.truncate > 0 ? `${this.address.slice(0, this.truncate)}...` : this.address;
  }
- return this.truncate > 0 && name.length > this.truncate ? `${name.slice(0, this.truncate)}...` : `${name}`;
+ return this.truncate > 0 && name.length > this.truncate ?
+ `${name.slice(0, this.truncate)}...` :
+ `${name}`;
  }
  if (!this.address) {
  return '';
@@ -79,14 +83,14 @@ export default {
  // TODO: check if this is a contract, account lookup via telosevm-js?
  // TODO: if this is linked to a Telos account, display the Telos account name and link it to bloks
  // for now if we ask for a contract, we'll get one back and it'll be labeled as undefined
- let contract = await this.getContract({address: this.address});
+ let contract = await this.getContract({ address: this.address });
  if (contract) {
  this.contract = contract;
  }
  },
 
  },
-}
+};
 </script>
 
 <template lang="pug">

src/components/BlockField.vue

@@ -7,7 +7,7 @@ export default {
  required: true,
  },
  },
-}
+};
 </script>
 
 <template lang="pug">

src/components/ConfirmationDialog.vue

@@ -23,7 +23,7 @@ export default {
  icon: 'warning',
  color: 'text-negative',
  dialogMessage: '',
- }
+ };
  },
  async created() {
  // initialization of the translated texts
@@ -45,15 +45,17 @@ export default {
  }
  },
  showDialog(val){
- if (!val) this.$emit('dialog', val);
+ if (!val) {
+ this.$emit('dialog', val);
+ }
  },
  },
  methods: {
  async navigate(){
- await this.$router.push({name:'sourcify'});
+ await this.$router.push({ name:'sourcify' });
  },
  },
-}
+};
 </script>
 
 <template lang="pug">
@@ -64,5 +66,12 @@ q-dialog( v-model="showDialog" persistent)
  span.q-ml-sm {{ dialogMessage }}
  q-card-actions(align="right")
  q-btn(flat :label="$t('components.dismiss')" color="primary" v-close-popup)
- q-btn(v-if="!status" flat :label="$t('components.verify_contract')" color="primary" v-close-popup @click="navigate")
+ q-btn(
+ v-if="!status"
+ flat
+ :label="$t('components.verify_contract')"
+ color="primary"
+ v-close-popup
+ @click="navigate"
+ )
 </template>

src/components/ContractTab/ContractInterface.vue

@@ -20,23 +20,24 @@ export default {
  this.contract = await this.$contractManager.getContract(this.$route.params.address);
  let read = [];
  let write = [];
- this.contract.abi.forEach(a => {
- if (a.type !== 'function')
+ this.contract.abi.forEach((a) => {
+ if (a.type !== 'function') {
  return;
+ }
 
  if (a.stateMutability === 'view') {
  read.push(a);
  } else {
  write.push(a);
  }
- })
+ });
 
  this.functions = {
  read: sortAbiFunctionsByName(read),
  write: sortAbiFunctionsByName(write),
- }
+ };
  },
-}
+};
 </script>
 
 <template>
@@ -50,7 +51,7 @@ export default {
  >
  <q-card>
  <div class="q-pa-md">
- <function-interface
+ <FunctionInterface
  :abi="func"
  :contract="contract"
  :group="write ? 'write' : 'read'"