// states

const isConnectedSet = createEvent()

const socketSet = createEvent()

const headersSet = createEvent()

​

const $isConnected = restore(isConnectedSet, false)

const $socket = restore(socketSet, null)

const $headers = restore(headersSet, null)

​

function subscribeToChannel(channelSource) {

  const subscribe = createEvent()

  const unsubscribe = createEvent()

​

  const unsubscribeFx = createEffect().use(({socket, channel}) => {

    socket.emit('unsubscribe', {

      channel,

    })

  })

​

  const subscribeFx = createEffect().use(({socket, channel, headers}) => {

    socket.emit('subscribe', {

      channel,

      auth: {

        headers,

      },

    })

  })

​

  const hasSocket = guard($socket, {

    filter: socket => !!socket,

  })

​

  const hasChannel = guard(channelSet, {

    filter: channel => !!channel,

  })

​

  // TODO combine channel, socket and headers

  const paramsChanged = createEvent()

​

  // unsubscribe when new subscription params or event fired

  sample({

    source: subscribeFx.done,

    clock: merge([subscribeFx, unsubscribe]),

    fn: ({params}) => params,

    target: unsubscribeFx,

  })

​

  sample({

    source: paramsChanged,

    clock: merge([subscribe, paramsChanged]),

    target: subscribeFx,

  })

​

  subscribe()

​

  return {subscribe, unsubscribe, paramsChanged}

}

​

// app

​

const channelSet = createEvent(null)

const sub = subscribeToChannel(channelSet)

​

const fakeSocket = {

  emit(event, payload) {

    console.log('emit', event, payload)

  },

}

​

sub.subscribe()

socketSet(fakeSocket)

channelSet('fake-channel')

isConnectedSet(true)

​

​

​