docs(website): update router docs

Author: christianalfoni

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

@@ -44,9 +44,9 @@ import { Operator, pipe } from 'overmind'
 import { Page } from './types'
 import * as o from './operators'
 
-export const showHomePage: Operator<{}> = o.setPage(Page.HOME)
+export const showHomePage: Operator<void> = o.setPage(Page.HOME)
 
-export const showUsersPage: Operator<{}> = pipe(
+export const showUsersPage: Operator<void> = pipe(
   o.setPage(Page.USERS),
   o.closeUserModal(),
   o.shouldLoadUsers(),

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

@@ -6,9 +6,10 @@ export default (ts) =>
           code: `
 import page from 'page'
 
-interface IParams {
+// We allow void type which is used to define "no params"
+type IParams = {
   [param: string]: string  
-}
+} | void
 
 export const router = {
   initialize(routes: { [url: string]: (params: IParams) => void }) {

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

@@ -8,9 +8,9 @@ import { Operator, pipe, parallel } from 'overmind'
 import { Page } from './types'
 import * as o from './operators'
 
-export const showHomePage: Operator<{}> = o.setPage(Page.HOME)
+export const showHomePage: Operator<void> = o.setPage(Page.HOME)
 
-export const showUsersPage: Operator<{}> = pipe(
+export const showUsersPage: Operator<void> = pipe(
   o.setPage(Page.USERS),
   o.closeUserModal(),
   o.shouldLoadUsers(),

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

@@ -7,9 +7,9 @@ export default (ts) =>
 import page from 'page'
 import queryString from 'query-string'
 
-interface IParams {
-  [param: string]: string
-}
+type IParams = {
+  [param: string]: string  
+} | void
 
 export const router = {
   initialize(routes: { [url: string]: (IParams) => void }) {

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

@@ -7,41 +7,16 @@ export default (ts) =>
 import { Operator, mutate, filter } from 'overmind'
 import { Page } from './types'
 
-export const closeUserModal: <T>() => Operator<T> = () =>
-  mutate(function closeUserModal({ state }) {
-    state.modalUser = null
-  })
-
-export const setPage: <T>(page: Page) => Operator<T> = () =>
-  mutate(function setPage({ state }) {
-    state.currentPage = page
-  })
-
-export const shouldLoadUsers: <T>() => Operator<T> = () => 
-  filter(function shouldLoadUsers({ state }) {
-    return !Boolean(state.users.length)
-  })
-
-export const loadUsers: <T>() => Operator<T> = () => 
-  mutate(async function loadUsers({ state, effects }) {
-    state.isLoadingUsers = true
-    state.users = await effects.api.getUsers()
-    state.isLoadingUsers = false
-  })
+...
 
-export const loadUserWithDetails: () => Operator<{ id: string }> = () => 
+export const loadUserWithDetails: <T extends { id: string }>() => Operator<T> = () => 
   mutate(async function loadUserWithDetails({ state, effects }, params) {
     state.isLoadingUserDetails = true
     state.modalUser = await effects.api.getUserWithDetails(params.id)
     state.isLoadingUserDetails = false
   })
 
-export const shouldLoadUserWithDetails: <T>() => Operator<{ id: string }, T> = () => 
-  filter(function shouldLoadUserWithDetails({ state }, params) {
-    return !state.modalUser || state.modalUser.id !== params.id
-  })
-
-export const setCurrentUserModalTabIndex: <T>() => Operator<{ tab: string }, T> = () =>
+export const setCurrentUserModalTabIndex: <T extends { tab: string }>() => Operator<T> = () =>
   mutate(function setCurrentUserModalTabIndex({ state }, params) {
     state.currentUserModalTabIndex = Number(params.tab)
   })
@@ -54,9 +29,9 @@ import { Operator, pipe, parallel } from 'overmind'
 import { Page } from './types'
 import * as o from './operators'
 
-export const showHomePage: Operator<{}> = o.setPage(Page.HOME)
+export const showHomePage: Operator<void> = o.setPage(Page.HOME)
 
-export const showUsersPage: Operator<{}> = pipe(
+export const showUsersPage: Operator<void> = pipe(
   o.setPage(Page.USERS),
   o.closeUserModal(),
   o.shouldLoadUsers(),

packages/overmind-website/guides/intermediate/02_routing.md

@@ -57,9 +57,9 @@ A straight forward way to solve this is to simply also change the page in the **
 h(Example, { name: "guide/routing/compose" })
 ```
 
-By splitting up all our logic into operators we were able to make our actions completely declarative and at the same time reuse logic across them. Very often applications share some, but not all logic. The *operators* file gives use maintaineable code and the *actions* file gives us readable code.
+By splitting up all our logic into operators we were able to make our actions completely declarative and at the same time reuse logic across them. The *operators* file gives use maintaineable code and the *actions* file gives us readable code.
 
-We could actually make this better though. There is no reason to wait for the user of the modal to load before we load the users list in the background. We can fix this with the **parallel** operator. Now the list of users and the single user loads at the same time. That makes sense as loading a single user is probably faster than loading the whole list.
+We could actually make this better though. There is no reason to wait for the user of the modal to load before we load the users list in the background. We can fix this with the **parallel** operator. Now the list of users and the single user loads at the same time.
 
 ```marksy
 h(Example, { name: "guide/routing/parallel" })

packages/overmind-website/src/overmind/effects.ts

@@ -42,7 +42,7 @@ export const router = (() => {
     getPath() {
       return currentPath
     },
-    route(url: string, action: (payload: RouteContext<any>) => void) {
+    route(url: string, action: (payload: RouteContext<{} | void>) => void) {
       page(url, ({ params, pathname, querystring }) => {
         // We want to preserve the query
         const query = queryString.parse(querystring)