[WIP] Add jsdoc to project

.eslintignore

@@ -6,3 +6,4 @@
 /testArtifacts
 /test/unit/coverage/
 /.vscode/settings.json
+/docs/cosmos-voyager/

.gitignore

@@ -13,4 +13,6 @@ thumbs.db
 yarn-error.log
 testArtifacts/*
 app/networks/local-testnet/*
+builds/testnets/local-testnet
+docs/cosmos-voyager
 .idea/*

.prettierignore

@@ -3,3 +3,4 @@
 /package.json
 /test/unit/coverage/
 /test/unit/tmp/
+/docs/cosmos-voyager/

CHANGELOG.md

@@ -53,6 +53,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - [\#1661](https://github.com/cosmos/voyager/issues/1661) Boot: multinode available for local-testnet @sabau
 - [\#1748](https://github.com/cosmos/voyager/issues/1748) display governance parameters on tab @fedekunze
 - [\#1660](https://github.com/cosmos/voyager/issues/1660) Add parameters and pool to store @fedekunze
+- [\#1739](https://github.com/cosmos/voyager/issues/1739) Init jsDoc into project @sabau
 - [\#1674](https://github.com/cosmos/voyager/issues/1674) Add PageProfile component with shared styles for validator and proposal profiles @jbibla
 
 ### Changed

README.md

@@ -201,6 +201,18 @@ yarn pack
 node_modules/.bin/tape test/e2e/init.js
 ```
 
+### Documentation
+
+To produce an up-to date documentation you can run:
+
+```bash
+$ yarn doc
+```
+
+This will store an HTML static website containing all the documented modules and components that you can consult.
+
+The output folder is: `docs/cosmos-voyager/[#version]`
+
 ### Code coverage
 
 To check test coverage locally run following. It will spin up a webserver and provide you with a link to the coverage report web page.

app/src/renderer/App.vue

@@ -30,6 +30,18 @@ import ModalReceive from "common/TmModalReceive"
 import Onboarding from "common/TmOnboarding"
 import Session from "common/TmSession"
 import store from "./vuex/store"
+/**
+ * Main App component
+ * @vue-prop {String} propname Just an example
+ * @vue-prop {Number} [niceProp=1] - A very cool incoerent prop not required but with 1 as default
+ * @vue-data {Object} nothing
+ * @vue-computed {function} notifications mapGetter
+ * @vue-computed {function} config mapGetter
+ * @vue-computed {function} themes mapGetter
+ * @vue-computed {function} approval mapGetter
+ * @vue-computed {function} required mapGetter
+ * @vue-computed {function} onboarding mapGetter
+ */
 export default {
   name: `app`,
   components: {

app/src/renderer/components/wallet/PageWallet.vue

@@ -64,6 +64,25 @@ import TmDataMsg from "common/TmDataMsg"
 import TmBalance from "common/TmBalance"
 import ModalSearch from "common/TmModalSearch"
 import ToolBar from "common/ToolBar"
+/**
+ * Page Wallet
+ * @vue-prop {Number} num Module that implements all the numerical methods
+ * @vue-computed {function} filters mapGetter
+ * @vue-computed {function} wallet mapGetter
+ * @vue-computed {function} committedDelegations mapGetter
+ * @vue-computed {function} oldBondedAtoms mapGetter
+ * @vue-computed {function} config mapGetter
+ * @vue-computed {function} connected mapGetter
+ *
+ * @vue-computed {function} somethingToSearch returns a boolean stating true if we have data and we are not in loading phase
+ * @vue-computed {function} allDenomBalances for denoms not in balances, add empty balance
+ * @vue-computed {function} filteredBalances filter the balance per coin name, returns an ordered list
+ *
+ * @vue-methods {function} updateDelegates mapAction
+ * @vue-methods {function} updateDelegates mapAction
+ * @vue-methods {function} setSearch launches the setSearchVisible action if somethingToSearch returns true
+ * @vue-methods {function} updateBalances dispatch a queryWalletBalances action to update the informations
+ */
 export default {
   name: `page-wallet`,
   components: {
@@ -94,7 +113,6 @@ export default {
       return !this.wallet.loading && !!this.wallet.balances.length
     },
     allDenomBalances() {
-      // for denoms not in balances, add empty balance
       let balances = this.wallet.balances.slice(0)
       let hasDenom = denom => {
         return !!balances.filter(balance => balance.denom === denom)[0]

app/src/renderer/google-analytics.js

@@ -1,4 +1,8 @@
 "use strict"
+/**
+ * Google analytics gets injected here
+ * @module google-analytics
+ */
 
 import Analytics from "electron-ga"
 

app/src/renderer/main.js

@@ -1,4 +1,8 @@
 "use strict"
+/**
+ * Main module
+ * @module main
+ */
 
 import Vue from "vue"
 import Electron from "vue-electron"
@@ -71,6 +75,9 @@ Vue.directive(`focus`, {
   }
 })
 
+/**
+ * Main method to boot the renderer. It act as Entrypoint
+ */
 async function main() {
   let lcdPort = config.development ? config.lcd_port : config.lcd_port_prod
   let localLcdURL = `https://localhost:${lcdPort}`

app/src/renderer/routes.js

@@ -1,17 +1,16 @@
-function r(type, pageName) {
-  return require(`./components/${type}/Page${pageName}`).default
-}
-
-let common = r.bind(null, `common`)
-let governance = r.bind(null, `governance`)
-let staking = r.bind(null, `staking`)
-let wallet = r.bind(null, `wallet`)
+/**
+ * In this module we took care of the definition of our routes, with parameters, children and component related to them
+ * @module routes
+ */
 
+/**
+ * Routes are all defined here
+ */
 export default [
   {
     path: `/governance`,
     name: `Governance`,
-    component: governance(`Governance`),
+    component: require(`./components/governance/PageGovernance`).default,
     redirect: `/governance/proposals`,
     children: [
       {
@@ -36,7 +35,7 @@ export default [
   {
     path: `/staking`,
     name: `Staking`,
-    component: staking(`Staking`),
+    component: require(`./components/staking/PageStaking`).default,
     redirect: `/staking/my-delegations/`,
     children: [
       {
@@ -59,32 +58,32 @@ export default [
   {
     path: `/staking/validators/:validator`,
     name: `validator`,
-    component: staking(`Validator`)
+    component: require(`./components/staking/PageValidator`).default
   },
 
   {
     path: `/preferences`,
     name: `preferences`,
-    component: common(`Preferences`)
+    component: require(`./components/common/PagePreferences`).default
   },
 
   {
     path: `/`,
     name: `wallet`,
-    component: wallet(`Wallet`)
+    component: require(`./components/wallet/PageWallet`).default
   },
   {
     path: `/wallet/send/:denom?`,
     name: `send`,
     props: true,
-    component: wallet(`Send`)
+    component: require(`./components/wallet/PageSend`).default
   },
   {
     path: `/transactions`,
     name: `transactions`,
-    component: wallet(`Transactions`)
+    component: require(`./components/wallet/PageTransactions`).default
   },
 
-  { path: `/404`, component: common(`404`) },
-  { path: `*`, component: common(`404`) }
+  { path: `/404`, component: require(`./components/common/Page404`).default },
+  { path: `*`, component: require(`./components/common/Page404`).default }
 ]

app/src/renderer/scripts/num.js

@@ -1,4 +1,8 @@
 "use strict"
+/**
+ * Defines all numerical methods
+ * @module num
+ */
 
 const numeral = require(`numeral`)
 function usd(num) {

app/src/renderer/vuex/store.js

@@ -1,5 +1,9 @@
 "use strict"
 
+/**
+ * Main store module
+ * @module store
+ */
 import Vue from "vue"
 import Vuex from "vuex"
 import _ from "lodash"
@@ -8,6 +12,11 @@ import modules from "./modules"
 
 Vue.use(Vuex)
 
+/**
+ * Module Store
+ * @param opts
+ * @returns {Vuex.Store}
+ */
 export default (opts = {}) => {
   // provide commit and dispatch to tests
   opts.commit = (...args) => store.commit(...args)
@@ -57,6 +66,10 @@ export default (opts = {}) => {
   return store
 }
 
+/**
+ * Persist the state passed as parameter
+ * @param state
+ */
 function persistState(state) {
   const cachedState = JSON.stringify({
     transactions: {
@@ -88,12 +101,22 @@ function persistState(state) {
   localStorage.setItem(getStorageKey(state), cachedState)
 }
 
+/**
+ * Get a storage key
+ * @param state
+ * @returns {string}
+ */
 function getStorageKey(state) {
   const chainId = state.connection.lastHeader.chain_id
   const address = state.user.address
   return `store_${chainId}_${address}`
 }
 
+/**
+ * load persisted state
+ * @param state
+ * @param commit
+ */
 function loadPersistedState({ state, commit }) {
   const storageKey = getStorageKey(state)
   let cachedState