feat(overmind): add AsyncAction type and update docs

Author: christianalfoni

packages/node_modules/overmind/src/index.ts

@@ -67,9 +67,12 @@ export interface Config {}
 
 export interface Context extends IContext<Config> {}
 
-export interface Action<Value = void, ReturnValue = void | Promise<void>>
+export interface Action<Value = void, ReturnValue = void>
   extends IAction<Config, Value, ReturnValue> {}
 
+export interface AsyncAction<Value = void, ReturnValue = void>
+  extends IAction<Config, Value, Promise<ReturnValue>> {}
+
 export interface Derive<Parent extends IState, Value>
   extends IDerive<Config, Parent, Value> {}
 

packages/overmind-website/examples/guide/getstarted/changestate.ts

@@ -1,4 +1,4 @@
-import { tsAppIndex } from '../../templates'
+import { tsAppIndex, tsSimpleAppIndex } from '../../templates'
 
 export default (ts) =>
   ts
@@ -15,8 +15,7 @@ export const changeCount: Action<number> = ({ state }, countChange) => {
         },
         {
           fileName: 'overmind/index.ts',
-          code: tsAppIndex(
-            'angular',
+          code: tsSimpleAppIndex(
             `
 import { state } from './state'
 import * as actions from './actions'

packages/overmind-website/examples/guide/getstarted/createapp.ts

@@ -1,4 +1,4 @@
-import { tsAppIndex } from '../../templates'
+import { tsAppIndex, tsSimpleAppIndex } from '../../templates'
 
 export default (ts) =>
   ts
@@ -17,8 +17,7 @@ export const state: State = {
         },
         {
           fileName: 'overmind/index.ts',
-          code: tsAppIndex(
-            'react',
+          code: tsSimpleAppIndex(
             `
 import { state } from './state'
 

packages/overmind-website/examples/guide/getstarted/effect.ts

@@ -1,4 +1,4 @@
-import { tsAppIndex } from '../../templates'
+import { tsAppIndex, tsSimpleAppIndex } from '../../templates'
 
 export default (ts) =>
   ts
@@ -9,7 +9,7 @@ export default (ts) =>
 export const bip = (() => {
   const context = new AudioContext()
 
-  return (factor) => {
+  return (factor: number) => {
     const o = context.createOscillator()
     const g = context.createGain()
 
@@ -22,15 +22,13 @@ export const bip = (() => {
     )
 
     o.start(0)
-
   }
 })()
 `,
         },
         {
           fileName: 'overmind/index.ts',
-          code: tsAppIndex(
-            'angular',
+          code: tsSimpleAppIndex(
             `
 import { state } from './state'
 import * as actions from './actions'
@@ -87,7 +85,6 @@ export const config = {
         )
   
         o.start(0)
-  
       }
     })()
   }

packages/overmind-website/examples/guide/goingfunctional/clean.ts

@@ -4,14 +4,19 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Operator, pipe, debounce } from 'overmind'
-import * as o from './operators'
+import { Operator, pipe, debounce, mutate, filter } from 'overmind'
 
 export const search: Operator<string> = pipe(
-  o.setQuery(),
-  o.lengthGreaterThan(2),
+  mutate(({ state }, value) => {
+    state.query = value
+  }),
+  filter(({ state }) => state.query.length > 2),
   debounce(200),
-  o.getSearchResult()
+  mutate(({ state, effects }) => {
+    state.isSearching = true
+    state.searchResult = await effects.api.search(state.query)
+    state.isSearching = false
+  })
 )
   `,
         },
@@ -20,14 +25,19 @@ export const search: Operator<string> = pipe(
         {
           fileName: 'overmind/actions.js',
           code: `
