Merge pull request #90 from byte-fe/refactor/tslint

style(lint): add ts-lint

Author: ArrayZoneYour

package.json

@@ -8,6 +8,7 @@
   "scripts": {
     "build": "microbundle -o ./dist --sourcemap false",
     "commit": "git-cz",
+    "lint-ts": "tslint -c tslint.json 'src/**/*.ts'",
     "lint-md": "remark .",
     "test": "jest --silent",
     "test:coverage": "jest --collect-coverage --silent"
@@ -42,6 +43,7 @@
     "remark-lint": "^6.0.4",
     "remark-preset-lint-recommended": "^3.0.2",
     "ts-jest": "^24.0.0",
+    "tslint": "^5.14.0",
     "typescript": "^3.3.1"
   },
   "husky": {

src/global.ts

@@ -1,15 +1,17 @@
-let State = {}
-let Actions = {}
-let AsyncState = {}
+const State = {}
+const Actions = {}
+const AsyncState = {}
 // Communicate between Provider-Consumer and Hooks
-let Setter: Setter = {
-  // classSetter stores the setState from Provider, invoke the classSetter.setState can update the state of Global Provider.
+const Setter: Setter = {
+  // classSetter stores the setState from Provider
+  // Invoke the classSetter.setState can update the state of Global Provider.
   classSetter: undefined,
-  // functionSetter stores the setState returned by useStore. These setStates can invoke the rerender of hooks components.
+  // functionSetter stores the setState returned by useStore.
+  // These setStates can invoke the rerender of hooks components.
   functionSetter: {}
 }
 
-let subscriptions = {}
+const subscriptions = {}
 
 let devTools: any
 let withDevTools = false
@@ -22,7 +24,7 @@ export default {
   Setter,
   State,
   devTools,
-  withDevTools,
+  subscriptions,
   uid,
-  subscriptions
+  withDevTools
 } as Global

src/helper.ts

@@ -1,7 +1,7 @@
 import produce from 'immer'
 import { createContext } from 'react'
 import Global from './global'
-import { applyMiddlewares, actionMiddlewares } from './middlewares'
+import { actionMiddlewares, applyMiddlewares } from './middlewares'
 
 const initialProviderState: Global['State'] = {}
 const GlobalContext = createContext(initialProviderState)
@@ -25,15 +25,15 @@ const consumerAction = (
   modelContext: { modelName: string }
 ) => async (params: any, middlewareConfig?: any) => {
   const context: InnerContext = {
-    type: 'outer',
-    modelName: modelContext.modelName,
-    actionName: action.name,
     Global,
+    action,
+    actionName: action.name,
+    consumerActions,
+    middlewareConfig,
+    modelName: modelContext.modelName,
     newState: null,
     params,
-    middlewareConfig,
-    consumerActions,
-    action
+    type: 'outer'
   }
   await applyMiddlewares(actionMiddlewares, context)
 }
@@ -42,7 +42,7 @@ const consumerActions = (
   actions: Actions,
   modelContext: { modelName: string }
 ) => {
-  let ret: any = {}
+  const ret: any = {}
   Object.entries<Action>(actions).forEach(([key, action]) => {
     ret[key] = consumerAction(action, modelContext)
   })
@@ -51,7 +51,9 @@ const consumerActions = (
 
 const setPartialState = (
   name: keyof typeof Global['State'],
-  partialState: typeof Global['State'] | Function
+  partialState:
+    | typeof Global['State']
+    | ((state: typeof Global['State']['name']) => void)
 ) => {
   if (typeof partialState === 'function') {
     let state = Global.State[name]

src/index.tsx

@@ -1,12 +1,12 @@
 /// <reference path="./index.d.ts" />
 import * as React from 'react'
-import Global from './global'
 import { PureComponent, useEffect, useState } from 'react'
+import Global from './global'
 import {
-  GlobalContext,
   Consumer,
+  consumerActions,
   getInitialState,
-  consumerActions
+  GlobalContext
 } from './helper'
 import { actionMiddlewares, applyMiddlewares, middlewares } from './middlewares'
 
@@ -34,16 +34,16 @@ const Model = <M extends Models>(models: M, initialState?: Global['State']) => {
   }
   return {
     actions,
-    useStore,
-    getState,
-    getInitialState,
     getActions,
+    getInitialState,
+    getState,
     subscribe,
-    unsubscribe
+    unsubscribe,
+    useStore
   } as {
     useStore: <K extends keyof M>(
       name: K,
-      depActions?: (keyof Get<M[K], 'actions'>)[]
+      depActions?: Array<keyof Get<M[K], 'actions'>>
     ) => [Get<M[K], 'state'>, getConsumerActionsType<Get<M[K], 'actions'>>]
     getState: <K extends keyof M>(modelName: K) => Readonly<Get<M[K], 'state'>>
     getActions: <K extends keyof M>(
@@ -52,12 +52,14 @@ const Model = <M extends Models>(models: M, initialState?: Global['State']) => {
     getInitialState: typeof getInitialState
     subscribe: <K extends keyof M>(
       modelName: K,
-      actionName: keyof Get<M[K], 'actions'> | (keyof Get<M[K], 'actions'>)[],
-      callback: Function
+      actionName:
+        | keyof Get<M[K], 'actions'>
+        | Array<keyof Get<M[K], 'actions'>>,
+      callback: () => void
     ) => void
     unsubscribe: <K extends keyof M>(
       modelName: K,
-      actionName: keyof Get<M[K], 'actions'> | (keyof Get<M[K], 'actions'>)[]
+      actionName: keyof Get<M[K], 'actions'> | Array<keyof Get<M[K], 'actions'>>
     ) => void
     actions: {
       [K in keyof M]: Readonly<getConsumerActionsType<Get<M[K], 'actions'>>>
@@ -72,7 +74,7 @@ const unsubscribe = (modelName: string, actions: string | string[]) => {
 const subscribe = (
   modelName: string,
   actions: string | string[],
-  callback?: Function
+  callback?: () => void
 ) => {
   if (Array.isArray(actions)) {
     actions.forEach(actionName => {
@@ -110,15 +112,15 @@ const getActions = (
     ([key, action]) =>
       (updaters[key] = async (params: any, middlewareConfig?: any) => {
         const context: InnerContext = {
-          modelName,
+          action,
           actionName: key,
+          consumerActions,
+          middlewareConfig,
+          modelName,
           newState: null,
           params,
-          middlewareConfig,
-          consumerActions,
-          action: action,
-          Global,
-          ...baseContext
+          ...baseContext,
+          Global
         }
         await applyMiddlewares(actionMiddlewares, context)
       })
@@ -129,13 +131,14 @@ const getActions = (
 const useStore = (modelName: string, depActions?: string[]) => {
   const setState = useState(Global.State[modelName])[1]
   Global.uid += 1
-  const _hash = '' + Global.uid
-  if (!Global.Setter.functionSetter[modelName])
+  const hash = '' + Global.uid
+  if (!Global.Setter.functionSetter[modelName]) {
     Global.Setter.functionSetter[modelName] = {}
-  Global.Setter.functionSetter[modelName][_hash] = { setState, depActions }
+  }
+  Global.Setter.functionSetter[modelName][hash] = { setState, depActions }
   useEffect(() => {
     return function cleanup() {
-      delete Global.Setter.functionSetter[modelName][_hash]
+      delete Global.Setter.functionSetter[modelName][hash]
     }
   })
   const updaters = getActions(modelName, { setState, type: 'function' })

src/middlewares.ts

@@ -1,4 +1,4 @@
-import { setPartialState, timeout, getCache } from './helper'
+import { getCache, setPartialState, timeout } from './helper'
 // -- Middlewares --
 
 const tryCatch: Middleware = async (context, restMiddlewares) => {
@@ -52,19 +52,20 @@ const setNewState: Middleware = async (context, restMiddlewares) => {
 
 const stateUpdater: Middleware = async (context, restMiddlewares) => {
   const { modelName, next, Global } = context
-  context.type === 'function' &&
-    context.setState &&
+  if (context.type === 'function' && context.setState) {
     context.setState(Global.State[modelName])
+  }
   await next(restMiddlewares)
 }
 
 const subscription: Middleware = async (context, restMiddlewares) => {
   const { modelName, actionName, next, Global } = context
   const subscriptions = Global.subscriptions[`${modelName}_${actionName}`]
-  subscriptions &&
+  if (subscriptions) {
     subscriptions.forEach(callback => {
       callback()
     })
+  }
   await next(restMiddlewares)
 }
 
@@ -143,15 +144,15 @@ if (process.env.NODE_ENV === 'production') {
 }
 
 const middlewares = {
-  tryCatch,
+  communicator,
+  consoleDebugger,
+  devToolsListener,
   getNewState,
   getNewStateWithCache,
   setNewState,
   stateUpdater,
-  communicator,
   subscription,
-  devToolsListener,
-  consoleDebugger
+  tryCatch
 }
 
 const applyMiddlewares = async (
@@ -160,9 +161,9 @@ const applyMiddlewares = async (
 ) => {
   context.next = (restMiddlewares: Middleware[]) =>
     restMiddlewares.length > 0 &&
-    restMiddlewares[0](<Context>context, restMiddlewares.slice(1))
+    restMiddlewares[0](context as Context, restMiddlewares.slice(1))
   if (middlewares.length > 0) {
-    await middlewares[0](<Context>context, middlewares.slice(1))
+    await middlewares[0](context as Context, middlewares.slice(1))
   }
 }
 

tslint.json

@@ -0,0 +1,15 @@
+{
+  "defaultSeverity": "error",
+  "extends": ["tslint:recommended"],
+  "jsRules": {},
+  "rules": {
+    "arrow-parens": false,
+    "max-classes-per-file": false,
+    "member-access": false,
+    "no-console": false,
+    "quotemark": false,
+    "semicolon": false,
+    "trailing-comma": false
+  },
+  "rulesDirectory": ["./src/"]
+}