docs(website): update docs to latest changes

Author: christianalfoni

packages/overmind-website/api/action.md

@@ -4,8 +4,10 @@
 h(Example, { name: "api/action"})
 ```
 
-An action is where you write the logic of the application. Every action receives one argument called the **context**. This context holds the state of application, whatever effects you have defined and optionally value passed in when the action was called.
+An action is where you write the logic of the application. Every action receives one argument called the **context**. This context holds: 
 
-This context gives Overmind the ability to understand what state you are changing and what effects you are running. Additionally this context makes your actions highly testable as it can easily be mocked.
+`{ state, actions, ...effects }`
+
+This context gives Overmind the primarily the ability to understand what state you are changing and what effects you are running. You can also use other actions defined in your application. Additionally this context makes your actions highly testable as it can easily be mocked.
 
 State changes are restricted to these actions. That means if you try to change the state outside of an action you will get an error. The state changes are also scoped to the action. That means it does not matter if you perform the state change asynchronously, either by defining the action as an **async** function or for example use a **setTimeout**. You can change the state at any time within the action.

packages/overmind-website/examples/api/onInitialize.ts

@@ -8,7 +8,12 @@ export default (ts, view) =>
           code: `
 import { OnInitialize } from 'overmind'
 
-const onInitialize: OnInitialize = async ({ value: overmind, state, api }) => {
+const onInitialize: OnInitialize = async ({
+  value: overmind,
+  state,
+  actions,
+  api
+}) => {
   const initialData = await api.getInitialData()
   state.initialData = initialData
 }
@@ -38,7 +43,12 @@ const config = {
         {
           fileName: 'overmind/onInitialize.js',
           code: `
-const onInitialize = async ({ value: overmind, state, api }) => {
+const onInitialize = async ({
+  value: overmind,
+  state,
+  actions,
+  api
+}) => {
   const initialData = await api.getInitialData()
   state.initialData = initialData
 }

packages/overmind-website/examples/guide/usingovermindwithreact/hoc.ts

@@ -34,7 +34,7 @@ import { connect, Connect } from '../overmind'
 type Props = {} & Connect
 
 const App: React.FunctionComponent<Props> = ({ overmind }) => {
-  const { state, actions } = overmind
+  const { state, actions, effects, addMutationListener } = overmind
 
   return <div />
 }
@@ -65,7 +65,7 @@ import React from 'react'
 import { connect } from '../overmind'
 
 const App = ({ overmind }) => {
-  const { state, actions } = overmind
+  const { state, actions, effects, addMutationListener } = overmind
 
   return <div />
 }

packages/overmind-website/examples/guide/usingovermindwithreact/hoc_compareprop.ts

@@ -14,8 +14,6 @@ class App extends React.Component<Props> {
     return this.props.overmind !== nextProps.overmind
   }
   render() {
-    const { state, actions } = this.props.overmind
-
     return <div />
   }
 }
@@ -36,8 +34,6 @@ class App extends React.Component {
     return this.props.overmind !== nextProps.overmind
   }
   render() {
-    const { state, actions } = this.props.overmind
-
     return <div />
   }
 }

packages/overmind-website/examples/guide/usingovermindwithreact/hook.ts

@@ -30,7 +30,7 @@ import * as React from 'react'
 import { useOvermind } from '../overmind'
 
 const App: React.FunctionComponent = () => {
-  const { state, actions } = useOvermind()
+  const { state, actions, effects, addMutationListener } = useOvermind()
 
   return <div />
 }
@@ -61,7 +61,7 @@ import React from 'react'
 import { useOvermind } from '../overmind'
 
 const App = () => {
-  const { state, actions } = useOvermind()
+  const { state, actions, effects, addMutationListener } = useOvermind()
 
   return <div />
 }

packages/overmind-website/guides/beginner/03_connectingcomponents.md

@@ -65,12 +65,16 @@ All the actions defined in the Overmind application is available to connected co
 h(Example, { name: "guide/connectingcomponents/actions" })
 ```
 
-## Effects
+## Reactions
 
 Sometimes you want to make something happen inside a component related to a state change. This is typically doing some manual work on the DOM. When you connect a component to overmind it also gets access to **addMutationListener**. This function allows you to subscribe to changes in state, mutations as we call them. Each mutation holds information about what kind of mutation it was, at what path it happened and even any arguments used in the mutation. You can use all this information to create an effect.
 
 This example shows how you can scroll to the top of the page every time you change the current article of the app.
 
 ```marksy
 h(Example, { name: "guide/connectingcomponents/effects" })
-```
+```
+
+## Effects
+
+Any effects you define in your Overmind application is also exposed to the components. They can be found on the property **effects**. It is encouraged that you keep your logic inside actions, but you might be in a situation where you want some other relationship between components and Overmind. A shared effect is the way to go.

packages/overmind-website/guides/beginner/06_usingovermindwithreact.md

@@ -29,7 +29,7 @@ If you pass a state object or array as a property to a child component you will
 h(Example, { name: "guide/usingovermindwithreact/hoc_passprop" })
 ```
 
-### Effects
+### Reactions
 
 To run effects in components based on changes to state you use the **addMutationListener** function in the lifecycle hooks of React.
 

packages/overmind-website/guides/beginner/07_usingovermindwithangular.md

@@ -27,7 +27,7 @@ If you pass a state object or array as a property to a child component you will
 h(Example, { name: "guide/usingovermindwithangular/passprop" })
 ```
 
-## Effects
+## OvermindProvider
 
 To run effects in components based on changes to state you use the **addMutationListener** function in the lifecycle hooks of Angular.
 

packages/overmind-website/guides/beginner/08_usingovermindwithvue.md

@@ -17,7 +17,7 @@ If you pass a state object or array as a property to a child component you will
 h(Example, { name: "guide/usingovermindwithvue/passprops" })
 ```
 
-## Effects
+## OvermindProvider
 
 To run effects in components based on changes to state you use the **addMutationListener** function in the lifecycle hooks of Vue.