-import { pipe, debounce } from 'overmind'
-import * as o from './operators'
+import { pipe, debounce, mutate, filter } from 'overmind'
 
 export const search = pipe(
-  o.setQuery(),
-  o.lengthGreaterThan(2),
+  mutate(({ state }, value) => {
+    state.query = value
+  }),
+  filter(({ state }) => state.query.length > 2),
   debounce(200),
-  o.getSearchResult()
+  mutate(({ state, effects }) => {
+    state.isSearching = true
+    state.searchResult = await effects.api.search(state.query)
+    state.isSearching = false
+  })
 )
   `,
         },

packages/overmind-website/examples/guide/routing/compose_imperative.ts

@@ -4,14 +4,14 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Action } from 'overmind'
+import { Action, AsyncAction } from 'overmind'
 import { Page } from './types'
 
 export const showHomePage: Action = ({ state }) => {
   state.currentPage = Page.HOME
 }
 
-export const showUsersPage: Action = ({ state, effects }) => {
+export const showUsersPage: AsyncAction = async ({ state, effects }) => {
   state.currentPage = Page.USERS
   state.modalUser = null
 
@@ -22,7 +22,7 @@ export const showUsersPage: Action = ({ state, effects }) => {
   }
 }
 
-export const showUserModal: Action<{ id: string }> = ({ state, actions }, params) => {
+export const showUserModal: AsyncAction<{ id: string }> = async ({ state, actions }, params) => {
   actions.showUsersPage()
   state.isLoadingUserDetails = true
   state.modalUser = await effects.api.getUserWithDetails(params.id)

packages/overmind-website/examples/guide/routing/setup.ts

@@ -4,21 +4,21 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Action } from 'overmind'
+import { Action, AsyncAction } from 'overmind'
 
 export const showHomePage: Action = ({ state }) => {
   state.currentPage = 'home'
 }
 
-export const showUsersPage: Action = async ({ state, effects }) => {
+export const showUsersPage: AsyncAction = async ({ state, effects }) => {
   state.modalUser = null
   state.currentPage = 'users'
   state.isLoadingUsers = true
   state.users = await effects.api.getUsers()
   state.isLoadingUsers = false
 }
 
-export const showUserModal: Action<{ id: string }> = async ({ state, effects }, params) => {
+export const showUserModal: AsyncAction<{ id: string }> = async ({ state, effects }, params) => {
   state.isLoadingUserDetails = true
   state.modalUser = await effects.api.getUserWithDetails(params.id)
   state.isLoadingUserDetails = false

packages/overmind-website/examples/guide/routing/tab_imperative.ts

@@ -4,14 +4,14 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Action } from 'overmind'
+import { Action, AsyncAction } from 'overmind'
 import { Page } from './types'
 
 export const showHomePage: Action = ({ state }) => {
   state.currentPage = Page.HOME
 }
 
-export const showUsersPage: Action = ({ state, effects }) => {
+export const showUsersPage: AsyncAction = async ({ state, effects }) => {
   state.currentPage = Page.USERS
   state.modalUser = null
 
@@ -22,7 +22,7 @@ export const showUsersPage: Action = ({ state, effects }) => {
   }
 }
 
-export const showUserModal: Action<{ id: string, tab: string }> = ({ state, actions }, params) => {
+export const showUserModal: AsyncAction<{ id: string, tab: string }> = async ({ state, actions }, params) => {
   actions.showUsersPage()
   state.currentUserModalTabIndex = Number(params.tab)
   state.isLoadingUserDetails = true

packages/overmind-website/examples/guide/runningsideeffects/changestate.ts

@@ -4,9 +4,9 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Action } from 'overmind'
+import { AsyncAction } from 'overmind'
 
-export const loadApp: Action = async ({ effects, state }) => {
+export const loadApp: AsyncAction = async ({ effects, state }) => {
   state.currentUser = await effects.api.getCurrentUser()
 }
   `,

packages/overmind-website/examples/guide/runningsideeffects/getuser.ts

@@ -4,10 +4,10 @@ export default (ts) =>
         {
           fileName: 'overmind/actions.ts',
           code: `
-import { Action } from 'overmind'
+import { AsyncAction } from 'overmind'
 import { User } from './state'
 
-export const getCurrentUser: Action = async ({ effects, state }) => {
+export const getCurrentUser: AsyncAction = async ({ effects, state }) => {
   state.currentUser = await effects.http.get<User>('/user')
 }
   `,