takeWith about k-ramel HOT 21 CLOSED

import { reaction } from 'k-simple-state'
 
export const complete = reaction((action, store) => {
  const { todos } = store.data 
  const todo = todos.get(action.payload)
  todos.set({ ...todo, completed: true })
})

import { when } from 'k-simple-state'
import { complete } from './todos'

export default [
  complete.when('@@ui/CLICKED_COMPLETE'),
  // or
  when('@@ui/CLICKED_COMPLETE')(complete),
]

// todos.js
import { takeWith } from 'k-simple-state'
 
export const completeWhen = takeWith(action, store) => {
  const { todos } = store.data 
  const todo = todos.get(action.payload)
  todos.set({ ...todos, completed: true })
}

// listeners.js
import { completeWhen } from './todos' 

export default [
  // here it seems odd to me to call a fonction 'complete' passing an action type :)
  completeWhen('@@ui/CLICKED_COMPLETE'),
]

 // take
 on(filters)(reaction)

 // takeWith
 handle(reaction)(filters)

// todos.js
import { handle } from 'k-simple-state'
 
export const handleComplete = handle((action, store) => {
  const { todos } = store.data 
  const todo = todos.get(action.payload)
  todos.set({ ...todos, completed: true })
})

// listeners.js
import { handleComplete } from './todos' 

export default [
  handleComplete('@@ui/CLICKED_COMPLETE'),
]

 // take
 when(filters)(reaction)

 // takeWith
 handle(reaction)(filters)

// todos.js
import { takeWith } from 'k-simple-state'
 
export const complete = takeWith((action, store) => {
  const { todos } = store.data 
  const todo = todos.get(action.payload)
  todos.set({ ...todos, completed: true })
})

// listeners.js
import { complete } from './todos' 

export default [
  complete.on('@@ui/CLICKED_COMPLETE'),
]

complete.when('@@ui/CLICKED_COMPLETE')

complete.match('@@ui/CLICKED_COMPLETE')

  complete.when('@@ui/CLICKED_COMPLETE')
  complete.whenLatest('@@ui/CLICKED_COMPLETE')
  complete.debounce('@@ui/CLICKED_COMPLETE', 500)
  ...

complete('@@ui/CLICKED_COMPLETE') // or rename the function completeWhen
complete.when('@@ui/CLICKED_COMPLETE')

import { reaction } from 'k-simple-state'

const { latest, take /* or when */, etc } = reaction

// ...

import { latest, take, takeWith } from 'k-simple-state/reactions'

// take version
const onComplete = latest(take('@@ui/CLICKED_COMPLETE'))
onComplete(() => /* do something */)

// takeWith version
const completeWhen = takeWith(() => /* do something */)
latest(completeWhen('@@ui/CLICKED_COMPLETE'))

// take version
const onComplete = compose(latest, take)('@@ui/CLICKED_COMPLETE')
onComplete(() => /* do something */)

// takeWith version
const completeWhen = takeWith(() => /* do something */)
compose(completeWhen, latest)('@@ui/CLICKED_COMPLETE')

const complete = (action, store) => { /* do something */}

// debounce events and call `complete`
compose(
  when('@@ui/CLICKED_COMPLETE')
  debounce, 
)(complete)

// same thing different approach
const debouncedComplete = debounce(complete)
when('@@ui/CLICKED_COMPLETE')(debouncedComplete)
when('@@ui/OTHER_CLICKED')(debouncedComplete)

// calls `complete` on every events
when('@@ui/CLICKED_COMPLETE')(complete)

when('@@ui/CLICKED_COMPLETE')(complete)

reaction(complete).when('@@ui/CLICKED_COMPLETE')
reaction(complete).when('@@ui/CLICKED_COMPLETE_2')