Refactor/mvpn 267 enable tslint

js/app/app-styles.ts

@@ -15,17 +15,17 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import {StyleSheet, ViewStyle} from 'react-native'
+import { StyleSheet, ViewStyle } from 'react-native'
 
-interface AppStyles {
-  container: ViewStyle
+type AppStyles = {
+  container: ViewStyle,
 }
 
 export default StyleSheet.create({
   container: {
-    flex: 1,
-    backgroundColor: '#fff',
     alignItems: 'center',
-    justifyContent: 'center'
-  }
+    backgroundColor: '#fff',
+    flex: 1,
+    justifyContent: 'center',
+  },
 }) as AppStyles

js/app/app-tequilapi.ts

@@ -17,36 +17,81 @@
 
 import React from 'react'
 
-import TequilapiClientFactory, {
-  IdentityDTO,
-} from 'mysterium-tequilapi'
-import {ConnectionStatusEnum} from "../libraries/tequilapi/enums";
+import TequilapiClientFactory, { IdentityDTO } from 'mysterium-tequilapi'
+import { ConnectionStatusEnum } from '../libraries/tequilapi/enums'
 
-import {CONFIG} from '../config'
-import {store} from "../store/tequilapi-store";
-import {ProposalsFetcher} from "../fetchers/proposals-fetcher";
-import {StatusFetcher} from "../fetchers/status-fetcher";
-import {IPFetcher} from "../fetchers/ip-fetcher";
-import {StatsFetcher} from "../fetchers/stats-fetcher";
+import { CONFIG } from '../config'
+import { IPFetcher } from '../fetchers/ip-fetcher'
+import { ProposalsFetcher } from '../fetchers/proposals-fetcher'
+import { StatsFetcher } from '../fetchers/stats-fetcher'
+import { StatusFetcher } from '../fetchers/status-fetcher'
+import { store } from '../store/app-store'
 
 const IP_UPDATING = CONFIG.TEXTS.IP_UPDATING
