title: Cancel a saga when an action is dispatched with redux-saga
body: <p>I start a timer for a stopwatch React component when a START action is dispatched:</p>
  
  <pre><code>import 'babel-polyfill'
  import { call, put } from 'redux-saga/effects'
  import { delay, takeEvery, takeLatest } from 'redux-saga'
  import { tick, START, TICK, STOP } from './actions'
  
  const ONE_SECOND = 1000
  
  export function * timerTickWorkerSaga (getState) {
    yield call(delay, ONE_SECOND)
    yield put(tick())
  }
  
  export default function * timerTickSaga () {
    yield* takeEvery([START, TICK], timerTickWorkerSaga)
    yield* takeLatest(STOP, cancel(timerTickWorkerSaga))
  }
  /*
    The saga should start when either a START or a TICK is dispatched
    The saga should stop running when a stop is dispatched
  */
  </code></pre>
  
  <p>I have trouble stopping the saga when the <code>STOP</code> action is dispatched from my component. I have tried using <code>cancel</code> and <code>cancelled</code> effects from within my worker saga:</p>
  
  <pre><code>if(yield(take(STOP)) {
    yield cancel(timerTickWorkerSaga)
  }
  </code></pre>
  
  <p>as well as the approach in the first code block where I try and stop the saga from the watching service.</p>