-const api = new TequilapiClientFactory(CONFIG.TEQUILAPI_ADDRESS, CONFIG.TEQUILAPI_TIMEOUT).build()
+const api = new TequilapiClientFactory(
+  CONFIG.TEQUILAPI_ADDRESS,
+  CONFIG.TEQUILAPI_TIMEOUT,
+).build()
 
 /***
  * API operations level
  */
 export default class AppTequilapi extends React.Component {
-  proposalFetcher = new ProposalsFetcher(api)
-  statusFetcher = new StatusFetcher(api)
-  ipFetcher = new IPFetcher(api)
-  statsFetcher = new StatsFetcher(api)
+  protected proposalFetcher = new ProposalsFetcher(api)
+  protected statusFetcher = new StatusFetcher(api)
+  protected ipFetcher = new IPFetcher(api)
+  protected statsFetcher = new StatsFetcher(api)
+
+  /***
+   * Tries to connect to selected VPN server
+   * @returns {Promise<void>}
+   */
+  public async connect(): Promise<void> {
+    if (!store.IdentityId || !store.SelectedProviderId) {
+      console.error('Not enough data to connect', store)
+      return
+    }
+    store.IP = IP_UPDATING
+    store.ConnectionStatus = {
+      sessionId: '',
+      status: ConnectionStatusEnum.CONNECTING,
+    }
+    try {
+      const connection = await api.connectionCreate({
+        consumerId: store.IdentityId,
+        providerCountry: '',
+        providerId: store.SelectedProviderId,
+      })
+      console.log('connected', connection)
+    } catch (e) {
+      console.warn('api.connectionCreate failed', e)
+    }
+  }
+
+  /***
+   * Tries to disconnect from VPN server
+   * @returns {Promise<void>}
+   */
+  public async disconnect(): Promise<void> {
+    store.IP = IP_UPDATING
+    store.ConnectionStatus = {
+      sessionId: '',
+      status: ConnectionStatusEnum.DISCONNECTING,
+    }
+    try {
+      await api.connectionCancel()
+      console.log('disconnected')
+    } catch (e) {
+      console.warn('api.connectionCancel failed', e)
+    }
+  }
 
   /***
    * Tries to login to API, must be completed once before connect
    * @returns {Promise<void>}
    */
-  async unlock (): Promise<void> {
-    let identities: Array<IdentityDTO>
+  protected async unlock(): Promise<void> {
+    let identities: IdentityDTO[]
     try {
       identities = await api.identitiesList()
     } catch (e) {
@@ -59,7 +104,9 @@ export default class AppTequilapi extends React.Component {
       if (identities.length) {
         identityId = identities[0].id
       } else {
-        const newIdentity: IdentityDTO = await api.identityCreate(CONFIG.PASSPHRASE)
+        const newIdentity: IdentityDTO = await api.identityCreate(
+          CONFIG.PASSPHRASE,
+        )
         identityId = newIdentity.id
       }
     } catch (e) {
@@ -74,41 +121,4 @@ export default class AppTequilapi extends React.Component {
       console.warn('api.identityUnlock failed', e)
     }
   }
-
-  /***
-   * Tries to connect to selected VPN server
-   * @returns {Promise<void>}
-   */
-  async connect (): Promise<void> {
-    if (!store.IdentityId || !store.SelectedProviderId) {
-      console.error('Not enough data to connect', store)
-      return
-    }
-    store.IP = IP_UPDATING
-    store.ConnectionStatus = { sessionId: '', status: ConnectionStatusEnum.CONNECTING }
-    try {
-      const connection = await api.connectionCreate({
-        consumerId: store.IdentityId,
-        providerId: store.SelectedProviderId
-      })
-      console.log('connect', connection)
-    } catch (e) {
-      console.warn('api.connectionCreate failed', e)
-    }
-  }
-
-  /***
-   * Tries to disconnect from VPN server
-   * @returns {Promise<void>}
-   */
-  async disconnect (): Promise<void> {
-    store.IP = IP_UPDATING
-    store.ConnectionStatus = { sessionId: '', status: ConnectionStatusEnum.DISCONNECTING }
-    try {
-      await api.connectionCancel()
-      console.log('disconnect')
-    } catch (e) {
-      console.warn('api.connectionCancel failed', e)
-    }
-  }
 }

js/app/app.tsx

@@ -15,32 +15,52 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react'
-import { Text, View, Button } from 'react-native'
+import { observer } from 'mobx-react/native'
+import React, {ReactNode} from 'react'
+import { Button, Text, View } from 'react-native'
+import { CONFIG } from '../config'
+import { logger } from '../libraries/logger'
+import MysteriumClient from '../libraries/mysterium-client'
+import { store } from '../store/app-store'
 import styles from './app-styles'
-import {CONFIG} from '../config'
-import Stats from './stats'
 import AppTequilapi from './app-tequilapi'
 import Proposals from './proposals'
-import MysteriumClient from '../libraries/mysterium-client'
-import {store} from "../store/tequilapi-store";
-import {observer} from "mobx-react/native";
+import Stats from './stats'
+
+logger.showDebugMessages()
 
 @observer
 export default class App extends AppTequilapi {
-  constructor (props: any) {
-    super(props)
-
-    // Bind local functions
-    this.connectDisconnect = this.connectDisconnect.bind(this)
+  public render(): ReactNode {
+    return (
+      // @ts-ignore TODO remove ignore or transform
+      <View style={styles.container} transform={[{ scaleX: 2 }, { scaleY: 2 }]}>
+        <Text>
+          {store.ConnectionStatus
+            ? store.ConnectionStatus.status
+            : CONFIG.TEXTS.UNKNOWN_STATUS}
+        </Text>
+        <Text>IP: {store.IP}</Text>
+        <Proposals
+          proposalsFetcher={this.proposalFetcher}
+          proposalsStore={store}
+        />
+        <Button
+          title={this.buttonText}
+          disabled={!this.buttonEnabled}
+          onPress={() => this.connectDisconnect()}
+        />
+        {store.Statistics ? <Stats {...store.Statistics} /> : null}
+      </View>
+    )
   }
 
   /***
    * Refreshes connection state, ip and unlocks identity.
    * Starts periodic state refreshing
    * Called once after first rendering.
    */
-  async componentDidMount () {
+  public async componentDidMount() {
     await this.unlock()
 
     // TODO: remove it later, serviceStatus is used only for native call test
@@ -49,12 +69,26 @@ export default class App extends AppTequilapi {
     console.log('serviceStatus', serviceStatus)
   }
 
+  private get buttonEnabled(): boolean {
+    return store.isReady
+  }
+
+  private get buttonText(): string {
+    const isReady = store.isReady
+    const isConnected = store.isConnected
+    return isReady
+      ? isConnected
+        ? 'disconnect'
+        : 'connect'
+      : CONFIG.TEXTS.UNKNOWN_STATUS
+  }
+
   /***
    * Connects or disconnects to VPN server, depends on current connection state.
    * Is connection state is unknown - does nothing
    * @returns {Promise<void>}
    */
-  async connectDisconnect () {
+  private async connectDisconnect() {
     if (!store.isReady) {
       return
     }
@@ -65,21 +99,4 @@ export default class App extends AppTequilapi {
       await this.connect()
     }
   }
-
-  render () {
-    const isReady = store.isReady
-    const isConnected = store.isConnected
-    const connectText = isReady
-      ? (isConnected ? 'disconnect' : 'connect')
-      : CONFIG.TEXTS.UNKNOWN_STATUS
-    return (
-      <View style={styles.container} transform={[{ scaleX: 2 }, { scaleY: 2 }]}>
-        <Text>{store.ConnectionStatus ? store.ConnectionStatus.status : CONFIG.TEXTS.UNKNOWN}</Text>
-        <Text>IP: {store.IP}</Text>
-        <Proposals proposalsFetcher={this.proposalFetcher} proposalsStore={store} />
-        <Button title={connectText} onPress={this.connectDisconnect} disabled={!isReady}/>
-        { store.Statistics ? <Stats {...store.Statistics} /> : null }
-      </View>
-    )
-  }
 }

js/app/proposals-styles.ts

@@ -15,16 +15,16 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import {StyleSheet, ViewStyle} from 'react-native'
+import { StyleSheet, ViewStyle } from 'react-native'
 
-interface ProposalsStyles {
-  picker: ViewStyle
+type ProposalsStyles = {
+  picker: ViewStyle,
 }
 
 export default StyleSheet.create({
   picker: {
     width: 130,
     height: 20,
-    margin: 20
-  }
+    margin: 20,
+  },
 }) as ProposalsStyles